From 42a6917eeee149f7348a4eaf524ba76bac1240cf Mon Sep 17 00:00:00 2001
From: Guy Carmeli <guyca@users.noreply.github.com>
Date: Wed, 1 Apr 2020 16:53:37 +0300
Subject: [PATCH] Refactor right buttons (#6090)

Refactor right buttons

This pr started with an attempt to eliminate button flickering entirely when updating buttons which contain react components via mergeOptions. While the attempt wasn't 100% successful, I dit get some insights in the process.

* It's not possible to add buttons at specific indices. Buttons contain an order property which determines the order of the button in the TopBar. To somewhat overcome this limitation, we can let users control button order via options.

* When a right most component button is replaced with another component button, the rest of the buttons shift to the right since the newly added component isn't measured when it's added to the menu and its width is zero.
We usually handle this situation with the `waitForRender` option but since buttons are measured with `MeasureSpec.UNSPECIFIED`, their dimensions are zero. Because of this, I've added options to set button dimensions.

* When updating buttons via mergeOptions, if a component button is already added to the menu with the same order we will not remove and added it again. This mitigates flickering in some situations.

* Textual button style properties were applied by traversing the view hierarchy and searching for the TextView corresponding to the button and updating its styles directly.
There was an inherent bug in this logic where if two buttons contained the same text, styles could have been applied to the wrong TextView. We now apply styles directly on the button using spans.
---
 .../parse/Component.java                      |  15 +-
 .../parse/params/Button.java                  |  17 ++-
 .../parse/params/Text.java                    |   4 +
 .../presentation/StackPresenter.java          | 101 ++++++------
 .../utils/ButtonPresenter.java                |  72 +--------
 .../reactnativenavigation/utils/ButtonSpan.kt |  27 ++++
 .../utils/CollectionUtils.java                |  44 +++++-
 .../utils/Functions.java                      |   4 +
 .../reactnativenavigation/utils/IdFactory.kt  |  17 +++
 .../utils/ObjectUtils.java                    |   4 +
 .../TitleBarButtonController.java             |  47 ++++--
 .../topbar/TopBarController.java              |  41 ++++-
 .../views/titlebar/TitleBar.java              |  51 +++++--
 .../views/titlebar/TitleBarButtonCreator.java |   9 +-
 .../titlebar/TitleBarReactButtonView.java     |  23 ++-
 .../views/topbar/TopBar.java                  |  39 +++--
 .../com/reactnativenavigation/TestUtils.java  |   4 +-
 ...ck.java => TitleBarButtonCreatorMock.java} |  13 +-
 .../utils/TitleBarHelper.java                 |  16 +-
 .../viewcontrollers/StackPresenterTest.java   | 100 +++++++-----
 .../TitleBarButtonControllerTest.java         |  61 ++++++++
 .../viewcontrollers/TitleBarTest.java         |  77 ----------
 .../TopBarButtonControllerTest.java           |  73 +--------
 .../viewcontrollers/TopBarControllerTest.java | 144 ++++++++++++++++++
 .../stack/StackControllerTest.java            |   4 +-
 lib/src/interfaces/Options.ts                 |   8 +
 playground/src/screens/OptionsScreen.js       |  10 +-
 playground/src/screens/RoundedButton.js       |   3 +-
 playground/src/testIDs.js                     |   2 +
 29 files changed, 652 insertions(+), 378 deletions(-)
 create mode 100644 lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonSpan.kt
 create mode 100644 lib/android/app/src/main/java/com/reactnativenavigation/utils/IdFactory.kt
 rename lib/android/app/src/test/java/com/reactnativenavigation/mocks/{TopBarButtonCreatorMock.java => TitleBarButtonCreatorMock.java} (65%)
 create mode 100644 lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonControllerTest.java
 create mode 100644 lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarControllerTest.java

diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/parse/Component.java b/lib/android/app/src/main/java/com/reactnativenavigation/parse/Component.java
index 854585ecf03..0b39cf7b2f3 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/parse/Component.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/parse/Component.java
@@ -2,9 +2,12 @@
 
 import com.reactnativenavigation.parse.params.Bool;
 import com.reactnativenavigation.parse.params.NullBool;
+import com.reactnativenavigation.parse.params.NullNumber;
 import com.reactnativenavigation.parse.params.NullText;
+import com.reactnativenavigation.parse.params.Number;
 import com.reactnativenavigation.parse.params.Text;
 import com.reactnativenavigation.parse.parsers.BoolParser;
+import com.reactnativenavigation.parse.parsers.NumberParser;
 import com.reactnativenavigation.parse.parsers.TextParser;
 
 import org.json.JSONObject;
@@ -18,6 +21,8 @@ public static Component parse(JSONObject json) {
         result.componentId = TextParser.parse(json, "componentId");
         result.alignment = Alignment.fromString(TextParser.parse(json, "alignment").get(""));
         result.waitForRender = BoolParser.parse(json, "waitForRender");
+        result.width = NumberParser.parse(json, "width");
+        result.height = NumberParser.parse(json, "height");
 
         return result;
     }
@@ -26,12 +31,16 @@ public static Component parse(JSONObject json) {
     public Text componentId = new NullText();
     public Alignment alignment = Alignment.Default;
     public Bool waitForRender = new NullBool();
+    public Number width = new NullNumber();
+    public Number height = new NullNumber();
 
     void mergeWith(Component other) {
         if (other.componentId.hasValue()) componentId = other.componentId;
         if (other.name.hasValue()) name = other.name;
         if (other.waitForRender.hasValue()) waitForRender = other.waitForRender;
         if (other.alignment != Alignment.Default) alignment = other.alignment;
+        if (other.width.hasValue()) width = other.width;
+        if (other.height.hasValue()) height = other.height;
     }
 
     public void mergeWithDefault(Component defaultOptions) {
@@ -39,6 +48,8 @@ public void mergeWithDefault(Component defaultOptions) {
         if (!name.hasValue()) name = defaultOptions.name;
         if (!waitForRender.hasValue()) waitForRender = defaultOptions.waitForRender;
         if (alignment == Alignment.Default) alignment = defaultOptions.alignment;
+        if (!width.hasValue()) width = defaultOptions.width;
+        if (!height.hasValue()) height = defaultOptions.height;
     }
 
     public boolean hasValue() {
@@ -49,6 +60,8 @@ public boolean equals(Component other) {
         return name.equals(other.name) &&
                componentId.equals(other.componentId) &&
                alignment.equals(other.alignment) &&
-               waitForRender.equals(other.waitForRender);
+               waitForRender.equals(other.waitForRender) &&
+               width.equals(other.width) &&
+               height.equals(other.height);
     }
 }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Button.java b/lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Button.java
index 7f40d9fb29e..a119b03a980 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Button.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Button.java
@@ -6,9 +6,10 @@
 import com.reactnativenavigation.parse.Component;
 import com.reactnativenavigation.parse.parsers.BoolParser;
 import com.reactnativenavigation.parse.parsers.ColorParser;
-import com.reactnativenavigation.parse.parsers.NumberParser;
+import com.reactnativenavigation.parse.parsers.FractionParser;
 import com.reactnativenavigation.parse.parsers.TextParser;
 import com.reactnativenavigation.utils.CompatUtils;
+import com.reactnativenavigation.utils.IdFactory;
 import com.reactnativenavigation.utils.TypefaceLoader;
 
 import org.json.JSONArray;
@@ -19,10 +20,12 @@
 
 import androidx.annotation.Nullable;
 
+import static com.reactnativenavigation.utils.ObjectUtils.take;
+
 public class Button {
     public String instanceId = "btn" + CompatUtils.generateViewId();
 
-    @Nullable public String id;
+    public String id = "btn" + CompatUtils.generateViewId();
     public Text accessibilityLabel = new NullText();
     public Text text = new NullText();
     public Bool enabled = new NullBool();
@@ -30,7 +33,7 @@ public class Button {
     public Number showAsAction = new NullNumber();
     public Colour color = new NullColor();
     public Colour disabledColor = new NullColor();
-    public Number fontSize = new NullNumber();
+    public Fraction fontSize = new NullFraction();
     private Text fontWeight = new NullText();
     @Nullable public Typeface fontFamily;
     public Text icon = new NullText();
@@ -56,7 +59,7 @@ public boolean equals(Button other) {
 
     private static Button parseJson(JSONObject json, TypefaceLoader typefaceManager) {
         Button button = new Button();
-        button.id = json.optString("id");
+        button.id = take(json.optString("id"), "btn" + CompatUtils.generateViewId());
         button.accessibilityLabel = TextParser.parse(json, "accessibilityLabel");
         button.text = TextParser.parse(json, "text");
         button.enabled = BoolParser.parse(json, "enabled");
@@ -64,7 +67,7 @@ private static Button parseJson(JSONObject json, TypefaceLoader typefaceManager)
         button.showAsAction = parseShowAsAction(json);
         button.color = ColorParser.parse(json, "color");
         button.disabledColor = ColorParser.parse(json, "disabledColor");
-        button.fontSize = NumberParser.parse(json, "fontSize");
+        button.fontSize = FractionParser.parse(json, "fontSize");
         button.fontFamily = typefaceManager.getTypeFace(json.optString("fontFamily", ""));
         button.fontWeight = TextParser.parse(json, "fontWeight");
         button.testId = TextParser.parse(json, "testID");
@@ -116,6 +119,10 @@ public boolean hasIcon() {
         return icon.hasValue();
     }
 
+    public int getIntId() {
+        return IdFactory.Companion.get(component.componentId.get(id));
+    }
+
     private static Number parseShowAsAction(JSONObject json) {
         final Text showAsAction = TextParser.parse(json, "showAsAction");
         if (!showAsAction.hasValue()) {
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Text.java b/lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Text.java
index e8b996c6775..a179d96fadb 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Text.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Text.java
@@ -7,6 +7,10 @@ public Text(String value) {
         super(value);
     }
 
+    public int length() {
+        return hasValue() ? value.length() : 0;
+    }
+
     @NonNull
     @Override
     public String toString() {
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/presentation/StackPresenter.java b/lib/android/app/src/main/java/com/reactnativenavigation/presentation/StackPresenter.java
index ea0f2abd2d4..6bd784164fd 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/presentation/StackPresenter.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/presentation/StackPresenter.java
@@ -25,7 +25,6 @@
 import com.reactnativenavigation.utils.StatusBarUtils;
 import com.reactnativenavigation.utils.UiUtils;
 import com.reactnativenavigation.viewcontrollers.IReactView;
-import com.reactnativenavigation.viewcontrollers.ReactViewCreator;
 import com.reactnativenavigation.viewcontrollers.TitleBarButtonController;
 import com.reactnativenavigation.viewcontrollers.TitleBarReactViewController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
@@ -33,6 +32,7 @@
 import com.reactnativenavigation.viewcontrollers.stack.StackController;
 import com.reactnativenavigation.viewcontrollers.topbar.TopBarBackgroundViewController;
 import com.reactnativenavigation.viewcontrollers.topbar.TopBarController;
+import com.reactnativenavigation.views.titlebar.TitleBarButtonCreator;
 import com.reactnativenavigation.views.titlebar.TitleBarReactViewCreator;
 import com.reactnativenavigation.views.topbar.TopBar;
 import com.reactnativenavigation.views.topbar.TopBarBackgroundViewCreator;
@@ -44,12 +44,14 @@
 import java.util.List;
 import java.util.Map;
 
+import androidx.annotation.NonNull;
 import androidx.annotation.Nullable;
 import androidx.annotation.RestrictTo;
 import androidx.appcompat.widget.Toolbar;
 
 import static com.reactnativenavigation.utils.CollectionUtils.*;
 import static com.reactnativenavigation.utils.ObjectUtils.perform;
+import static com.reactnativenavigation.utils.ObjectUtils.take;
 
 public class StackPresenter {
     private static final int DEFAULT_TITLE_COLOR = Color.BLACK;
@@ -66,7 +68,7 @@ public class StackPresenter {
     private TitleBarButtonController.OnClickListener onClickListener;
     private final RenderChecker renderChecker;
     private final TopBarBackgroundViewCreator topBarBackgroundViewCreator;
-    private final ReactViewCreator buttonCreator;
+    private final TitleBarButtonCreator buttonCreator;
     private Options defaultOptions;
 
     private List<TitleBarButtonController> currentRightButtons = new ArrayList<>();
@@ -79,7 +81,7 @@ public class StackPresenter {
     public StackPresenter(Activity activity,
                           TitleBarReactViewCreator titleViewCreator,
                           TopBarBackgroundViewCreator topBarBackgroundViewCreator,
-                          ReactViewCreator buttonCreator,
+                          TitleBarButtonCreator buttonCreator,
                           IconResolver iconResolver,
                           RenderChecker renderChecker,
                           Options defaultOptions) {
@@ -268,25 +270,24 @@ private void applyTopBarVisibility(TopBarOptions options, AnimationsOptions anim
     }
 
     private void applyButtons(TopBarOptions options, ViewController child) {
-        List<Button> rightButtons = mergeButtonsWithColor(options.buttons.right, options.rightButtonColor, options.rightButtonDisabledColor);
-        List<Button> leftButtons = mergeButtonsWithColor(options.buttons.left, options.leftButtonColor, options.leftButtonDisabledColor);
-
-        if (rightButtons != null) {
-            List<TitleBarButtonController> rightButtonControllers = getOrCreateButtonControllers(componentRightButtons.get(child.getView()), rightButtons);
+        if (options.buttons.right != null) {
+            List<Button> rightButtons = mergeButtonsWithColor(options.buttons.right, options.rightButtonColor, options.rightButtonDisabledColor);
+            List<TitleBarButtonController> rightButtonControllers = getOrCreateButtonControllersByInstanceId(componentRightButtons.get(child.getView()), rightButtons);
             componentRightButtons.put(child.getView(), keyBy(rightButtonControllers, TitleBarButtonController::getButtonInstanceId));
             if (!CollectionUtils.equals(currentRightButtons, rightButtonControllers)) {
                 currentRightButtons = rightButtonControllers;
-                topBar.setRightButtons(rightButtonControllers);
+                topBarController.applyRightButtons(currentRightButtons);
             }
         } else {
             currentRightButtons = null;
             topBar.clearRightButtons();
         }
 
-        if (leftButtons != null) {
-            List<TitleBarButtonController> leftButtonControllers = getOrCreateButtonControllers(componentLeftButtons.get(child.getView()), leftButtons);
+        if (options.buttons.left != null) {
+            List<Button> leftButtons = mergeButtonsWithColor(options.buttons.left, options.leftButtonColor, options.leftButtonDisabledColor);
+            List<TitleBarButtonController> leftButtonControllers = getOrCreateButtonControllersByInstanceId(componentLeftButtons.get(child.getView()), leftButtons);
             componentLeftButtons.put(child.getView(), keyBy(leftButtonControllers, TitleBarButtonController::getButtonInstanceId));
-            topBar.setLeftButtons(leftButtonControllers);
+            topBarController.setLeftButtons(leftButtonControllers);
         } else {
             topBar.clearLeftButtons();
         }
@@ -298,19 +299,25 @@ private void applyButtons(TopBarOptions options, ViewController child) {
         topBar.setOverflowButtonColor(options.rightButtonColor.get(Color.BLACK));
     }
 
-    private List<TitleBarButtonController> getOrCreateButtonControllers(@Nullable Map<String, TitleBarButtonController> currentButtons, @Nullable List<Button> buttons) {
+    private List<TitleBarButtonController> getOrCreateButtonControllersByInstanceId(@Nullable Map<String, TitleBarButtonController> currentButtons, @Nullable List<Button> buttons) {
         if (buttons == null) return null;
         Map<String, TitleBarButtonController> result = new LinkedHashMap<>();
+        forEach(buttons, b -> result.put(b.instanceId, getOrDefault(currentButtons, b.instanceId, () -> createButtonController(b))));
+        return new ArrayList<>(result.values());
+    }
+
+    private List<TitleBarButtonController> getOrCreateButtonControllersById(@Nullable Map<String, TitleBarButtonController> currentButtons,@NonNull List<Button> buttons) {
+        ArrayList result = new ArrayList<TitleBarButtonController>();
         for (Button b : buttons) {
-            result.put(b.instanceId, currentButtons != null && currentButtons.containsKey(b.instanceId) ? currentButtons.get(b.instanceId) : createButtonController(b));
+            result.add(take(first(perform(currentButtons, null, Map::values), button -> button.getId().equals(b.id)), createButtonController(b)));
         }
-        return new ArrayList<>(result.values());
+        return result;
     }
 
     private TitleBarButtonController createButtonController(Button button) {
         TitleBarButtonController controller = new TitleBarButtonController(activity,
                 iconResolver,
-                new ButtonPresenter(topBar.getTitleBar(), button),
+                new ButtonPresenter(button),
                 button,
                 buttonCreator,
                 onClickListener
@@ -354,28 +361,34 @@ private void mergeOrientation(OrientationOptions orientationOptions) {
     }
 
     private void mergeButtons(TopBarOptions options, TopBarButtons buttons, View child) {
-        List<Button> rightButtons = mergeButtonsWithColor(buttons.right, options.rightButtonColor, options.rightButtonDisabledColor);
-        List<Button> leftButtons = mergeButtonsWithColor(buttons.left, options.leftButtonColor, options.leftButtonDisabledColor);
+        mergeRightButtons(options, buttons, child);
+        mergeLeftButton(options, buttons, child);
+        mergeBackButton(buttons);
+    }
 
-        List<TitleBarButtonController> rightButtonControllers = getOrCreateButtonControllers(componentRightButtons.get(child), rightButtons);
-        List<TitleBarButtonController> leftButtonControllers = getOrCreateButtonControllers(componentLeftButtons.get(child), leftButtons);
+    private void mergeRightButtons(TopBarOptions options, TopBarButtons buttons, View child) {
+        if (buttons.right == null) return;
+        List<Button> rightButtons = mergeButtonsWithColor(buttons.right, options.rightButtonColor, options.rightButtonDisabledColor);
+        List<TitleBarButtonController> toMerge = getOrCreateButtonControllersById(componentRightButtons.get(child), rightButtons);
+        List<TitleBarButtonController> toRemove = difference(currentRightButtons, toMerge, TitleBarButtonController::equals);
+        forEach(toRemove, TitleBarButtonController::destroy);
 
-        if (rightButtonControllers != null) {
-            Map previousRightButtons = componentRightButtons.put(child, keyBy(rightButtonControllers, TitleBarButtonController::getButtonInstanceId));
-            if (previousRightButtons != null) forEach(previousRightButtons.values(), TitleBarButtonController::destroy);
-        }
-        if (leftButtonControllers != null) {
-            Map previousLeftButtons = componentLeftButtons.put(child, keyBy(leftButtonControllers, TitleBarButtonController::getButtonInstanceId));
-            if (previousLeftButtons != null) forEach(previousLeftButtons.values(), TitleBarButtonController::destroy);
+        if (!CollectionUtils.equals(currentRightButtons, toMerge)) {
+            topBarController.mergeRightButtons(toMerge, toRemove);
+            currentRightButtons = toMerge;
         }
+        if (options.rightButtonColor.hasValue()) topBar.setOverflowButtonColor(options.rightButtonColor.get());
+    }
 
-        if (buttons.right != null) {
-            if (!CollectionUtils.equals(currentRightButtons, rightButtonControllers)) {
-                currentRightButtons = rightButtonControllers;
-                topBar.setRightButtons(rightButtonControllers);
-            }
-        }
-        if (buttons.left != null) topBar.setLeftButtons(leftButtonControllers);
+    private void mergeLeftButton(TopBarOptions options, TopBarButtons buttons, View child) {
+        if (buttons.left == null) return;
+        List<Button> leftButtons = mergeButtonsWithColor(buttons.left, options.leftButtonColor, options.leftButtonDisabledColor);
+        List<TitleBarButtonController> toMerge = getOrCreateButtonControllersById(componentLeftButtons.get(child), leftButtons);
+        componentLeftButtons.put(child, keyBy(toMerge, TitleBarButtonController::getButtonInstanceId));
+        topBarController.setLeftButtons(toMerge);
+    }
+
+    private void mergeBackButton(TopBarButtons buttons) {
         if (buttons.back.hasValue()) {
             if (buttons.back.visible.isFalse()) {
                 topBar.clearLeftButtons();
@@ -383,21 +396,15 @@ private void mergeButtons(TopBarOptions options, TopBarButtons buttons, View chi
                 topBar.setBackButton(createButtonController(buttons.back));
             }
         }
-
-        if (options.rightButtonColor.hasValue()) topBar.setOverflowButtonColor(options.rightButtonColor.get());
     }
 
-    @Nullable
-    private List<Button> mergeButtonsWithColor(List<Button> buttons, Colour buttonColor, Colour disabledColor) {
-        List<Button> result = null;
-        if (buttons != null) {
-            result = new ArrayList<>();
-            for (Button button : buttons) {
-                Button copy = button.copy();
-                if (!button.color.hasValue()) copy.color = buttonColor;
-                if (!button.disabledColor.hasValue()) copy.disabledColor = disabledColor;
-                result.add(copy);
-            }
+    private List<Button> mergeButtonsWithColor(@NonNull List<Button> buttons, Colour buttonColor, Colour disabledColor) {
+        List<Button> result = new ArrayList<>();
+        for (Button button : buttons) {
+            Button copy = button.copy();
+            if (!button.color.hasValue()) copy.color = buttonColor;
+            if (!button.disabledColor.hasValue()) copy.disabledColor = disabledColor;
+            result.add(copy);
         }
         return result;
     }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonPresenter.java b/lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonPresenter.java
index 349e4d3446b..700a2ff262a 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonPresenter.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonPresenter.java
@@ -1,32 +1,18 @@
 package com.reactnativenavigation.utils;
 
-import android.graphics.Color;
 import android.graphics.PorterDuff;
 import android.graphics.PorterDuffColorFilter;
-import android.graphics.Typeface;
 import android.graphics.drawable.Drawable;
-import androidx.annotation.NonNull;
-import androidx.appcompat.widget.ActionMenuView;
-import androidx.appcompat.widget.Toolbar;
-import android.text.Spannable;
 import android.text.SpannableString;
-import android.text.style.AbsoluteSizeSpan;
-import android.view.MenuItem;
-import android.view.View;
-import android.widget.TextView;
 
 import com.reactnativenavigation.parse.params.Button;
 
-import java.util.ArrayList;
+import static android.text.Spanned.SPAN_EXCLUSIVE_INCLUSIVE;
 
 public class ButtonPresenter {
-    private final Toolbar toolbar;
-    private final ActionMenuView actionMenuView;
     private Button button;
 
-    public ButtonPresenter(Toolbar toolbar, Button button) {
-        this.toolbar = toolbar;
-        actionMenuView = ViewUtils.findChildrenByClass(toolbar, ActionMenuView.class).get(0);
+    public ButtonPresenter(Button button) {
         this.button = button;
     }
 
@@ -34,55 +20,9 @@ public void tint(Drawable drawable, int tint) {
         drawable.setColorFilter(new PorterDuffColorFilter(tint, PorterDuff.Mode.SRC_IN));
     }
 
-    public void setTypeFace(Typeface typeface) {
-        UiUtils.runOnPreDrawOnce(toolbar, () -> {
-            ArrayList<View> buttons = findActualTextViewInMenu();
-            for (View btn : buttons) {
-                ((TextView) btn).setTypeface(typeface);
-            }
-        });
+    public SpannableString getStyledText() {
+        SpannableString string = new SpannableString(button.text.get(""));
+        string.setSpan(new ButtonSpan(button), 0, button.text.length(), SPAN_EXCLUSIVE_INCLUSIVE);
+        return string;
     }
-
-    public void setFontSize(MenuItem menuItem) {
-        SpannableString spanString = new SpannableString(button.text.get());
-        if (this.button.fontSize.hasValue())
-            spanString.setSpan(
-                    new AbsoluteSizeSpan(button.fontSize.get(), true),
-                    0,
-                    button.text.get().length(),
-                    Spannable.SPAN_INCLUSIVE_INCLUSIVE
-            );
-        menuItem.setTitleCondensed(spanString);
-    }
-
-    public void setTextColor() {
-        UiUtils.runOnPreDrawOnce(toolbar, () -> {
-            ArrayList<View> buttons = findActualTextViewInMenu();
-            for (View btn : buttons) {
-                if (button.enabled.isTrueOrUndefined() && button.color.hasValue()) {
-                    setEnabledColor((TextView) btn);
-                } else if (button.enabled.isFalse()) {
-                    setDisabledColor((TextView) btn, button.disabledColor.get(Color.LTGRAY));
-                }
-            }
-        });
-    }
-
-    public void setDisabledColor(TextView btn, int color) {
-        btn.setTextColor(color);
-    }
-
-    public void setEnabledColor(TextView btn) {
-        btn.setTextColor(button.color.get());
-    }
-
-    @NonNull
-    private ArrayList<View> findActualTextViewInMenu() {
-        ArrayList<View> outViews = new ArrayList<>();
-        if (button.text.hasValue()) {
-            actionMenuView.findViewsWithText(outViews, button.text.get(), View.FIND_VIEWS_WITH_TEXT);
-        }
-        return outViews;
-    }
-
 }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonSpan.kt b/lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonSpan.kt
new file mode 100644
index 00000000000..1079d73ceb6
--- /dev/null
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonSpan.kt
@@ -0,0 +1,27 @@
+package com.reactnativenavigation.utils
+
+import android.graphics.Paint
+import android.graphics.Typeface
+import android.text.TextPaint
+import android.text.style.MetricAffectingSpan
+import com.reactnativenavigation.parse.params.Button
+import com.reactnativenavigation.parse.params.Colour
+import com.reactnativenavigation.parse.params.Fraction
+
+class ButtonSpan(private val button: Button) : MetricAffectingSpan() {
+    override fun updateDrawState(drawState: TextPaint) = apply(drawState)
+
+    override fun updateMeasureState(paint: TextPaint) = apply(paint)
+
+    private fun apply(paint: Paint) {
+        with(button) {
+            val fakeStyle = (paint.typeface?.style ?: 0) and (fontFamily?.style?.inv() ?: 1)
+            if (fakeStyle and Typeface.BOLD != 0) paint.isFakeBoldText = true
+            if (fakeStyle and Typeface.ITALIC != 0) paint.textSkewX = -0.25f
+            if (fontSize.hasValue()) paint.textSize = fontSize.get().toFloat()
+            if (color.hasValue()) paint.color = if (enabled.isTrueOrUndefined) color.get() else disabledColor.get()
+            paint.typeface = fontFamily
+        }
+
+    }
+}
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/utils/CollectionUtils.java b/lib/android/app/src/main/java/com/reactnativenavigation/utils/CollectionUtils.java
index daadde355b7..fb0d21126e1 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/utils/CollectionUtils.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/utils/CollectionUtils.java
@@ -14,11 +14,16 @@
 import androidx.annotation.Nullable;
 import androidx.core.util.Pair;
 
+@SuppressWarnings("WeakerAccess")
 public class CollectionUtils {
     public interface Apply<T> {
         void on(T t);
     }
 
+    public interface Comparator<T> {
+        boolean compare(T a, T b);
+    }
+
     public static boolean isNullOrEmpty(Collection collection) {
         return collection == null || collection.isEmpty();
     }
@@ -60,18 +65,42 @@ public static <T> List<T> filter(Collection<T> list, Filter<T> filter) {
         return result;
     }
 
+    public static <K, V> V getOrDefault(@Nullable Map<K, V> map, K key, Functions.FuncR<V> defaultValueCreator) {
+        if (map == null) return defaultValueCreator.run();
+        return map.containsKey(key) ? map.get(key) : defaultValueCreator.run();
+    }
+
     public static <T> List<T> merge(@Nullable Collection<T> a, @Nullable Collection<T> b, @NonNull List<T> defaultValue) {
         List<T> result = merge(a, b);
         return result == null ? defaultValue : result;
     }
 
-    public static <T> List<T> merge(@Nullable Collection<T> a, @Nullable Collection<T> b) {
+    public static <T> ArrayList<T> merge(@Nullable Collection<T> a, @Nullable Collection<T> b) {
         if (a == null && b == null) return null;
-        List<T> result = new ArrayList<>(get(a));
+        ArrayList<T> result = new ArrayList<>(get(a));
         result.addAll(get(b));
         return result;
     }
 
+    /**
+     * @return Items in a, that are not in b
+     */
+    public static <T> List<T> difference(@NonNull Collection<T> a, @Nullable Collection<T> b, Comparator<T> comparator) {
+        if (b == null) return new ArrayList<>(a);
+        ArrayList<T> results = new ArrayList<>();
+        forEach(a, btn -> {
+            if (!contains(b, btn, comparator)) results.add(btn);
+        });
+        return results;
+    }
+
+    private static <T> boolean contains(@NonNull Collection<T> items, T item, Comparator<T> comparator) {
+        for (T t : items) {
+            if (comparator.compare(t, item)) return true;
+        }
+        return false;
+    }
+
     public static <T> void forEach(@Nullable Collection<T> items, Apply<T> apply) {
         if (items != null) forEach(new ArrayList<>(items), 0, apply);
     }
@@ -94,6 +123,13 @@ public static <T> void forEach(@Nullable List<T> items, int startIndex, Apply<T>
         }
     }
 
+    public static <T> void forEachIndexed(@Nullable List<T> items, Functions.Func2<T, Integer> apply) {
+        if (items == null) return;
+        for (int i = 0; i < items.size(); i++) {
+            apply.run(items.get(i), i);
+        }
+    }
+
     public static @Nullable <T> T first(@Nullable Collection<T> items, Filter<T> by) {
         if (isNullOrEmpty(items)) return null;
         for (T item : items) {
@@ -170,4 +206,8 @@ public static <T> Collection<Pair<T, T>> zip(@Nullable Collection<T> a, @Nullabl
         }
         return result;
     }
+
+    public static @Nullable<T> T safeGet(List<T> items, int index) {
+        return index >= 0 && index < items.size() ? items.get(index) : null;
+    }
 }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/utils/Functions.java b/lib/android/app/src/main/java/com/reactnativenavigation/utils/Functions.java
index 4bb36e8b74e..5a2982b20aa 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/utils/Functions.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/utils/Functions.java
@@ -13,6 +13,10 @@ public interface Func1<T> {
         void run(T param);
     }
 
+    public interface Func2<T, S> {
+        void run(T param1, S param2);
+    }
+
     public interface FuncR<T> {
         T run();
     }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/utils/IdFactory.kt b/lib/android/app/src/main/java/com/reactnativenavigation/utils/IdFactory.kt
new file mode 100644
index 00000000000..3208afed261
--- /dev/null
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/utils/IdFactory.kt
@@ -0,0 +1,17 @@
+package com.reactnativenavigation.utils
+
+
+class IdFactory {
+    companion object {
+        private val stringIdToIntId = HashMap<String, Int>()
+        private var count = 0
+
+        fun get(id: String): Int {
+            return if (stringIdToIntId.containsKey(id)) {
+                stringIdToIntId[id]!!
+            } else {
+                (++count).apply { stringIdToIntId[id] = count }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/utils/ObjectUtils.java b/lib/android/app/src/main/java/com/reactnativenavigation/utils/ObjectUtils.java
index 783827aa7cf..7eae0e91c5e 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/utils/ObjectUtils.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/utils/ObjectUtils.java
@@ -19,6 +19,10 @@ public static <T> T take(@Nullable T obj, @NonNull T defaultValue) {
         return obj == null ? defaultValue : obj;
     }
 
+    public static <T> T getOrCreate(@Nullable T obj, @NonNull Functions.FuncR<T> creator) {
+        return obj == null ? creator.run() : obj;
+    }
+
     public static boolean notNull(Object o) {
         return o != null;
     }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonController.java b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonController.java
index 07fdd07c4cd..9f7e9b35298 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonController.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonController.java
@@ -21,25 +21,30 @@
 import com.reactnativenavigation.utils.ViewUtils;
 import com.reactnativenavigation.viewcontrollers.button.IconResolver;
 import com.reactnativenavigation.viewcontrollers.viewcontrolleroverlay.ViewControllerOverlay;
+import com.reactnativenavigation.views.titlebar.TitleBar;
+import com.reactnativenavigation.views.titlebar.TitleBarButtonCreator;
 import com.reactnativenavigation.views.titlebar.TitleBarReactButtonView;
 
 import java.util.List;
 
 import androidx.annotation.NonNull;
+import androidx.annotation.Nullable;
 import androidx.annotation.RestrictTo;
 import androidx.appcompat.widget.ActionMenuView;
 import androidx.appcompat.widget.Toolbar;
 import androidx.core.view.MenuItemCompat;
 
 public class TitleBarButtonController extends ViewController<TitleBarReactButtonView> implements MenuItem.OnMenuItemClickListener {
+    @Nullable private MenuItem menuItem;
+
     public interface OnClickListener {
         void onPress(String buttonId);
     }
 
     private final IconResolver navigationIconResolver;
-    private ButtonPresenter optionsPresenter;
+    private ButtonPresenter presenter;
     private final Button button;
-    private final ReactViewCreator viewCreator;
+    private final TitleBarButtonCreator viewCreator;
     private TitleBarButtonController.OnClickListener onPressListener;
     private Drawable icon;
 
@@ -52,15 +57,19 @@ public String getButtonInstanceId() {
         return button.instanceId;
     }
 
+    public int getButtonIntId() {
+        return button.getIntId();
+    }
+
     public TitleBarButtonController(Activity activity,
                                     IconResolver navigationIconResolver,
-                                    ButtonPresenter optionsPresenter,
+                                    ButtonPresenter presenter,
                                     Button button,
-                                    ReactViewCreator viewCreator,
+                                    TitleBarButtonCreator viewCreator,
                                     OnClickListener onClickListener) {
         super(activity, button.id, new YellowBoxDelegate(), new Options(), new ViewControllerOverlay(activity));
         this.navigationIconResolver = navigationIconResolver;
-        this.optionsPresenter = optionsPresenter;
+        this.presenter = presenter;
         this.button = button;
         this.viewCreator = viewCreator;
         this.onPressListener = onClickListener;
@@ -96,7 +105,7 @@ public String getCurrentComponentName() {
     @NonNull
     @Override
     protected TitleBarReactButtonView createView() {
-        view = (TitleBarReactButtonView) viewCreator.create(getActivity(), button.component.componentId.get(), button.component.name.get());
+        view = viewCreator.create(getActivity(), button.component);
         return (TitleBarReactButtonView) view.asView();
     }
 
@@ -106,6 +115,12 @@ public boolean onMenuItemClick(MenuItem item) {
         return true;
     }
 
+    public boolean equals(TitleBarButtonController other) {
+        if (other == this) return true;
+        if (!other.getId().equals(getId())) return false;
+        return button.equals(other.button);
+    }
+
     public void applyNavigationIcon(Toolbar toolbar) {
         navigationIconResolver.resolve(button, icon -> {
             setIconColor(icon);
@@ -126,8 +141,14 @@ private void setLeftButtonTestId(Toolbar toolbar) {
         });
     }
 
-    public void addToMenu(Toolbar toolbar, int position) {
-        MenuItem menuItem = toolbar.getMenu().add(Menu.NONE, position, position, button.text.get(""));
+    public void addToMenu(TitleBar titleBar, int order) {
+        if (button.component.hasValue() && titleBar.containsRightButton(menuItem, order)) return;
+        titleBar.getMenu().removeItem(button.getIntId());
+        menuItem = titleBar.getMenu().add(Menu.NONE, button.getIntId(), order, presenter.getStyledText());
+        applyButtonOptions(titleBar, menuItem);
+    }
+
+    private void applyButtonOptions(TitleBar titleBar, MenuItem menuItem) {
         if (button.showAsAction.hasValue()) menuItem.setShowAsAction(button.showAsAction.get());
         menuItem.setEnabled(button.enabled.isTrueOrUndefined());
         menuItem.setOnMenuItemClickListener(this);
@@ -145,13 +166,9 @@ public void onComplete(@NonNull Drawable icon) {
                         menuItem.setIcon(icon);
                     }
                 });
-            } else {
-                optionsPresenter.setTextColor();
-                if (button.fontSize.hasValue()) optionsPresenter.setFontSize(menuItem);
-                optionsPresenter.setTypeFace(button.fontFamily);
             }
         }
-        setTestId(toolbar, button.testId);
+        setTestId(titleBar, button.testId);
     }
 
     private void loadIcon(ImageLoader.ImagesLoadingListener callback) {
@@ -161,9 +178,9 @@ private void loadIcon(ImageLoader.ImagesLoadingListener callback) {
     private void setIconColor(Drawable icon) {
         if (button.disableIconTint.isTrue()) return;
         if (button.enabled.isTrueOrUndefined() && button.color.hasValue()) {
-            optionsPresenter.tint(icon, button.color.get());
+            presenter.tint(icon, button.color.get());
         } else if (button.enabled.isFalse()) {
-            optionsPresenter.tint(icon, button.disabledColor.get(Color.LTGRAY));
+            presenter.tint(icon, button.disabledColor.get(Color.LTGRAY));
         }
     }
 
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/topbar/TopBarController.java b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/topbar/TopBarController.java
index 9c108794d1a..e9a91f6607f 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/topbar/TopBarController.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/topbar/TopBarController.java
@@ -1,28 +1,35 @@
 package com.reactnativenavigation.viewcontrollers.topbar;
 
 import android.content.Context;
+import android.graphics.drawable.Drawable;
+import android.view.MenuItem;
 import android.view.View;
 
 import com.reactnativenavigation.anim.TopBarAnimator;
 import com.reactnativenavigation.parse.AnimationOptions;
-import com.reactnativenavigation.utils.CompatUtils;
+import com.reactnativenavigation.viewcontrollers.TitleBarButtonController;
 import com.reactnativenavigation.viewcontrollers.TitleBarReactViewController;
 import com.reactnativenavigation.views.StackLayout;
+import com.reactnativenavigation.views.titlebar.TitleBar;
 import com.reactnativenavigation.views.topbar.TopBar;
 
+import java.util.List;
+
 import androidx.annotation.VisibleForTesting;
 import androidx.viewpager.widget.ViewPager;
 
+import static com.reactnativenavigation.utils.CollectionUtils.*;
 import static com.reactnativenavigation.utils.ObjectUtils.perform;
 import static com.reactnativenavigation.utils.ViewUtils.isVisible;
 
 
 public class TopBarController {
     private TopBar topBar;
+    private TitleBar titleBar;
     private TopBarAnimator animator;
 
-    public TopBarController() {
-        animator = new TopBarAnimator();
+    public MenuItem getRightButton(int index) {
+        return titleBar.getRightButton(index);
     }
 
     public TopBar getView() {
@@ -33,15 +40,27 @@ public int getHeight() {
         return perform(topBar, 0, View::getHeight);
     }
 
+    public int getRightButtonsCount() {
+        return topBar.getRightButtonsCount();
+    }
+
+    public Drawable getLeftButton() {
+        return titleBar.getNavigationIcon();
+    }
+
     @VisibleForTesting
     public void setAnimator(TopBarAnimator animator) {
         this.animator = animator;
     }
 
+    public TopBarController() {
+        animator = new TopBarAnimator();
+    }
+
     public TopBar createView(Context context, StackLayout parent) {
         if (topBar == null) {
             topBar = createTopBar(context, parent);
-            topBar.setId(CompatUtils.generateViewId());
+            titleBar = topBar.getTitleBar();
             animator.bindView(topBar, parent);
         }
         return topBar;
@@ -98,4 +117,18 @@ public void resetViewProperties() {
     public void setTitleComponent(TitleBarReactViewController component) {
         topBar.setTitleComponent(component.getView());
     }
+
+    public void applyRightButtons(List<TitleBarButtonController> toAdd) {
+        topBar.clearRightButtons();
+        forEachIndexed(toAdd, (b, i) -> b.addToMenu(titleBar, (toAdd.size() - i) * 10));
+    }
+
+    public void mergeRightButtons(List<TitleBarButtonController> toAdd, List<TitleBarButtonController> toRemove) {
+        forEach(toRemove, btn -> topBar.removeRightButton(btn));
+        forEachIndexed(toAdd, (b, i) -> b.addToMenu(titleBar, (toAdd.size() - i) * 10));
+    }
+
+    public void setLeftButtons(List<TitleBarButtonController> leftButtons) {
+        titleBar.setLeftButtons(leftButtons);
+    }
 }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBar.java b/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBar.java
index a3e48f0d9b4..32e7ac90f1b 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBar.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBar.java
@@ -7,6 +7,7 @@
 import android.graphics.Typeface;
 import android.graphics.drawable.Drawable;
 import android.util.Log;
+import android.view.MenuItem;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.TextView;
@@ -18,10 +19,10 @@
 import com.reactnativenavigation.utils.ViewUtils;
 import com.reactnativenavigation.viewcontrollers.TitleBarButtonController;
 
+import java.util.ArrayList;
 import java.util.List;
 
-import javax.annotation.Nullable;
-
+import androidx.annotation.Nullable;
 import androidx.appcompat.widget.ActionMenuView;
 import androidx.appcompat.widget.Toolbar;
 
@@ -42,6 +43,22 @@ public class TitleBar extends Toolbar {
     private Boolean isTitleChanged = false;
     private Boolean isSubtitleChanged = false;
 
+    public MenuItem getRightButton(int index) {
+        return getMenu().getItem(index);
+    }
+
+    public int getRightButtonsCount() {
+        return getMenu().size();
+    }
+
+    public List<MenuItem> getRightButtons() {
+        List<MenuItem> items = new ArrayList<>();
+        for (int i = 0; i < getRightButtonsCount(); i++) {
+            items.add(i, getRightButton(i));
+        }
+        return items;
+    }
+
     public TitleBar(Context context) {
         super(context);
         getMenu();
@@ -110,13 +127,19 @@ public void setSubtitleAlignment(Alignment alignment) {
         subtitleAlignment = alignment;
     }
 
+    public boolean containsRightButton(@Nullable MenuItem menuItem, int order) {
+        return menuItem != null &&
+               getMenu().findItem(menuItem.getItemId()) != null &&
+               menuItem.getOrder() == order;
+    }
+
     public void alignTextView(Alignment alignment, TextView view) {
         if (StringUtils.isEmpty(view.getText())) return;
         int direction = view.getParent().getLayoutDirection();
         boolean isRTL = direction == View.LAYOUT_DIRECTION_RTL;
 
         if (alignment == Alignment.Center) {
-            view.setX((getWidth() - view.getWidth()) / 2);
+            view.setX((getWidth() - view.getWidth()) / 2f);
         } else if (leftButtonController != null) {
             view.setX(isRTL ? (getWidth() - view.getWidth()) - getContentInsetStartWithNavigation() : getContentInsetStartWithNavigation());
         } else {
@@ -128,13 +151,13 @@ public void alignTextView(Alignment alignment, TextView view) {
     protected void onLayout(boolean changed, int l, int t, int r, int b) {
         super.onLayout(changed, l, t, r, b);
 
-        if(changed || isTitleChanged) {
+        if (changed || isTitleChanged) {
             TextView title = findTitleTextView();
             if (title != null) this.alignTextView(titleAlignment, title);
             isTitleChanged = false;
         }
 
-        if(changed || isSubtitleChanged) {
+        if (changed || isSubtitleChanged) {
             TextView subtitle = findSubtitleTextView();
             if (subtitle != null) this.alignTextView(subtitleAlignment, subtitle);
             isSubtitleChanged = false;
@@ -190,7 +213,7 @@ private void clearLeftButton() {
         }
     }
 
-    private void clearRightButtons() {
+    public void clearRightButtons() {
         if (getMenu().size() > 0) getMenu().clear();
     }
 
@@ -216,14 +239,6 @@ private void setLeftButton(TitleBarButtonController button) {
         button.applyNavigationIcon(this);
     }
 
-    public void setRightButtons(List<TitleBarButtonController> rightButtons) {
-        if (rightButtons == null) return;
-        clearRightButtons();
-        for (int i = 0; i < rightButtons.size(); i++) {
-            rightButtons.get(i).addToMenu(this, rightButtons.size() - i - 1);
-        }
-    }
-
     public void setHeight(int height) {
         int pixelHeight = UiUtils.dpToPx(getContext(), height);
         if (pixelHeight == getLayoutParams().height) return;
@@ -257,4 +272,12 @@ private void enableOverflowForReactButtonViews(View child) {
             ((ViewGroup) child).setClipChildren(false);
         }
     }
+
+    public void removeRightButton(int buttonId) {
+        getMenu().removeItem(buttonId);
+    }
+
+    public boolean containsRightButton(TitleBarButtonController button) {
+        return getMenu().findItem(button.getButtonIntId()) != null;
+    }
 }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarButtonCreator.java b/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarButtonCreator.java
index fcd8c50d208..2b18ed00af1 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarButtonCreator.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarButtonCreator.java
@@ -3,9 +3,9 @@
 import android.app.Activity;
 
 import com.facebook.react.ReactInstanceManager;
-import com.reactnativenavigation.viewcontrollers.ReactViewCreator;
+import com.reactnativenavigation.parse.Component;
 
-public class TitleBarButtonCreator implements ReactViewCreator {
+public class TitleBarButtonCreator {
 
     private ReactInstanceManager instanceManager;
 
@@ -13,8 +13,7 @@ public TitleBarButtonCreator(ReactInstanceManager instanceManager) {
         this.instanceManager = instanceManager;
 	}
 
-	@Override
-	public TitleBarReactButtonView create(Activity activity, String componentId, String componentName) {
-        return new TitleBarReactButtonView(activity, instanceManager, componentId, componentName);
+	public TitleBarReactButtonView create(Activity activity, Component component) {
+        return new TitleBarReactButtonView(activity, instanceManager, component);
     }
 }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarReactButtonView.java b/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarReactButtonView.java
index 3050e9499f6..d9cffa2eb6e 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarReactButtonView.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarReactButtonView.java
@@ -4,17 +4,34 @@
 import android.content.Context;
 
 import com.facebook.react.ReactInstanceManager;
+import com.reactnativenavigation.parse.Component;
+import com.reactnativenavigation.parse.params.Number;
 import com.reactnativenavigation.react.ReactView;
 
+import static android.view.View.MeasureSpec.EXACTLY;
+import static android.view.View.MeasureSpec.UNSPECIFIED;
+import static android.view.View.MeasureSpec.makeMeasureSpec;
+import static com.reactnativenavigation.utils.UiUtils.dpToPx;
+
 @SuppressLint("ViewConstructor")
 public class TitleBarReactButtonView extends ReactView {
+    private final Component component;
 
-    public TitleBarReactButtonView(Context context, ReactInstanceManager reactInstanceManager, String componentId, String componentName) {
-        super(context, reactInstanceManager, componentId, componentName);
+    public TitleBarReactButtonView(Context context, ReactInstanceManager reactInstanceManager, Component component) {
+        super(context, reactInstanceManager, component.componentId.get(), component.name.get());
+        this.component = component;
     }
 
     @Override
     protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
-        super.onMeasure(MeasureSpec.makeMeasureSpec(MeasureSpec.getSize(widthMeasureSpec), MeasureSpec.UNSPECIFIED), heightMeasureSpec);
+        super.onMeasure(createSpec(widthMeasureSpec, component.width), createSpec(widthMeasureSpec, component.height));
+    }
+
+    private int createSpec(int measureSpec, Number dimension) {
+        if (dimension.hasValue()) {
+            return makeMeasureSpec(MeasureSpec.getSize(dpToPx(getContext(), dimension.get())), EXACTLY);
+        } else {
+            return makeMeasureSpec(MeasureSpec.getSize(measureSpec), UNSPECIFIED);
+        }
     }
 }
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/views/topbar/TopBar.java b/lib/android/app/src/main/java/com/reactnativenavigation/views/topbar/TopBar.java
index 387cfacf04c..d3b089d567c 100644
--- a/lib/android/app/src/main/java/com/reactnativenavigation/views/topbar/TopBar.java
+++ b/lib/android/app/src/main/java/com/reactnativenavigation/views/topbar/TopBar.java
@@ -6,6 +6,7 @@
 import android.graphics.Typeface;
 import android.os.Build;
 import android.view.Gravity;
+import android.view.MenuItem;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.FrameLayout;
@@ -32,7 +33,6 @@
 import androidx.annotation.ColorInt;
 import androidx.annotation.NonNull;
 import androidx.annotation.VisibleForTesting;
-import androidx.appcompat.widget.Toolbar;
 import androidx.viewpager.widget.ViewPager;
 
 import static android.view.ViewGroup.LayoutParams.MATCH_PARENT;
@@ -48,9 +48,14 @@ public class TopBar extends AppBarLayout implements ScrollEventListener.ScrollAw
     private View component;
     private float elevation = -1;
 
+    public int getRightButtonsCount() {
+        return titleBar.getRightButtonsCount();
+    }
+
     public TopBar(final Context context) {
         super(context);
         context.setTheme(R.style.TopBar);
+        setId(CompatUtils.generateViewId());
         collapsingBehavior = new TopBarCollapseBehavior(this);
         topTabs = new TopTabs(getContext());
         createLayout();
@@ -204,20 +209,12 @@ public void setBackButton(TitleBarButtonController backButton) {
         titleBar.setBackButton(backButton);
     }
 
-    public void setLeftButtons(List<TitleBarButtonController> leftButtons) {
-        titleBar.setLeftButtons(leftButtons);
-    }
-
     public void clearLeftButtons() {
         titleBar.setLeftButtons(Collections.emptyList());
     }
 
-    public void setRightButtons(List<TitleBarButtonController> rightButtons) {
-        titleBar.setRightButtons(rightButtons);
-    }
-
     public void clearRightButtons() {
-        titleBar.setRightButtons(Collections.emptyList());
+        titleBar.clearRightButtons();
     }
 
     public void setElevation(Double elevation) {
@@ -234,10 +231,18 @@ public void setElevation(float elevation) {
         }
     }
 
-    public Toolbar getTitleBar() {
+    public TitleBar getTitleBar() {
         return titleBar;
     }
 
+    public List<MenuItem> getRightButtons() {
+        return titleBar.getRightButtons();
+    }
+
+    public MenuItem getRightButton(int index) {
+        return titleBar.getRightButton(getRightButtonsCount() - index - 1);
+    }
+
     public void initTopTabs(ViewPager viewPager) {
         topTabs.setVisibility(VISIBLE);
         topTabs.init(viewPager);
@@ -284,4 +289,16 @@ public void setOverflowButtonColor(int color) {
     public void setLayoutDirection(LayoutDirection direction) {
         titleBar.setLayoutDirection(direction.get());
     }
+
+    public void removeRightButton(TitleBarButtonController button) {
+        removeRightButton(button.getButtonIntId());
+    }
+
+    public void removeRightButton(int buttonId) {
+        titleBar.removeRightButton(buttonId);
+    }
+
+    public boolean containsRightButton(TitleBarButtonController button) {
+        return titleBar.containsRightButton(button);
+    }
 }
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/TestUtils.java b/lib/android/app/src/test/java/com/reactnativenavigation/TestUtils.java
index e5e1a44677e..2d0fd4a8b3e 100644
--- a/lib/android/app/src/test/java/com/reactnativenavigation/TestUtils.java
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/TestUtils.java
@@ -7,7 +7,7 @@
 
 import com.reactnativenavigation.mocks.TitleBarReactViewCreatorMock;
 import com.reactnativenavigation.mocks.TopBarBackgroundViewCreatorMock;
-import com.reactnativenavigation.mocks.TopBarButtonCreatorMock;
+import com.reactnativenavigation.mocks.TitleBarButtonCreatorMock;
 import com.reactnativenavigation.parse.Options;
 import com.reactnativenavigation.parse.params.Bool;
 import com.reactnativenavigation.presentation.RenderChecker;
@@ -39,7 +39,7 @@ protected TopBar createTopBar(Context context, StackLayout stackLayout) {
                 .setId("stack")
                 .setChildRegistry(new ChildControllersRegistry())
                 .setTopBarController(topBarController)
-                .setStackPresenter(new StackPresenter(activity, new TitleBarReactViewCreatorMock(), new TopBarBackgroundViewCreatorMock(), new TopBarButtonCreatorMock(), new IconResolver(activity, new ImageLoader()), new RenderChecker(), new Options()))
+                .setStackPresenter(new StackPresenter(activity, new TitleBarReactViewCreatorMock(), new TopBarBackgroundViewCreatorMock(), new TitleBarButtonCreatorMock(), new IconResolver(activity, new ImageLoader()), new RenderChecker(), new Options()))
                 .setInitialOptions(new Options());
     }
 
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/mocks/TopBarButtonCreatorMock.java b/lib/android/app/src/test/java/com/reactnativenavigation/mocks/TitleBarButtonCreatorMock.java
similarity index 65%
rename from lib/android/app/src/test/java/com/reactnativenavigation/mocks/TopBarButtonCreatorMock.java
rename to lib/android/app/src/test/java/com/reactnativenavigation/mocks/TitleBarButtonCreatorMock.java
index bdd64a577f8..0bcd6308879 100644
--- a/lib/android/app/src/test/java/com/reactnativenavigation/mocks/TopBarButtonCreatorMock.java
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/mocks/TitleBarButtonCreatorMock.java
@@ -3,18 +3,23 @@
 import android.app.Activity;
 
 import com.facebook.react.ReactInstanceManager;
+import com.reactnativenavigation.parse.Component;
 import com.reactnativenavigation.react.events.ComponentType;
-import com.reactnativenavigation.viewcontrollers.ReactViewCreator;
+import com.reactnativenavigation.views.titlebar.TitleBarButtonCreator;
 import com.reactnativenavigation.views.titlebar.TitleBarReactButtonView;
 
 import static org.mockito.Mockito.mock;
 
-public class TopBarButtonCreatorMock implements ReactViewCreator {
+public class TitleBarButtonCreatorMock extends TitleBarButtonCreator {
+
+    public TitleBarButtonCreatorMock() {
+        super(null);
+    }
 
     @Override
-    public TitleBarReactButtonView create(Activity activity, String componentId, String componentName) {
+    public TitleBarReactButtonView create(Activity activity, Component component) {
         final ReactInstanceManager reactInstanceManager = mock(ReactInstanceManager.class);
-        return new TitleBarReactButtonView(activity, reactInstanceManager, componentId, componentName) {
+        return new TitleBarReactButtonView(activity, reactInstanceManager, component) {
             @Override
             public void sendComponentStart(ComponentType type) {
 
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/utils/TitleBarHelper.java b/lib/android/app/src/test/java/com/reactnativenavigation/utils/TitleBarHelper.java
index e2ecaa614fb..fa7f52924a9 100644
--- a/lib/android/app/src/test/java/com/reactnativenavigation/utils/TitleBarHelper.java
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/utils/TitleBarHelper.java
@@ -3,22 +3,14 @@
 import android.app.Activity;
 
 import com.reactnativenavigation.mocks.ImageLoaderMock;
-import com.reactnativenavigation.mocks.TopBarButtonCreatorMock;
+import com.reactnativenavigation.mocks.TitleBarButtonCreatorMock;
 import com.reactnativenavigation.parse.Component;
 import com.reactnativenavigation.parse.params.Button;
 import com.reactnativenavigation.parse.params.Text;
 import com.reactnativenavigation.viewcontrollers.TitleBarButtonController;
 import com.reactnativenavigation.viewcontrollers.button.IconResolver;
-import com.reactnativenavigation.views.titlebar.TitleBar;
-
-import androidx.appcompat.view.menu.ActionMenuItemView;
-import androidx.appcompat.widget.Toolbar;
 
 public class TitleBarHelper {
-    public static ActionMenuItemView getRightButton(Toolbar toolbar, int index) {
-        return (ActionMenuItemView) ViewUtils.findChildrenByClassRecursive(toolbar, ActionMenuItemView.class).get(toolbar.getMenu().size() - index - 1);
-    }
-
     public static Button textualButton(String text) {
         Button button = new Button();
         button.id = text + CompatUtils.generateViewId();
@@ -50,12 +42,12 @@ public static Button iconButton(String id, String icon) {
     }
 
 
-    public static TitleBarButtonController createButtonController(Activity activity, TitleBar titleBar, Button button) {
+    public static TitleBarButtonController createButtonController(Activity activity, Button button) {
         return new TitleBarButtonController(activity,
                 new IconResolver(activity, ImageLoaderMock.mock()),
-                new ButtonPresenter(titleBar, button),
+                new ButtonPresenter(button),
                 button,
-                new TopBarButtonCreatorMock(),
+                new TitleBarButtonCreatorMock(),
                 buttonId -> {}
         );
     }
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/StackPresenterTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/StackPresenterTest.java
index c5e7911f3e0..c7518065fae 100644
--- a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/StackPresenterTest.java
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/StackPresenterTest.java
@@ -14,7 +14,7 @@
 import com.reactnativenavigation.mocks.SimpleViewController;
 import com.reactnativenavigation.mocks.TitleBarReactViewCreatorMock;
 import com.reactnativenavigation.mocks.TopBarBackgroundViewCreatorMock;
-import com.reactnativenavigation.mocks.TopBarButtonCreatorMock;
+import com.reactnativenavigation.mocks.TitleBarButtonCreatorMock;
 import com.reactnativenavigation.parse.Alignment;
 import com.reactnativenavigation.parse.Component;
 import com.reactnativenavigation.parse.Options;
@@ -57,6 +57,9 @@
 import static android.view.ViewGroup.LayoutParams.MATCH_PARENT;
 import static android.view.ViewGroup.LayoutParams.WRAP_CONTENT;
 import static com.reactnativenavigation.utils.CollectionUtils.*;
+import static java.util.Arrays.asList;
+import static java.util.Collections.singletonList;
+import static java.util.Objects.requireNonNull;
 import static org.assertj.core.api.Java6Assertions.assertThat;
 import static org.mockito.ArgumentMatchers.any;
 import static org.mockito.ArgumentMatchers.anyBoolean;
@@ -99,8 +102,7 @@ public TitleBarReactView create(Activity activity, String componentId, String co
             }
         };
         renderChecker = spy(new RenderChecker());
-        IconResolver iconResolver = new IconResolver(activity, ImageLoaderMock.mock());
-        uut = spy(new StackPresenter(activity, titleViewCreator, new TopBarBackgroundViewCreatorMock(), new TopBarButtonCreatorMock(), iconResolver, renderChecker, new Options()));
+        uut = spy(new StackPresenter(activity, titleViewCreator, new TopBarBackgroundViewCreatorMock(), new TitleBarButtonCreatorMock(), new IconResolver(activity, ImageLoaderMock.mock()), renderChecker, new Options()));
         createTopBarController();
 
         parent = TestUtils.newStackController(activity)
@@ -119,7 +121,7 @@ public void isRendered() {
         Options o1 = new Options();
         o1.topBar.title.component = component(Alignment.Default);
         o1.topBar.background.component = component(Alignment.Default);
-        o1.topBar.buttons.right = new ArrayList<>(Collections.singletonList(componentBtn1));
+        o1.topBar.buttons.right = new ArrayList<>(singletonList(componentBtn1));
         uut.applyChildOptions(o1, parent, child);
 
         uut.isRendered(child.getView());
@@ -192,8 +194,8 @@ public void mergeOrientation() throws Exception {
     @Test
     public void mergeButtons() {
         uut.mergeChildOptions(EMPTY_OPTIONS, EMPTY_OPTIONS, parent, child);
-        verify(topBar, times(0)).setRightButtons(any());
-        verify(topBar, times(0)).setLeftButtons(any());
+        verify(topBarController, times(0)).applyRightButtons(any());
+        verify(topBarController, times(0)).setLeftButtons(any());
 
         Options options = new Options();
 
@@ -201,22 +203,22 @@ public void mergeButtons() {
         button.text = new Text("btn");
         options.topBar.buttons.right = new ArrayList<>(Collections.singleton(button));
         uut.mergeChildOptions(options, EMPTY_OPTIONS, parent, child);
-        verify(topBar, times(1)).setRightButtons(any());
+        verify(topBarController).mergeRightButtons(any(), any());
 
         options.topBar.buttons.left = new ArrayList<>();
         uut.mergeChildOptions(options, EMPTY_OPTIONS, parent, child);
-        verify(topBar, times(1)).setLeftButtons(any());
+        verify(topBarController).setLeftButtons(any());
     }
 
     @Test
     public void mergeButtons_previousRightButtonsAreDestroyed() {
         Options options = new Options();
-        options.topBar.buttons.right = new ArrayList<>(Collections.singletonList(componentBtn1));
+        options.topBar.buttons.right = new ArrayList<>(singletonList(componentBtn1));
         uut.applyChildOptions(options, parent, child);
         List<TitleBarButtonController> initialButtons = uut.getComponentButtons(child.getView());
         forEach(initialButtons, ViewController::ensureViewIsCreated);
 
-        options.topBar.buttons.right = new ArrayList<>(Collections.singletonList(componentBtn2));
+        options.topBar.buttons.right = new ArrayList<>(singletonList(componentBtn2));
         uut.mergeChildOptions(options, Options.EMPTY, parent, child);
         for (TitleBarButtonController button : initialButtons) {
             assertThat(button.isDestroyed()).isTrue();
@@ -224,35 +226,59 @@ public void mergeButtons_previousRightButtonsAreDestroyed() {
     }
 
     @Test
-    public void mergeButtons_mergingRightButtonsOnlyDestroysRightButtons() {
+    public void mergeRightButtons_mergingButtonsOnlyDestroysRightButtons() {
         Options a = new Options();
-        a.topBar.buttons.right = new ArrayList<>(Collections.singletonList(componentBtn1));
-        a.topBar.buttons.left = new ArrayList<>(Collections.singletonList(componentBtn2));
+        a.topBar.buttons.right = new ArrayList<>(singletonList(componentBtn1));
+        a.topBar.buttons.left = new ArrayList<>(singletonList(componentBtn2));
         uut.applyChildOptions(a, parent, child);
         List<TitleBarButtonController> initialButtons = uut.getComponentButtons(child.getView());
         forEach(initialButtons, ViewController::ensureViewIsCreated);
 
         Options b = new Options();
-        b.topBar.buttons.right = new ArrayList<>(Collections.singletonList(componentBtn2));
+        b.topBar.buttons.right = new ArrayList<>(singletonList(componentBtn2));
         uut.mergeChildOptions(b, Options.EMPTY, parent, child);
         assertThat(initialButtons.get(0).isDestroyed()).isTrue();
         assertThat(initialButtons.get(1).isDestroyed()).isFalse();
     }
 
     @Test
-    public void mergeButtons_mergingLeftButtonsOnlyDestroysLeftButtons() {
+    public void mergeRightButtons_buttonsAreCreatedOnlyIfNeeded() {
+        Options toApply = new Options();
+        toApply.topBar.buttons.right = new ArrayList<>(asList(textBtn1, componentBtn1));
+        uut.applyChildOptions(toApply, parent, child);
+
+        ArgumentCaptor<List<TitleBarButtonController>> captor1 = ArgumentCaptor.forClass(List.class);
+        verify(topBarController).applyRightButtons(captor1.capture());
+        assertThat(topBar.getTitleBar().getMenu().size()).isEqualTo(2);
+        List<TitleBarButtonController> appliedButtons = captor1.getValue();
+
+        Options toMerge = new Options();
+        toMerge.topBar.buttons.right = new ArrayList(requireNonNull(map(toApply.topBar.buttons.right, Button::copy)));
+        toMerge.topBar.buttons.right.add(1, componentBtn2);
+        uut.mergeChildOptions(toMerge, Options.EMPTY, parent, child);
+
+        assertThat(topBar.getTitleBar().getMenu().size()).isEqualTo(3);
+        ArgumentCaptor<List<TitleBarButtonController>> captor2 = ArgumentCaptor.forClass(List.class);
+        verify(topBarController).mergeRightButtons(captor2.capture(), any());
+        List<TitleBarButtonController> mergedButtons = captor2.getValue();
+        assertThat(mergedButtons).hasSize(3);
+        assertThat(appliedButtons.get(0)).isEqualTo(mergedButtons.get(0));
+        assertThat(appliedButtons.get(1)).isEqualTo(mergedButtons.get(2));
+    }
+
+    @Test
+    public void mergeButtons_mergingLeftButtonsDoesNotDestroyRightButtons() {
         Options a = new Options();
-        a.topBar.buttons.right = new ArrayList<>(Collections.singletonList(componentBtn1));
-        a.topBar.buttons.left = new ArrayList<>(Collections.singletonList(componentBtn2));
+        a.topBar.buttons.right = new ArrayList<>(singletonList(componentBtn1));
+        a.topBar.buttons.left = new ArrayList<>(singletonList(componentBtn2));
         uut.applyChildOptions(a, parent, child);
         List<TitleBarButtonController> initialButtons = uut.getComponentButtons(child.getView());
         forEach(initialButtons, ViewController::ensureViewIsCreated);
 
         Options b = new Options();
-        b.topBar.buttons.left = new ArrayList<>(Collections.singletonList(componentBtn2));
+        b.topBar.buttons.left = new ArrayList<>(singletonList(componentBtn2));
         uut.mergeChildOptions(b, Options.EMPTY, parent, child);
         assertThat(initialButtons.get(0).isDestroyed()).isFalse();
-        assertThat(initialButtons.get(1).isDestroyed()).isTrue();
     }
 
     @Test
@@ -423,14 +449,14 @@ public void applyButtons_buttonColorIsMergedToButtons() {
 
         uut.applyChildOptions(options, parent, child);
         ArgumentCaptor<List<TitleBarButtonController>> rightCaptor = ArgumentCaptor.forClass(List.class);
-        verify(topBar).setRightButtons(rightCaptor.capture());
+        verify(topBarController).applyRightButtons(rightCaptor.capture());
         assertThat(rightCaptor.getValue().get(0).getButton().color.get()).isEqualTo(options.topBar.rightButtonColor.get());
         assertThat(rightCaptor.getValue().get(1).getButton().color.get()).isEqualTo(options.topBar.rightButtonColor.get());
         assertThat(rightCaptor.getValue().get(0)).isNotEqualTo(rightButton1);
         assertThat(rightCaptor.getValue().get(1)).isNotEqualTo(rightButton2);
 
         ArgumentCaptor<List<TitleBarButtonController>> leftCaptor = ArgumentCaptor.forClass(List.class);
-        verify(topBar).setLeftButtons(leftCaptor.capture());
+        verify(topBarController).setLeftButtons(leftCaptor.capture());
         assertThat(leftCaptor.getValue().get(0).getButton().color).isEqualTo(options.topBar.leftButtonColor);
         assertThat(leftCaptor.getValue().get(0)).isNotEqualTo(leftButton);
     }
@@ -468,14 +494,14 @@ public void mergeChildOptions_buttonColorIsResolvedFromAppliedOptions() {
 
         uut.mergeChildOptions(options2, appliedOptions, parent, child);
         ArgumentCaptor<List<TitleBarButtonController>> rightCaptor = ArgumentCaptor.forClass(List.class);
-        verify(topBar, times(1)).setRightButtons(rightCaptor.capture());
+        verify(topBarController).mergeRightButtons(rightCaptor.capture(), any());
         assertThat(rightCaptor.getValue().get(0).getButton().color.get()).isEqualTo(appliedOptions.topBar.rightButtonColor.get());
         assertThat(rightCaptor.getValue().get(1).getButton().color.get()).isEqualTo(appliedOptions.topBar.rightButtonColor.get());
         assertThat(rightCaptor.getValue().get(0)).isNotEqualTo(rightButton1);
         assertThat(rightCaptor.getValue().get(1)).isNotEqualTo(rightButton2);
 
         ArgumentCaptor<List<TitleBarButtonController>> leftCaptor = ArgumentCaptor.forClass(List.class);
-        verify(topBar, times(1)).setLeftButtons(leftCaptor.capture());
+        verify(topBarController).setLeftButtons(leftCaptor.capture());
         assertThat(leftCaptor.getValue().get(0).getButton().color.get()).isEqualTo(appliedOptions.topBar.leftButtonColor.get());
         assertThat(leftCaptor.getValue().get(0)).isNotEqualTo(leftButton);
     }
@@ -500,14 +526,14 @@ public void mergeChildOptions_buttonColorIsResolvedFromMergedOptions() {
 
         uut.mergeChildOptions(options2, resolvedOptions, parent, child);
         ArgumentCaptor<List<TitleBarButtonController>> rightCaptor = ArgumentCaptor.forClass(List.class);
-        verify(topBar).setRightButtons(rightCaptor.capture());
+        verify(topBarController).mergeRightButtons(rightCaptor.capture(), any());
         assertThat(rightCaptor.getValue().get(0).getButton().color.get()).isEqualTo(resolvedOptions.topBar.rightButtonColor.get());
         assertThat(rightCaptor.getValue().get(1).getButton().color.get()).isEqualTo(resolvedOptions.topBar.rightButtonColor.get());
         assertThat(rightCaptor.getValue().get(0)).isNotEqualTo(rightButton1);
         assertThat(rightCaptor.getValue().get(1)).isNotEqualTo(rightButton2);
 
         ArgumentCaptor<List<TitleBarButtonController>> leftCaptor = ArgumentCaptor.forClass(List.class);
-        verify(topBar).setLeftButtons(leftCaptor.capture());
+        verify(topBarController).setLeftButtons(leftCaptor.capture());
         assertThat(leftCaptor.getValue().get(0).getButton().color.get()).isEqualTo(resolvedOptions.topBar.leftButtonColor.get());
         assertThat(leftCaptor.getValue().get(0)).isNotEqualTo(leftButton);
     }
@@ -515,14 +541,14 @@ public void mergeChildOptions_buttonColorIsResolvedFromMergedOptions() {
     @Test
     public void getButtonControllers_buttonControllersArePassedToTopBar() {
         Options options = new Options();
-        options.topBar.buttons.right = new ArrayList<>(Collections.singletonList(textBtn1));
-        options.topBar.buttons.left = new ArrayList<>(Collections.singletonList(textBtn1));
+        options.topBar.buttons.right = new ArrayList<>(singletonList(textBtn1));
+        options.topBar.buttons.left = new ArrayList<>(singletonList(textBtn1));
         uut.applyChildOptions(options, parent, child);
 
         ArgumentCaptor<List<TitleBarButtonController>> rightCaptor = ArgumentCaptor.forClass(List.class);
         ArgumentCaptor<List<TitleBarButtonController>> leftCaptor = ArgumentCaptor.forClass(List.class);
-        verify(topBar).setRightButtons(rightCaptor.capture());
-        verify(topBar).setLeftButtons(leftCaptor.capture());
+        verify(topBarController).applyRightButtons(rightCaptor.capture());
+        verify(topBarController).setLeftButtons(leftCaptor.capture());
 
         assertThat(rightCaptor.getValue().size()).isOne();
         assertThat(leftCaptor.getValue().size()).isOne();
@@ -531,8 +557,8 @@ public void getButtonControllers_buttonControllersArePassedToTopBar() {
     @Test
     public void getButtonControllers_storesButtonsByComponent() {
         Options options = new Options();
-        options.topBar.buttons.right = new ArrayList<>(Collections.singletonList(textBtn1));
-        options.topBar.buttons.left = new ArrayList<>(Collections.singletonList(textBtn2));
+        options.topBar.buttons.right = new ArrayList<>(singletonList(textBtn1));
+        options.topBar.buttons.left = new ArrayList<>(singletonList(textBtn2));
         uut.applyChildOptions(options, parent, child);
 
         List<TitleBarButtonController> componentButtons = uut.getComponentButtons(child.getView());
@@ -544,8 +570,8 @@ public void getButtonControllers_storesButtonsByComponent() {
     @Test
     public void getButtonControllers_createdOnce() {
         Options options = new Options();
-        options.topBar.buttons.right = new ArrayList<>(Collections.singletonList(textBtn1));
-        options.topBar.buttons.left = new ArrayList<>(Collections.singletonList(textBtn2));
+        options.topBar.buttons.right = new ArrayList<>(singletonList(textBtn1));
+        options.topBar.buttons.left = new ArrayList<>(singletonList(textBtn2));
 
         uut.applyChildOptions(options, parent, child);
         List<TitleBarButtonController> buttons1 = uut.getComponentButtons(child.getView());
@@ -560,8 +586,8 @@ public void getButtonControllers_createdOnce() {
     @Test
     public void applyButtons_doesNotDestroyOtherComponentButtons() {
         Options options = new Options();
-        options.topBar.buttons.right = new ArrayList<>(Collections.singletonList(componentBtn1));
-        options.topBar.buttons.left = new ArrayList<>(Collections.singletonList(componentBtn2));
+        options.topBar.buttons.right = new ArrayList<>(singletonList(componentBtn1));
+        options.topBar.buttons.left = new ArrayList<>(singletonList(componentBtn2));
         uut.applyChildOptions(options, parent, child);
         List<TitleBarButtonController> buttons = uut.getComponentButtons(child.getView());
         forEach(buttons, ViewController::ensureViewIsCreated);
@@ -575,8 +601,8 @@ public void applyButtons_doesNotDestroyOtherComponentButtons() {
     @Test
     public void onChildDestroyed_destroyedButtons() {
         Options options = new Options();
-        options.topBar.buttons.right = new ArrayList<>(Collections.singletonList(componentBtn1));
-        options.topBar.buttons.left = new ArrayList<>(Collections.singletonList(componentBtn2));
+        options.topBar.buttons.right = new ArrayList<>(singletonList(componentBtn1));
+        options.topBar.buttons.left = new ArrayList<>(singletonList(componentBtn2));
         uut.applyChildOptions(options, parent, child);
         List<TitleBarButtonController> buttons = uut.getComponentButtons(child.getView());
         forEach(buttons, ViewController::ensureViewIsCreated);
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonControllerTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonControllerTest.java
new file mode 100644
index 00000000000..612f46d1886
--- /dev/null
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonControllerTest.java
@@ -0,0 +1,61 @@
+package com.reactnativenavigation.viewcontrollers;
+
+import android.app.Activity;
+import android.view.MenuItem;
+
+import com.reactnativenavigation.BaseTest;
+import com.reactnativenavigation.mocks.ImageLoaderMock;
+import com.reactnativenavigation.mocks.TitleBarButtonCreatorMock;
+import com.reactnativenavigation.parse.params.Button;
+import com.reactnativenavigation.parse.params.Text;
+import com.reactnativenavigation.utils.ButtonPresenter;
+import com.reactnativenavigation.viewcontrollers.button.IconResolver;
+import com.reactnativenavigation.views.titlebar.TitleBar;
+
+import org.junit.Test;
+import org.mockito.Mockito;
+
+import static org.assertj.core.api.Java6Assertions.assertThat;
+
+public class TitleBarButtonControllerTest extends BaseTest {
+    private TitleBarButtonController uut;
+    private TitleBar titleBar;
+
+    @Override
+    public void beforeEach() {
+        Activity activity = newActivity();
+        titleBar = new TitleBar(activity);
+
+        Button button = createComponentButton();
+        uut = new TitleBarButtonController(
+                activity,
+                new IconResolver(activity, ImageLoaderMock.mock()),
+                new ButtonPresenter(button),
+                button,
+                new TitleBarButtonCreatorMock(),
+                Mockito.mock(TitleBarButtonController.OnClickListener.class)
+        );
+    }
+
+    @Test
+    public void addToMenu_componentButtonIsNotRecreatedIfAlreadyAddedWithSameOrder() {
+        uut.addToMenu(titleBar, 0);
+        MenuItem first = titleBar.getRightButton(0);
+
+        uut.addToMenu(titleBar, 0);
+        MenuItem second = titleBar.getRightButton(0);
+        assertThat(first).isEqualTo(second);
+
+        uut.addToMenu(titleBar, 1);
+        MenuItem third = titleBar.getRightButton(0);
+        assertThat(third).isNotEqualTo(second);
+    }
+
+    private Button createComponentButton() {
+        Button componentButton = new Button();
+        componentButton.id = "customBtn";
+        componentButton.component.name = new Text("com.rnn.customBtn");
+        componentButton.component.componentId = new Text("component4");
+        return componentButton;
+    }
+}
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarTest.java
index 55c1b0b3491..6d65ee4cd52 100644
--- a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarTest.java
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarTest.java
@@ -6,25 +6,16 @@
 
 import com.reactnativenavigation.BaseTest;
 import com.reactnativenavigation.TestUtils;
-import com.reactnativenavigation.parse.params.Button;
-import com.reactnativenavigation.parse.params.Text;
-import com.reactnativenavigation.react.Constants;
-import com.reactnativenavigation.react.ReactView;
-import com.reactnativenavigation.utils.CollectionUtils;
 import com.reactnativenavigation.views.titlebar.TitleBar;
 
 import org.junit.Test;
 import org.mockito.Mockito;
 
-import java.util.ArrayList;
-import java.util.Arrays;
 import java.util.Collections;
-import java.util.List;
 
 import androidx.appcompat.widget.ActionMenuView;
 
 import static com.reactnativenavigation.utils.Assertions.assertNotNull;
-import static com.reactnativenavigation.utils.TitleBarHelper.createButtonController;
 import static com.reactnativenavigation.utils.ViewUtils.findChildByClass;
 import static org.assertj.core.api.Java6Assertions.assertThat;
 import static org.mockito.Mockito.any;
@@ -37,67 +28,14 @@
 public class TitleBarTest extends BaseTest {
 
     private TitleBar uut;
-    private Button leftButton;
-    private Button textButton;
-    private Button customButton;
     private Activity activity;
 
     @Override
     public void beforeEach() {
         activity = newActivity();
-        createButtons();
         uut = spy(new TitleBar(activity));
     }
 
-    private void createButtons() {
-        leftButton = new Button();
-        leftButton.id = Constants.BACK_BUTTON_ID;
-
-        textButton = new Button();
-        textButton.id = "textButton";
-        textButton.text = new Text("Btn");
-
-        customButton = new Button();
-        customButton.id = "customBtn";
-        customButton.component.name = new Text("com.rnn.customBtn");
-        customButton.component.componentId = new Text("component4");
-    }
-
-    @Test
-    public void setButton_setsTextButton() {
-        uut.setRightButtons(rightButtons(textButton));
-        uut.setLeftButtons(leftButton(leftButton));
-        assertThat(uut.getMenu().getItem(0).getTitle()).isEqualTo(textButton.text.get());
-    }
-
-    @Test
-    public void setButton_setsCustomButton() {
-        uut.setLeftButtons(leftButton(leftButton));
-        uut.setRightButtons(rightButtons(customButton));
-        ReactView btnView = (ReactView) uut.getMenu().getItem(0).getActionView();
-        assertThat(btnView.getComponentName()).isEqualTo(customButton.component.name.get());
-    }
-
-    @Test
-    public void setRightButtons_emptyButtonsListClearsRightButtons() {
-        uut.setLeftButtons(new ArrayList<>());
-        uut.setRightButtons(rightButtons(customButton, textButton));
-        uut.setLeftButtons(new ArrayList<>());
-        uut.setRightButtons(new ArrayList<>());
-        assertThat(uut.getMenu().size()).isEqualTo(0);
-    }
-
-    @Test
-    public void setLeftButtons_emptyButtonsListClearsLeftButton() {
-        uut.setLeftButtons(leftButton(leftButton));
-        uut.setRightButtons(rightButtons(customButton));
-        assertThat(uut.getNavigationIcon()).isNotNull();
-
-        uut.setLeftButtons(new ArrayList<>());
-        uut.setRightButtons(rightButtons(textButton));
-        assertThat(uut.getNavigationIcon()).isNull();
-    }
-
     @Test
     public void setLeftButton_titleIsAligned() {
         uut.setTitle("Title");
@@ -110,13 +48,6 @@ public void setLeftButton_titleIsAligned() {
         verify(uut).alignTextView(any(), eq(title));
     }
 
-    @Test
-    public void setRightButtons_buttonsAreAddedInReverseOrderToMatchOrderOnIOs() {
-        uut.setLeftButtons(new ArrayList<>());
-        uut.setRightButtons(rightButtons(textButton, customButton));
-        assertThat(uut.getMenu().getItem(1).getTitle()).isEqualTo(textButton.text.get());
-    }
-
     @Test
     public void setComponent_addsComponentToTitleBar() {
         View component = new View(activity);
@@ -161,12 +92,4 @@ public void setLayoutDirection_directionIsExplicitlyAppliedToButtonsContainer()
         uut.setLayoutDirection(View.LAYOUT_DIRECTION_RTL);
         verify(spy).setLayoutDirection(View.LAYOUT_DIRECTION_RTL);
     }
-
-    private List<TitleBarButtonController> leftButton(Button leftButton) {
-        return Collections.singletonList(createButtonController(activity, uut, leftButton));
-    }
-
-    private List<TitleBarButtonController> rightButtons(Button... buttons) {
-        return CollectionUtils.map(Arrays.asList(buttons), button -> createButtonController(activity, uut, button));
-    }
 }
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarButtonControllerTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarButtonControllerTest.java
index 1b7913d0b2f..bc3e5f8bd0b 100644
--- a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarButtonControllerTest.java
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarButtonControllerTest.java
@@ -2,13 +2,12 @@
 
 import android.app.Activity;
 import android.graphics.Color;
-import android.graphics.Typeface;
 import android.view.MenuItem;
 
 import com.reactnativenavigation.BaseTest;
 import com.reactnativenavigation.TestUtils;
 import com.reactnativenavigation.mocks.ImageLoaderMock;
-import com.reactnativenavigation.mocks.TopBarButtonCreatorMock;
+import com.reactnativenavigation.mocks.TitleBarButtonCreatorMock;
 import com.reactnativenavigation.parse.params.Bool;
 import com.reactnativenavigation.parse.params.Button;
 import com.reactnativenavigation.parse.params.Colour;
@@ -18,11 +17,10 @@
 import com.reactnativenavigation.utils.ButtonPresenter;
 import com.reactnativenavigation.viewcontrollers.button.IconResolver;
 import com.reactnativenavigation.viewcontrollers.stack.StackController;
+import com.reactnativenavigation.views.titlebar.TitleBar;
 
 import org.junit.Test;
 
-import androidx.appcompat.widget.Toolbar;
-
 import static org.assertj.core.api.Java6Assertions.assertThat;
 import static org.mockito.ArgumentMatchers.any;
 import static org.mockito.ArgumentMatchers.anyInt;
@@ -44,13 +42,13 @@ public void beforeEach() {
         button = new Button();
         final Activity activity = newActivity();
 
-        TopBarButtonCreatorMock buttonCreatorMock = new TopBarButtonCreatorMock();
+        TitleBarButtonCreatorMock buttonCreatorMock = new TitleBarButtonCreatorMock();
         stackController = spy(TestUtils.newStackController(activity).build());
         stackController.getView().layout(0, 0, 1080, 1920);
         stackController.getTopBar().layout(0, 0, 1080, 200);
         getTitleBar().layout(0, 0, 1080, 200);
 
-        optionsPresenter = spy(new ButtonPresenter(getTitleBar(), button));
+        optionsPresenter = spy(new ButtonPresenter(button));
         uut = new TitleBarButtonController(activity, new IconResolver(activity, ImageLoaderMock.mock()), optionsPresenter, button, buttonCreatorMock, (buttonId) -> {});
 
         stackController.ensureViewIsCreated();
@@ -98,71 +96,10 @@ public void disableIconTint() {
         verify(optionsPresenter, times(0)).tint(any(), anyInt());
     }
 
-    @Test
-    public void fontFamily() {
-        setTextButton();
-        uut.addToMenu(getTitleBar(), 0);
-        verify(optionsPresenter, times(1)).setTypeFace(Typeface.MONOSPACE);
-    }
-
-    @Test
-    public void fontSize() {
-        setTextButton();
-        uut.addToMenu(getTitleBar(), 0);
-        verify(optionsPresenter, times(0)).setFontSize(getTitleBar().getMenu().getItem(0));
-
-        clearMenu();
-        button.fontSize = new Number(10);
-        uut.addToMenu(getTitleBar(), 0);
-        verify(optionsPresenter, times(1)).setFontSize(getTitleBar().getMenu().getItem(0));
-    }
-
-    @Test
-    public void textColor_enabled() {
-        setTextButton();
-        button.enabled = new Bool(false);
-        uut.addToMenu(getTitleBar(), 0);
-        dispatchPreDraw(getTitleBar());
-        verify(optionsPresenter, times(0)).setEnabledColor(any());
-
-        clearMenu();
-        button.enabled = new Bool(true);
-        button.color = new Colour(android.graphics.Color.RED);
-        uut.addToMenu(getTitleBar(), 0);
-        dispatchPreDraw(getTitleBar());
-        verify(optionsPresenter, times(1)).setEnabledColor(any());
-    }
-
-    private void clearMenu() {
-        getTitleBar().getMenu().clear();
-    }
-
-    @Test
-    public void textColor_disabled() {
-        setTextButton();
-        button.enabled = new Bool(false);
-        uut.addToMenu(getTitleBar(), 0);
-        dispatchPreDraw(getTitleBar());
-        verify(optionsPresenter, times(1)).setDisabledColor(any(), eq(Color.LTGRAY));
-
-        clearMenu();
-        button.disabledColor = new Colour(android.graphics.Color.BLACK);
-        uut.addToMenu(getTitleBar(), 0);
-        dispatchPreDraw(getTitleBar());
-        verify(optionsPresenter, times(1)).setDisabledColor(any(), eq(Color.BLACK));
-    }
-
-    private Toolbar getTitleBar() {
+    private TitleBar getTitleBar() {
         return stackController.getTopBar().getTitleBar();
     }
 
-    private void setTextButton() {
-        button.id = "btn1";
-        button.text = new Text("Button");
-        button.fontFamily = Typeface.MONOSPACE;
-        button.showAsAction = new Number(MenuItem.SHOW_AS_ACTION_ALWAYS);
-    }
-
     private void setIconButton(boolean enabled) {
         button.id = "btn1";
         button.icon = new Text("someIcon");
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarControllerTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarControllerTest.java
new file mode 100644
index 00000000000..f09737c88b8
--- /dev/null
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarControllerTest.java
@@ -0,0 +1,144 @@
+package com.reactnativenavigation.viewcontrollers;
+
+import android.app.Activity;
+
+import com.reactnativenavigation.BaseTest;
+import com.reactnativenavigation.parse.params.Button;
+import com.reactnativenavigation.parse.params.Text;
+import com.reactnativenavigation.react.Constants;
+import com.reactnativenavigation.react.ReactView;
+import com.reactnativenavigation.viewcontrollers.topbar.TopBarController;
+import com.reactnativenavigation.views.StackLayout;
+
+import org.junit.Test;
+import org.mockito.Mockito;
+
+import java.util.ArrayList;
+import java.util.Arrays;
+import java.util.Collections;
+import java.util.List;
+
+import static com.reactnativenavigation.utils.CollectionUtils.*;
+import static com.reactnativenavigation.utils.TitleBarHelper.createButtonController;
+import static org.assertj.core.api.Java6Assertions.assertThat;
+import static org.mockito.Mockito.spy;
+
+public class TopBarControllerTest extends BaseTest {
+    private TopBarController uut;
+    private Activity activity;
+    private Button leftButton;
+    private Button textButton1;
+    private Button textButton2;
+    private Button componentButton;
+
+    @Override
+    public void beforeEach() {
+        activity = newActivity();
+        uut = spy(new TopBarController());
+        StackLayout stack = Mockito.mock(StackLayout.class);
+        uut.createView(activity, stack);
+
+        createButtons();
+    }
+
+    @Test
+    public void setButton_setsTextButton() {
+        uut.applyRightButtons(rightButtons(textButton1));
+        uut.setLeftButtons(leftButton(leftButton));
+        assertThat(uut.getRightButton(0).getTitle().toString()).isEqualTo(textButton1.text.get());
+    }
+
+    @Test
+    public void setButton_setsCustomButton() {
+        uut.setLeftButtons(leftButton(leftButton));
+        uut.applyRightButtons(rightButtons(componentButton));
+        ReactView btnView = (ReactView) uut.getRightButton(0).getActionView();
+        assertThat(btnView.getComponentName()).isEqualTo(componentButton.component.name.get());
+    }
+
+    @Test
+    public void applyRightButtons_emptyButtonsListClearsRightButtons() {
+        uut.setLeftButtons(new ArrayList<>());
+        uut.applyRightButtons(rightButtons(componentButton, textButton1));
+        uut.setLeftButtons(new ArrayList<>());
+        uut.applyRightButtons(new ArrayList<>());
+        assertThat(uut.getRightButtonsCount()).isEqualTo(0);
+    }
+
+    @Test
+    public void applyRightButtons_previousButtonsAreCleared() {
+        uut.applyRightButtons(rightButtons(textButton1, componentButton));
+        assertThat(uut.getRightButtonsCount()).isEqualTo(2);
+
+        uut.applyRightButtons(rightButtons(textButton2));
+        assertThat(uut.getRightButtonsCount()).isEqualTo(1);
+    }
+
+    @Test
+    public void applyRightButtons_buttonsAreAddedInReverseOrderToMatchOrderOnIOs() {
+        uut.setLeftButtons(new ArrayList<>());
+        uut.applyRightButtons(rightButtons(textButton1, componentButton));
+        assertThat(uut.getRightButton(1).getTitle().toString()).isEqualTo(textButton1.text.get());
+    }
+
+    @Test
+    public void applyRightButtons_componentButtonIsReapplied() {
+        List<TitleBarButtonController> initialButtons = rightButtons(componentButton);
+        uut.applyRightButtons(initialButtons);
+        assertThat(uut.getRightButton(0).getItemId()).isEqualTo(componentButton.getIntId());
+
+        uut.applyRightButtons(rightButtons(textButton1));
+        assertThat(uut.getRightButton(0).getItemId()).isEqualTo(textButton1.getIntId());
+
+        uut.applyRightButtons(initialButtons);
+        assertThat(uut.getRightButton(0).getItemId()).isEqualTo(componentButton.getIntId());
+    }
+
+    @Test
+    public void mergeRightButtons_componentButtonIsNotAddedIfAlreadyAddedToMenu() {
+        List<TitleBarButtonController> initialButtons = rightButtons(componentButton);
+        uut.applyRightButtons(initialButtons);
+
+        uut.mergeRightButtons(initialButtons, Collections.EMPTY_LIST);
+
+    }
+
+    @Test
+    public void setLeftButtons_emptyButtonsListClearsLeftButton() {
+        uut.setLeftButtons(leftButton(leftButton));
+        uut.applyRightButtons(rightButtons(componentButton));
+        assertThat(uut.getLeftButton()).isNotNull();
+
+        uut.setLeftButtons(new ArrayList<>());
+        uut.applyRightButtons(rightButtons(textButton1));
+        assertThat(uut.getLeftButton()).isNull();
+    }
+
+    private void createButtons() {
+        leftButton = new Button();
+        leftButton.id = Constants.BACK_BUTTON_ID;
+
+        textButton1 = createTextButton("1");
+        textButton2 = createTextButton("2");
+
+        componentButton = new Button();
+        componentButton.id = "customBtn";
+        componentButton.component.name = new Text("com.rnn.customBtn");
+        componentButton.component.componentId = new Text("component4");
+    }
+
+    private Button createTextButton(String id) {
+        Button button = new Button();
+        button.id = id;
+        button.text = new Text("txt" + id);
+        return button;
+    }
+
+    private List<TitleBarButtonController> leftButton(Button leftButton) {
+        return Collections.singletonList(createButtonController(activity, leftButton));
+    }
+
+    private List<TitleBarButtonController> rightButtons(Button... buttons) {
+        return map(Arrays.asList(buttons), button -> createButtonController(activity, button));
+    }
+}
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/StackControllerTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/StackControllerTest.java
index e0ea342ad39..723b2a25679 100644
--- a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/StackControllerTest.java
+++ b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/StackControllerTest.java
@@ -14,7 +14,7 @@
 import com.reactnativenavigation.mocks.SimpleViewController;
 import com.reactnativenavigation.mocks.TitleBarReactViewCreatorMock;
 import com.reactnativenavigation.mocks.TopBarBackgroundViewCreatorMock;
-import com.reactnativenavigation.mocks.TopBarButtonCreatorMock;
+import com.reactnativenavigation.mocks.TitleBarButtonCreatorMock;
 import com.reactnativenavigation.parse.AnimationOptions;
 import com.reactnativenavigation.parse.NestedAnimationsOptions;
 import com.reactnativenavigation.parse.Options;
@@ -102,7 +102,7 @@ public void beforeEach() {
                     activity,
                     new TitleBarReactViewCreatorMock(),
                     new TopBarBackgroundViewCreatorMock(),
-                    new TopBarButtonCreatorMock(),
+                    new TitleBarButtonCreatorMock(),
                     new IconResolver(activity, ImageLoaderMock.mock()),
                     new RenderChecker(),
                     new Options()
diff --git a/lib/src/interfaces/Options.ts b/lib/src/interfaces/Options.ts
index 026987bf8d9..c63750da950 100644
--- a/lib/src/interfaces/Options.ts
+++ b/lib/src/interfaces/Options.ts
@@ -339,6 +339,14 @@ export interface OptionsTopBarButton {
      * Properties to pass down to the component
      */
     passProps?: object;
+    /**
+     * (Android only) component width
+     */
+    width?: number;
+    /**
+     * (Android only) component height
+     */
+    height?: number;
   };
   /**
    * (iOS only) Set the button as an iOS system icon
diff --git a/playground/src/screens/OptionsScreen.js b/playground/src/screens/OptionsScreen.js
index b8e5eb68f2d..68a649124dc 100644
--- a/playground/src/screens/OptionsScreen.js
+++ b/playground/src/screens/OptionsScreen.js
@@ -40,7 +40,7 @@ class Options extends Component {
         <Button label='Set React Title View' testID={SET_REACT_TITLE_VIEW} onPress={this.setReactTitleView} />
         <Button label='Show Yellow Box' testID={SHOW_YELLOW_BOX_BTN} onPress={() => console.warn('Yellow Box')} />
         <Button label='StatusBar' onPress={this.statusBarScreen} />
-        <Button label='Buttons Screen' testID={GOTO_BUTTONS_SCREEN} onPress={this.goToButtonsScreen} />
+        <Button label='Buttons Screen' testID={GOTO_BUTTONS_SCREEN} onPress={this.pushButtonsScreen} />
       </Root>
     );
   }
@@ -101,7 +101,13 @@ class Options extends Component {
 
   statusBarScreen = () => Navigation.showModal(Screens.StatusBar);
 
-  goToButtonsScreen = () => Navigation.push(this, Screens.Buttons);
+  pushButtonsScreen = () => Navigation.push(this, Screens.Buttons, {
+    animations: {
+      push: {
+        waitForRender: true
+      }
+    }
+  });
 }
 
 module.exports = Options;
diff --git a/playground/src/screens/RoundedButton.js b/playground/src/screens/RoundedButton.js
index 19201b29e8e..fb5c3a8a78c 100644
--- a/playground/src/screens/RoundedButton.js
+++ b/playground/src/screens/RoundedButton.js
@@ -39,7 +39,8 @@ const styles = StyleSheet.create({
     backgroundColor: 'transparent',
     flexDirection: 'column',
     justifyContent: 'center',
-    alignItems: 'center'
+    alignItems: 'center',
+    padding: 4
   },
   button: {
     width: 40,
diff --git a/playground/src/testIDs.js b/playground/src/testIDs.js
index 1125f5d52ec..70cbe4ab84e 100644
--- a/playground/src/testIDs.js
+++ b/playground/src/testIDs.js
@@ -50,6 +50,7 @@ module.exports = {
   SHOW_TABS_BTN: 'SHOW_TABS_BTN',
   HIDE_TABS_PUSH_BTN: 'HIDE_TABS_PUSH_BTN',
   ROUND_BUTTON: 'ROUND_BUTTON',
+  ROUND_BUTTON_2: 'ROUND_BUTTON_2',
   BUTTON_ONE: 'BUTTON_ONE',
   LEFT_BUTTON: 'LEFT_BUTTON',
   HIDE_TOPBAR_DEFAULT_OPTIONS: 'HIDE_TOPBAR_DEFAULT_OPTIONS',
@@ -92,6 +93,7 @@ module.exports = {
   NAVIGATION_SCREEN: `NAVIGATION_SCREEN`,
 
   // Buttons
+  ADD_BUTTON: 'ADD_BUTTON',
   TAB_BASED_APP_BUTTON: `TAB_BASED_APP_BUTTON`,
   TAB_BASED_APP_SIDE_BUTTON: `TAB_BASED_APP_SIDE_BUTTON`,
   PUSH_STATIC_LIFECYCLE_BUTTON: `PUSH_STATIC_LIFECYCLE_BUTTON`,