Support topTabs.height style option

This commit also changes the way TopTabs options are handled. As the TabLayout
is part of the TopBar, it's the StackControllers responsibility to set TopTabs options.

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

@@ -22,7 +22,7 @@ public class Options {
         if (json == null) return result.withDefaultOptions(defaultOptions);
 
         result.topBar = TopBarOptions.parse(typefaceManager, json.optJSONObject("topBar"));
-        result.topTabsOptions = TopTabsOptions.parse(json.optJSONObject("topTabs"));
+        result.topTabs = TopTabsOptions.parse(json.optJSONObject("topTabs"));
         result.topTabOptions = TopTabOptions.parse(typefaceManager, json.optJSONObject("topTab"));
         result.bottomTabOptions = BottomTabOptions.parse(json.optJSONObject("bottomTab"));
         result.bottomTabsOptions = BottomTabsOptions.parse(json.optJSONObject("bottomTabs"));
@@ -38,7 +38,7 @@ public class Options {
     }
 
     @NonNull public TopBarOptions topBar = new TopBarOptions();
-    @NonNull public TopTabsOptions topTabsOptions = new TopTabsOptions();
+    @NonNull public TopTabsOptions topTabs = new TopTabsOptions();
     @NonNull public TopTabOptions topTabOptions = new TopTabOptions();
     @NonNull public BottomTabOptions bottomTabOptions = new BottomTabOptions();
     @NonNull public BottomTabsOptions bottomTabsOptions = new BottomTabsOptions();
@@ -58,7 +58,7 @@ public class Options {
     public Options copy() {
         Options result = new Options();
         result.topBar.mergeWith(topBar);
-        result.topTabsOptions.mergeWith(topTabsOptions);
+        result.topTabs.mergeWith(topTabs);
         result.topTabOptions.mergeWith(topTabOptions);
         result.bottomTabOptions.mergeWith(bottomTabOptions);
         result.bottomTabsOptions.mergeWith(bottomTabsOptions);
@@ -76,7 +76,7 @@ public class Options {
 	public Options mergeWith(final Options other) {
         Options result = copy();
         result.topBar.mergeWith(other.topBar);
-        result.topTabsOptions.mergeWith(other.topTabsOptions);
+        result.topTabs.mergeWith(other.topTabs);
         result.topTabOptions.mergeWith(other.topTabOptions);
         result.bottomTabOptions.mergeWith(other.bottomTabOptions);
         result.bottomTabsOptions.mergeWith(other.bottomTabsOptions);
@@ -92,7 +92,7 @@ public class Options {
     Options withDefaultOptions(final Options defaultOptions) {
         topBar.mergeWithDefault(defaultOptions.topBar);
         topTabOptions.mergeWithDefault(defaultOptions.topTabOptions);
-        topTabsOptions.mergeWithDefault(defaultOptions.topTabsOptions);
+        topTabs.mergeWithDefault(defaultOptions.topTabs);
         bottomTabOptions.mergeWithDefault(defaultOptions.bottomTabOptions);
         bottomTabsOptions.mergeWithDefault(defaultOptions.bottomTabsOptions);
         fabOptions.mergeWithDefault(defaultOptions.fabOptions);
@@ -120,7 +120,7 @@ public class Options {
     }
 
     public Options clearTopTabsOptions() {
-        topTabsOptions = new TopTabsOptions();
+        topTabs = new TopTabsOptions();
         return this;
     }
 

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

@@ -21,6 +21,7 @@ public class TopTabsOptions {
     @NonNull public Color unselectedTabColor = new NullColor();
     @NonNull public Number fontSize = new NullNumber();
     @NonNull public Bool visible = new NullBool();
+    @NonNull public Number height = new NullNumber();
 
     public static TopTabsOptions parse(@Nullable JSONObject json) {
         TopTabsOptions result = new TopTabsOptions();
@@ -29,6 +30,7 @@ public class TopTabsOptions {
         result.unselectedTabColor = ColorParser.parse(json, "unselectedTabColor");
         result.fontSize = NumberParser.parse(json, "fontSize");
         result.visible = BoolParser.parse(json, "visible");
+        result.height = NumberParser.parse(json, "height");
         return result;
     }
 
@@ -37,6 +39,7 @@ public class TopTabsOptions {
         if (other.unselectedTabColor.hasValue()) unselectedTabColor = other.unselectedTabColor;
         if (other.fontSize.hasValue()) fontSize = other.fontSize;
         if (other.visible.hasValue()) visible = other.visible;
+        if (other.height.hasValue()) height = other.height;
     }
 
     void mergeWithDefault(TopTabsOptions defaultOptions) {
@@ -44,5 +47,6 @@ public class TopTabsOptions {
         if (!unselectedTabColor.hasValue()) unselectedTabColor = defaultOptions.unselectedTabColor;
         if (!fontSize.hasValue()) fontSize = defaultOptions.fontSize;
         if (!visible.hasValue()) visible = defaultOptions.visible;
+        if (!height.hasValue()) height = defaultOptions.height;
     }
 }

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

@@ -37,7 +37,7 @@ public class StackOptionsPresenter {
         applyOrientation(options.layout.orientation);
         applyButtons(options.topBar.leftButtons, options.topBar.rightButtons);
         applyTopBarOptions(options.topBar, options.animations, child, options);
-        applyTopTabsOptions(options.topTabsOptions);
+        applyTopTabsOptions(options.topTabs);
         applyTopTabOptions(options.topTabOptions);
     }
 
@@ -106,6 +106,7 @@ public class StackOptionsPresenter {
         topBar.applyTopTabsColors(options.selectedTabColor, options.unselectedTabColor);
         topBar.applyTopTabsFontSize(options.fontSize);
         topBar.setTopTabsVisible(options.visible.isTrueOrUndefined());
+        topBar.setTopTabsHeight(options.height.get(LayoutParams.WRAP_CONTENT));
     }
 
     private void applyTopTabOptions(TopTabOptions topTabOptions) {
@@ -126,7 +127,7 @@ public class StackOptionsPresenter {
         mergeOrientation(options.layout.orientation);
         mergeButtons(options.topBar.leftButtons, options.topBar.rightButtons);
         mergeTopBarOptions(options.topBar, options.animations, child);
-        mergeTopTabsOptions(options.topTabsOptions);
+        mergeTopTabsOptions(options.topTabs);
         mergeTopTabOptions(options.topTabOptions);
     }
 
@@ -187,6 +188,7 @@ public class StackOptionsPresenter {
         if (options.selectedTabColor.hasValue() && options.unselectedTabColor.hasValue()) topBar.applyTopTabsColors(options.selectedTabColor, options.unselectedTabColor);
         if (options.fontSize.hasValue()) topBar.applyTopTabsFontSize(options.fontSize);
         if (options.visible.hasValue()) topBar.setTopTabsVisible(options.visible.isTrue());
+        if (options.height.hasValue()) topBar.setTopTabsHeight(options.height.get(LayoutParams.WRAP_CONTENT));
     }
 
     private void mergeTopTabOptions(TopTabOptions topTabOptions) {

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

@@ -54,7 +54,12 @@ public class StackController extends ParentController<StackLayout> {
         }
         applyOnParentController(parentController ->
                 ((ParentController) parentController).applyChildOptions(
-                        this.options.copy().clearTopBarOptions().clearAnimationOptions().clearFabOptions(),
+                        this.options.copy()
+                                .clearTopBarOptions()
+                                .clearAnimationOptions()
+                                .clearFabOptions()
+                                .clearTopTabOptions()
+                                .clearTopTabsOptions(),
                         child
                 )
         );
@@ -71,7 +76,12 @@ public class StackController extends ParentController<StackLayout> {
         }
         applyOnParentController(parentController ->
                 ((ParentController) parentController).mergeChildOptions(
-                        options.copy().clearTopBarOptions().clearAnimationOptions().clearFabOptions(),
+                        options.copy()
+                                .clearTopBarOptions()
+                                .clearAnimationOptions()
+                                .clearFabOptions()
+                                .clearTopTabOptions()
+                                .clearTopTabsOptions(),
                         child
                 )
         );

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/toptabs/TopTabsController.java

@@ -1,6 +1,7 @@
 package com.reactnativenavigation.viewcontrollers.toptabs;
 
 import android.app.Activity;
+import android.support.annotation.CallSuper;
 import android.support.annotation.NonNull;
 import android.view.View;
 
@@ -84,11 +85,13 @@ public class TopTabsController extends ParentController<TopTabsViewPager> {
     @Override
     public void applyChildOptions(Options options, Component child) {
         super.applyChildOptions(options, child);
-        applyOnParentController(parentController -> {
-                Options opt = this.options.copy();
-                ((ParentController) parentController).applyChildOptions(opt.clearTopTabOptions().clearTopTabsOptions(), child);
-            }
-        );
+        applyOnParentController(parentController -> ((ParentController) parentController).applyChildOptions(this.options.copy(), child));
+    }
+
+    @CallSuper
+    public void mergeChildOptions(Options options, Component child) {
+        super.mergeChildOptions(options, child);
+        applyOnParentController(parentController -> ((ParentController) parentController).applyChildOptions(options.copy(), child));
     }
 
     public void switchToTab(int index) {

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

@@ -4,6 +4,7 @@ import android.annotation.SuppressLint;
 import android.content.Context;
 import android.graphics.Typeface;
 import android.support.annotation.ColorInt;
+import android.support.annotation.NonNull;
 import android.support.annotation.RestrictTo;
 import android.support.annotation.VisibleForTesting;
 import android.support.design.widget.AppBarLayout;
@@ -13,6 +14,7 @@ import android.view.Gravity;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.FrameLayout;
+import android.widget.LinearLayout;
 import android.widget.RelativeLayout;
 import android.widget.TextView;
 
@@ -49,6 +51,7 @@ public class TopBar extends AppBarLayout implements ScrollEventListener.ScrollAw
     private TopBarAnimator animator;
     private TopTabs topTabs;
     private FrameLayout root;
+    private LinearLayout content;
     private StackLayout parentView;
     private TopBarBackgroundViewController topBarBackgroundViewController;
     private View border;
@@ -65,18 +68,37 @@ public class TopBar extends AppBarLayout implements ScrollEventListener.ScrollAw
 
     private void createLayout(ReactViewCreator buttonCreator, TitleBarReactViewCreator titleBarReactViewCreator, TopBarButtonController.OnClickListener onClickListener) {
         setId(CompatUtils.generateViewId());
-        topTabs = new TopTabs(getContext());
         titleBar = createTitleBar(getContext(), buttonCreator, titleBarReactViewCreator, onClickListener);
-        titleBar.setId(CompatUtils.generateViewId());
+        topTabs = createTopTabs();
+        border = createBorder();
+        content = createContentLayout();
+
         root = new FrameLayout(getContext());
         root.setId(CompatUtils.generateViewId());
-        root.addView(titleBar, MATCH_PARENT, WRAP_CONTENT);
-        border = createBorder();
+        content.addView(titleBar);
+        content.addView(topTabs);
+        root.addView(content);
         root.addView(border);
         addView(root, MATCH_PARENT, WRAP_CONTENT);
         if (BuildConfig.DEBUG) setContentDescription("TopBar");
     }
 
+    private LinearLayout createContentLayout() {
+        LinearLayout content = new LinearLayout(getContext());
+        content.setOrientation(VERTICAL);
+        return content;
+    }
+
+    @NonNull
+    private TopTabs createTopTabs() {
+        RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(MATCH_PARENT, WRAP_CONTENT);
+        lp.addRule(RelativeLayout.BELOW, titleBar.getId());
+        TopTabs topTabs = new TopTabs(getContext());
+        topTabs.setLayoutParams(lp);
+        topTabs.setVisibility(GONE);
+        return topTabs;
+    }
+
     private View createBorder() {
         View border = new View(getContext());
         border.setBackgroundColor(android.graphics.Color.TRANSPARENT);
@@ -87,7 +109,9 @@ public class TopBar extends AppBarLayout implements ScrollEventListener.ScrollAw
     }
 
     protected TitleBar createTitleBar(Context context, ReactViewCreator buttonCreator, TitleBarReactViewCreator reactViewCreator, TopBarButtonController.OnClickListener onClickListener) {
-        return new TitleBar(context, buttonCreator, reactViewCreator, onClickListener);
+        TitleBar titleBar = new TitleBar(context, buttonCreator, reactViewCreator, onClickListener);
+        titleBar.setId(CompatUtils.generateViewId());
+        return titleBar;
     }
 
     public void setHeight(int height) {
@@ -177,6 +201,12 @@ public class TopBar extends AppBarLayout implements ScrollEventListener.ScrollAw
         topTabs.setVisibility(this, visible);
     }
 
+    public void setTopTabsHeight(int height) {
+        if (topTabs.getLayoutParams().height == height) return;
+        topTabs.getLayoutParams().height = height > 0 ? (int) UiUtils.dpToPx(getContext(), height) : height;
+        topTabs.setLayoutParams(topTabs.getLayoutParams());
+    }
+
     public void setLeftButtons(List<Button> leftButtons) {
         titleBar.setLeftButtons(leftButtons);
     }
@@ -194,11 +224,8 @@ public class TopBar extends AppBarLayout implements ScrollEventListener.ScrollAw
     }
 
     public void initTopTabs(ViewPager viewPager) {
-        topTabs = new TopTabs(getContext());
+        topTabs.setVisibility(VISIBLE);
         topTabs.init(viewPager);
-        RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(MATCH_PARENT, WRAP_CONTENT);
-        lp.addRule(RelativeLayout.BELOW, titleBar.getId());
-        root.addView(topTabs, lp);
     }
 
     public void enableCollapse(ScrollEventListener scrollEventListener) {

lib/android/app/src/test/java/com/reactnativenavigation/parse/OptionsTest.java

@@ -277,9 +277,9 @@ public class OptionsTest extends BaseTest {
     @Test
     public void clear_topTabsOptions() {
         Options uut = new Options();
-        uut.topTabsOptions.fontSize = new Number(666);
+        uut.topTabs.fontSize = new Number(666);
         uut.clearTopTabsOptions();
-        assertThat(uut.topTabsOptions.fontSize.hasValue()).isFalse();
+        assertThat(uut.topTabs.fontSize.hasValue()).isFalse();
     }
 
     @Test

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

@@ -117,13 +117,13 @@ public class OptionsMergingTest extends BaseTest {
         verify(topBar, times(0)).applyTopTabsFontSize(any());
         verify(topBar, times(0)).setTopTabsVisible(anyBoolean());
 
-        options.topTabsOptions.selectedTabColor = new Color(1);
-        options.topTabsOptions.unselectedTabColor = new Color(1);
-        options.topTabsOptions.fontSize = new Number(1);
-        options.topTabsOptions.visible = new Bool(true);
+        options.topTabs.selectedTabColor = new Color(1);
+        options.topTabs.unselectedTabColor = new Color(1);
+        options.topTabs.fontSize = new Number(1);
+        options.topTabs.visible = new Bool(true);
         uut.mergeChildOptions(options, child);
-        verify(topBar, times(1)).applyTopTabsColors(options.topTabsOptions.selectedTabColor, options.topTabsOptions.unselectedTabColor);
-        verify(topBar, times(1)).applyTopTabsFontSize(options.topTabsOptions.fontSize);
+        verify(topBar, times(1)).applyTopTabsColors(options.topTabs.selectedTabColor, options.topTabs.unselectedTabColor);
+        verify(topBar, times(1)).applyTopTabsFontSize(options.topTabs.fontSize);
         verify(topBar, times(1)).setTopTabsVisible(anyBoolean());
     }
 

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

@@ -24,7 +24,6 @@ import com.reactnativenavigation.views.toptabs.TopTabsLayoutCreator;
 import com.reactnativenavigation.views.toptabs.TopTabsViewPager;
 
 import org.junit.Test;
-import org.mockito.ArgumentCaptor;
 import org.mockito.Mockito;
 
 import java.util.ArrayList;
@@ -41,7 +40,7 @@ public class TopTabsViewControllerTest extends BaseTest {
 
     private static final int SIZE = 2;
 
-    private StackController parentController;
+    private StackController stack;
     private TopTabsController uut;
     private List<ViewController> tabControllers = new ArrayList<>(SIZE);
     private List<Options> tabOptions = new ArrayList<>(SIZE);
@@ -65,9 +64,9 @@ public class TopTabsViewControllerTest extends BaseTest {
         uut = spy(new TopTabsController(activity, childRegistry, "componentId", tabControllers, layoutCreator, options));
         tabControllers.forEach(viewController -> viewController.setParentController(uut));
 
-        parentController = spy(createStackController("stackId"));
-        parentController.push(uut, new CommandListenerAdapter());
-        uut.setParentController(parentController);
+        stack = spy(createStackController("stackId"));
+        stack.push(uut, new CommandListenerAdapter());
+        uut.setParentController(stack);
     }
 
     @NonNull
@@ -137,7 +136,7 @@ public class TopTabsViewControllerTest extends BaseTest {
 
     @Test
     public void lifecycleMethodsSentWhenSelectedTabChanges() {
-        parentController.ensureViewIsCreated();
+        stack.ensureViewIsCreated();
         uut.ensureViewIsCreated();
         tabControllers.get(0).ensureViewIsCreated();
         tabControllers.get(1).ensureViewIsCreated();
@@ -157,7 +156,7 @@ public class TopTabsViewControllerTest extends BaseTest {
 
     @Test
     public void lifecycleMethodsSentWhenSelectedPreviouslySelectedTab() {
-        parentController.ensureViewIsCreated();
+        stack.ensureViewIsCreated();
         uut.ensureViewIsCreated();
         uut.onViewAppeared();
         uut.switchToTab(1);
@@ -171,7 +170,7 @@ public class TopTabsViewControllerTest extends BaseTest {
 
     @Test
     public void setOptionsOfInitialTab() {
-        parentController.ensureViewIsCreated();
+        stack.ensureViewIsCreated();
         uut.ensureViewIsCreated();
         uut.onViewAppeared();
         verify(tabControllers.get(0), times(1)).onViewAppeared();
@@ -183,7 +182,7 @@ public class TopTabsViewControllerTest extends BaseTest {
 
     @Test
     public void setOptionsWhenTabChanges() {
-        parentController.ensureViewIsCreated();
+        stack.ensureViewIsCreated();
         uut.ensureViewIsCreated();
         tabControllers.get(0).ensureViewIsCreated();
         tabControllers.get(1).ensureViewIsCreated();
@@ -211,7 +210,7 @@ public class TopTabsViewControllerTest extends BaseTest {
     @Test
     public void appliesOptionsOnLayoutWhenVisible() {
         tabControllers.get(0).ensureViewIsCreated();
-        parentController.ensureViewIsCreated();
+        stack.ensureViewIsCreated();
         uut.ensureViewIsCreated();
 
         uut.onViewAppeared();
@@ -219,19 +218,9 @@ public class TopTabsViewControllerTest extends BaseTest {
         verify(topTabsLayout, times(1)).applyOptions(any(Options.class));
     }
 
-    @Test
-    public void applyOptions_applyOnlyOnFirstTopTabs() {
-        tabOptions.get(0).topTabOptions.title = new Text("tab title");
-        tabControllers.get(0).onViewAppeared();
-        ArgumentCaptor<Options> optionsCaptor = ArgumentCaptor.forClass(Options.class);
-        ArgumentCaptor<ReactComponent> viewCaptor = ArgumentCaptor.forClass(ReactComponent.class);
-        verify(parentController, times(1)).applyChildOptions(optionsCaptor.capture(), viewCaptor.capture());
-        assertThat(optionsCaptor.getValue().topTabOptions.title.hasValue()).isFalse();
-    }
-
     @Test
     public void applyOptions_tabsAreRemovedAfterViewDisappears() {
-        parentController.getView().removeAllViews();
+        stack.getView().removeAllViews();
 
         StackController stackController = spy(createStackController("stack"));
         ComponentViewController first = new ComponentViewController(

playground/src/screens/WelcomeScreen.js

@@ -432,7 +432,6 @@ class WelcomeScreen extends Component {
           topTabs: {
             selectedTabColor: '#12766b',
             unselectedTabColor: 'red',
-            height: 220,
             fontSize: 6
           }
         }