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.

lib/android/app/src/main/java/com/reactnativenavigation/parse/Component.java

 
 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;
         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;
     }
     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) {
         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() {
         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);
     }
 }

lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Button.java

 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;
 
 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();
     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();
 
     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");
         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");
         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()) {

lib/android/app/src/main/java/com/reactnativenavigation/parse/params/Text.java

         super(value);
     }
 
+    public int length() {
+        return hasValue() ? value.length() : 0;
+    }
+
     @NonNull
     @Override
     public String toString() {

lib/android/app/src/main/java/com/reactnativenavigation/presentation/StackPresenter.java

 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;
 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;
 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;
     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<>();
     public StackPresenter(Activity activity,
                           TitleBarReactViewCreator titleViewCreator,
                           TopBarBackgroundViewCreator topBarBackgroundViewCreator,
-                          ReactViewCreator buttonCreator,
+                          TitleBarButtonCreator buttonCreator,
                           IconResolver iconResolver,
                           RenderChecker renderChecker,
                           Options defaultOptions) {
     }
 
     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();
         }
         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
     }
 
     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();
                 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;
     }

lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonPresenter.java

 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;
     }
 
         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;
-    }
-
 }

lib/android/app/src/main/java/com/reactnativenavigation/utils/ButtonSpan.kt

+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
+        }
+
+    }
+}

lib/android/app/src/main/java/com/reactnativenavigation/utils/CollectionUtils.java

 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();
     }
         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);
     }
         }
     }
 
+    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) {
         }
         return result;
     }
+
+    public static @Nullable<T> T safeGet(List<T> items, int index) {
+        return index >= 0 && index < items.size() ? items.get(index) : null;
+    }
 }

lib/android/app/src/main/java/com/reactnativenavigation/utils/Functions.java

         void run(T param);
     }
 
+    public interface Func2<T, S> {
+        void run(T param1, S param2);
+    }
+
     public interface FuncR<T> {
         T run();
     }

lib/android/app/src/main/java/com/reactnativenavigation/utils/IdFactory.kt

+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 }
+            }
+        }
+    }
+}

lib/android/app/src/main/java/com/reactnativenavigation/utils/ObjectUtils.java

         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;
     }

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonController.java

 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;
 
         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;
     @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();
     }
 
         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);
         });
     }
 
-    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);
                         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) {
     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));
         }
     }
 

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/topbar/TopBarController.java

 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() {
         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;
     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);
+    }
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBar.java

 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;
 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;
 
     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();
         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 {
     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;
         }
     }
 
-    private void clearRightButtons() {
+    public void clearRightButtons() {
         if (getMenu().size() > 0) getMenu().clear();
     }
 
         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;
             ((ViewGroup) child).setClipChildren(false);
         }
     }
+
+    public void removeRightButton(int buttonId) {
+        getMenu().removeItem(buttonId);
+    }
+
+    public boolean containsRightButton(TitleBarButtonController button) {
+        return getMenu().findItem(button.getButtonIntId()) != null;
+    }
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarButtonCreator.java

 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;
 
         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);
     }
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/titlebar/TitleBarReactButtonView.java

 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);
+        }
     }
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/topbar/TopBar.java

 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;
 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;
     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();
         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) {
         }
     }
 
-    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);
     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);
+    }
 }

lib/android/app/src/test/java/com/reactnativenavigation/TestUtils.java

 
 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;
                 .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());
     }
 

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TopBarButtonCreatorMock.java → lib/android/app/src/test/java/com/reactnativenavigation/mocks/TitleBarButtonCreatorMock.java

 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) {
 

lib/android/app/src/test/java/com/reactnativenavigation/utils/TitleBarHelper.java

 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();
     }
 
 
-    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 -> {}
         );
     }

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/StackPresenterTest.java

 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;
 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;
             }
         };
         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)
         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());
     @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();
 
         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();
     }
 
     @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
 
         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);
     }
 
         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);
     }
 
         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);
     }
     @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();
     @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());
     @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());
     @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);
     @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);

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonControllerTest.java

+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;
+    }
+}

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TitleBarTest.java

 
 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;
 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");
         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);
         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));
-    }
 }

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarButtonControllerTest.java

 
 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;
 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;
         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();
         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");

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopBarControllerTest.java

+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));
+    }
+}

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/StackControllerTest.java

 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;
                     activity,
                     new TitleBarReactViewCreatorMock(),
                     new TopBarBackgroundViewCreatorMock(),
-                    new TopBarButtonCreatorMock(),
+                    new TitleBarButtonCreatorMock(),
                     new IconResolver(activity, ImageLoaderMock.mock()),
                     new RenderChecker(),
                     new Options()

lib/src/interfaces/Options.ts

      * 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

playground/src/screens/OptionsScreen.js

         <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>
     );
   }
 
   statusBarScreen = () => Navigation.showModal(Screens.StatusBar);
 
-  goToButtonsScreen = () => Navigation.push(this, Screens.Buttons);
+  pushButtonsScreen = () => Navigation.push(this, Screens.Buttons, {
+    animations: {
+      push: {
+        waitForRender: true
+      }
+    }
+  });
 }
 
 module.exports = Options;

playground/src/screens/RoundedButton.js

     backgroundColor: 'transparent',
     flexDirection: 'column',
     justifyContent: 'center',
-    alignItems: 'center'
+    alignItems: 'center',
+    padding: 4
   },
   button: {
     width: 40,

playground/src/testIDs.js

   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',
   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`,