Top tabs android2 (#2346)

* Restructure TopTabsLayout

* Refactor Containers

* Consolidate view creators. For some reason we had double abstraction layer and had creators invoking creators
* Rename ContainerView to ContainerLayout

* fix test

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

@@ -10,7 +10,6 @@ import com.reactnativenavigation.viewcontrollers.SideMenuController;
 import com.reactnativenavigation.viewcontrollers.StackController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
 import com.reactnativenavigation.viewcontrollers.overlay.DialogViewController;
-import com.reactnativenavigation.viewcontrollers.toptabs.TopTabController;
 import com.reactnativenavigation.viewcontrollers.toptabs.TopTabsController;
 import com.reactnativenavigation.views.ContainerViewCreator;
 import com.reactnativenavigation.views.TopTabCreator;
@@ -33,7 +32,7 @@ public class LayoutFactory {
 	public ViewController create(final LayoutNode node) {
 		switch (node.type) {
 			case Container:
-				return createContainer(node);
+				return createContainer(node, new ContainerViewCreator(reactInstanceManager));
 			case ContainerStack:
 				return createContainerStack(node);
 			case BottomTabs:
@@ -51,7 +50,7 @@ public class LayoutFactory {
             case TopTabsContainer:
                 return createTopTabsContainer(node);
             case TopTab:
-                return createTopTabContainer(node);
+                return createContainer(node, new TopTabCreator(reactInstanceManager));
 			default:
 				throw new IllegalArgumentException("Invalid node type: " + node.type);
 		}
@@ -90,11 +89,16 @@ public class LayoutFactory {
 		return create(node.children.get(0));
 	}
 
-	private ViewController createContainer(LayoutNode node) {
+	private ViewController createContainer(LayoutNode node, ContainerViewController.ReactViewCreator reactViewCreator) {
 		String id = node.id;
 		String name = node.data.optString("name");
 		NavigationOptions navigationOptions = NavigationOptions.parse(node.data.optJSONObject("navigationOptions"), defaultOptions);
-		return new ContainerViewController(activity, id, name, new ContainerViewCreator(new ReactContainerViewCreator(reactInstanceManager)), navigationOptions);
+		return new ContainerViewController(activity,
+                id,
+                name,
+                reactViewCreator,
+                navigationOptions
+        );
 	}
 
 	private ViewController createContainerStack(LayoutNode node) {
@@ -129,12 +133,4 @@ public class LayoutFactory {
         }
         return new TopTabsController(activity, node.id, tabs);
     }
-
-    private TopTabController createTopTabContainer(LayoutNode node) {
-        String name = node.data.optString("name");
-        return new TopTabController(activity,
-                node.id,
-                name,
-                new TopTabCreator(new ReactContainerViewCreator(reactInstanceManager)));
-    }
 }

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

@@ -8,7 +8,7 @@ import com.reactnativenavigation.parse.TopBarOptions;
 import com.reactnativenavigation.parse.TopTabsOptions;
 import com.reactnativenavigation.utils.TypefaceLoader;
 import com.reactnativenavigation.viewcontrollers.ContainerViewController;
-import com.reactnativenavigation.views.ContainerView;
+import com.reactnativenavigation.views.ContainerLayout;
 
 public class OptionsPresenter {
 
@@ -47,7 +47,7 @@ public class OptionsPresenter {
 			return;
 		}
 		if (animated == NavigationOptions.BooleanOptions.True) {
-			ContainerView topBarContainerView = (ContainerView) controller.getContainerView();
+			ContainerLayout topBarContainerView = (ContainerLayout) controller.getContainerView();
 			animator.animateShowTopBar(controller.getTopBar(), topBarContainerView.getReactView().asView());
 		} else {
 			controller.getTopBar().setVisibility(View.VISIBLE);
@@ -59,7 +59,7 @@ public class OptionsPresenter {
 			return;
 		}
 		if (animated == NavigationOptions.BooleanOptions.True) {
-			ContainerView topBarContainerView = (ContainerView) controller.getContainerView();
+			ContainerLayout topBarContainerView = (ContainerLayout) controller.getContainerView();
 			animator.animateHideTopBar(controller.getTopBar(), topBarContainerView.getReactView().asView());
 		} else {
 			controller.getTopBar().setVisibility(View.GONE);

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

@@ -7,8 +7,8 @@ import android.view.View;
 import com.reactnativenavigation.parse.NavigationOptions;
 import com.reactnativenavigation.presentation.NavigationOptionsListener;
 import com.reactnativenavigation.presentation.OptionsPresenter;
+import com.reactnativenavigation.views.Container;
 import com.reactnativenavigation.views.TopBar;
-import com.reactnativenavigation.views.ContainerView;
 
 public class ContainerViewController extends ViewController implements NavigationOptionsListener {
 
@@ -96,8 +96,8 @@ public class ContainerViewController extends ViewController implements Navigatio
 	@Override
 	protected View createView() {
 		containerView = viewCreator.create(getActivity(), getId(), containerName);
-		if (containerView instanceof ContainerView) {
-			topBar = ((ContainerView) containerView).getTopBar();
+		if (containerView instanceof Container) {
+			topBar = ((Container) containerView).getTopBar();
 		}
 		return containerView.asView();
 	}

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

@@ -1,25 +0,0 @@
-package com.reactnativenavigation.viewcontrollers.toptabs;
-
-import android.app.Activity;
-import android.support.annotation.NonNull;
-import android.view.ViewGroup;
-
-import com.reactnativenavigation.viewcontrollers.ViewController;
-import com.reactnativenavigation.views.TopTabCreator;
-
-public class TopTabController extends ViewController {
-    private String name;
-    private TopTabCreator topTabCreator;
-
-    public TopTabController(Activity activity, String id, String name, TopTabCreator topTabCreator) {
-        super(activity, id);
-        this.name = name;
-        this.topTabCreator = topTabCreator;
-    }
-
-    @NonNull
-    @Override
-    protected ViewGroup createView() {
-        return (ViewGroup) topTabCreator.create(getActivity(), getId(), name);
-    }
-}

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

@@ -6,6 +6,7 @@ import android.view.ViewGroup;
 
 import com.reactnativenavigation.viewcontrollers.ParentController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
+import com.reactnativenavigation.views.TopTabsLayout;
 
 import java.util.Collection;
 import java.util.List;
@@ -22,7 +23,7 @@ public class TopTabsController extends ParentController {
     @NonNull
     @Override
     protected ViewGroup createView() {
-        return new TopTabsViewPager(getActivity(), tabs);
+        return new TopTabsLayout(getActivity(), tabs);
     }
 
     @NonNull
@@ -30,4 +31,9 @@ public class TopTabsController extends ParentController {
     public Collection<ViewController> getChildControllers() {
         return tabs;
     }
+
+    @Override
+    protected boolean isViewShown() {
+        return super.isViewShown();
+    }
 }

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

@@ -1,5 +1,6 @@
 package com.reactnativenavigation.viewcontrollers.toptabs;
 
+import android.annotation.SuppressLint;
 import android.content.Context;
 import android.support.v4.view.ViewPager;
 import android.view.View;
@@ -12,6 +13,7 @@ import java.util.List;
 
 import static android.view.ViewGroup.LayoutParams.MATCH_PARENT;
 
+@SuppressLint("ViewConstructor")
 public class TopTabsViewPager extends ViewPager implements ContainerViewController.IReactView {
     private static final int OFFSCREEN_PAGE_LIMIT = 99;
     private final List<ViewController> tabs;

lib/android/app/src/main/java/com/reactnativenavigation/views/Container.java

@@ -0,0 +1,7 @@
+package com.reactnativenavigation.views;
+
+import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+
+public interface Container extends ContainerViewController.IReactView {
+    TopBar getTopBar();
+}

lib/android/app/src/main/java/com/reactnativenavigation/views/ContainerView.java → lib/android/app/src/main/java/com/reactnativenavigation/views/ContainerLayout.java

@@ -6,12 +6,12 @@ import android.widget.LinearLayout;
 
 import com.reactnativenavigation.viewcontrollers.ContainerViewController.IReactView;
 
-public class ContainerView extends LinearLayout implements IReactView {
+public class ContainerLayout extends LinearLayout implements Container {
 
 	private TopBar topBar;
 	private IReactView reactView;
 
-	public ContainerView(Context context, IReactView reactView) {
+	public ContainerLayout(Context context, IReactView reactView) {
 		super(context);
 		this.topBar = new TopBar(context);
 		this.reactView = reactView;
@@ -24,7 +24,7 @@ public class ContainerView extends LinearLayout implements IReactView {
 		addView(reactView.asView());
 	}
 
-	public ContainerView(Context context) {
+	public ContainerLayout(Context context) {
 		super(context);
 	}
 
@@ -53,6 +53,7 @@ public class ContainerView extends LinearLayout implements IReactView {
 		reactView.sendContainerStop();
 	}
 
+    @Override
 	public TopBar getTopBar() {
 		return topBar;
 	}

lib/android/app/src/main/java/com/reactnativenavigation/views/ContainerViewCreator.java

@@ -2,18 +2,21 @@ package com.reactnativenavigation.views;
 
 import android.app.Activity;
 
+import com.facebook.react.ReactInstanceManager;
+import com.reactnativenavigation.react.ReactContainerViewCreator;
 import com.reactnativenavigation.viewcontrollers.ContainerViewController;
 
 public class ContainerViewCreator implements ContainerViewController.ReactViewCreator {
 
-	private ContainerViewController.ReactViewCreator creator;
+    private ReactInstanceManager instanceManager;
 
-	public ContainerViewCreator(ContainerViewController.ReactViewCreator creator) {
-		this.creator = creator;
+    public ContainerViewCreator(ReactInstanceManager instanceManager) {
+        this.instanceManager = instanceManager;
 	}
 
 	@Override
 	public ContainerViewController.IReactView create(Activity activity, String containerId, String containerName) {
-        return new ContainerView(activity, creator.create(activity, containerId, containerName));
+        ContainerViewController.IReactView reactView = new ReactContainerViewCreator(instanceManager).create(activity, containerId, containerName);
+        return new ContainerLayout(activity, reactView);
 	}
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/TopTab.java

@@ -48,8 +48,4 @@ public class TopTab extends FrameLayout implements IReactView {
 	public void sendContainerStop() {
 		reactView.sendContainerStop();
 	}
-
-	public IReactView getReactView() {
-		return reactView;
-	}
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/TopTabCreator.java

@@ -2,18 +2,22 @@ package com.reactnativenavigation.views;
 
 import android.app.Activity;
 
+import com.facebook.react.ReactInstanceManager;
+import com.reactnativenavigation.react.ReactContainerViewCreator;
 import com.reactnativenavigation.viewcontrollers.ContainerViewController;
 
 public class TopTabCreator implements ContainerViewController.ReactViewCreator {
 
-	private ContainerViewController.ReactViewCreator creator;
 
-	public TopTabCreator(ContainerViewController.ReactViewCreator creator) {
-		this.creator = creator;
-	}
+    private ReactInstanceManager instanceManager;
+
+    public TopTabCreator(ReactInstanceManager instanceManager) {
+        this.instanceManager = instanceManager;
+    }
 
 	@Override
 	public ContainerViewController.IReactView create(Activity activity, String containerId, String containerName) {
-        return new TopTab(activity, creator.create(activity, containerId, containerName));
+        ContainerViewController.IReactView reactView = new ReactContainerViewCreator(instanceManager).create(activity, containerId, containerName);
+        return new TopTab(activity, reactView);
 	}
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/TopTabsLayout.java

@@ -0,0 +1,30 @@
+package com.reactnativenavigation.views;
+
+import android.annotation.SuppressLint;
+import android.content.Context;
+import android.widget.LinearLayout;
+
+import com.reactnativenavigation.viewcontrollers.ViewController;
+import com.reactnativenavigation.viewcontrollers.toptabs.TopTabsViewPager;
+
+import java.util.List;
+
+@SuppressLint("ViewConstructor")
+public class TopTabsLayout extends LinearLayout {
+
+    private TopBar topBar;
+    private TopTabsViewPager viewPager;
+
+    public TopTabsLayout(Context context, List<ViewController> tabs) {
+        super(context);
+        topBar = new TopBar(context);
+        viewPager = new TopTabsViewPager(context, tabs);
+        initViews();
+    }
+
+    private void initViews() {
+        setOrientation(VERTICAL);
+        addView(topBar);
+        addView(viewPager);
+    }
+}

lib/android/app/src/test/java/com/reactnativenavigation/mocks/SimpleContainerViewController.java

@@ -4,10 +4,9 @@ import android.app.Activity;
 
 import com.reactnativenavigation.parse.NavigationOptions;
 import com.reactnativenavigation.viewcontrollers.ContainerViewController;
-import com.reactnativenavigation.views.ContainerViewCreator;
 
 public class SimpleContainerViewController extends ContainerViewController {
 	public SimpleContainerViewController(final Activity activity, final String id) {
-		super(activity, id, "theContainerName", new ContainerViewCreator(new TestContainerViewCreator()), new NavigationOptions());
+		super(activity, id, "theContainerName", new TestContainerViewCreator(), new NavigationOptions());
 	}
 }

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestContainerView.java → lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestContainerLayout.java

@@ -4,19 +4,19 @@ import android.content.Context;
 import android.view.View;
 
 import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.views.Container;
 import com.reactnativenavigation.views.TopBar;
 
-public class TestContainerView extends View implements ContainerViewController.IReactView {
+public class TestContainerLayout extends View implements ContainerViewController.IReactView, Container {
 
 	private TopBar topBar;
 
-	public TestContainerView(final Context context) {
+	public TestContainerLayout(final Context context) {
 		super(context);
 		topBar = new TopBar(context);
-
 	}
 
-	@Override
+    @Override
 	public boolean isReady() {
 		return false;
 	}
@@ -37,4 +37,9 @@ public class TestContainerView extends View implements ContainerViewController.I
 	@Override
 	public void sendContainerStop() {
 	}
+
+    @Override
+    public TopBar getTopBar() {
+        return topBar;
+    }
 }

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestContainerViewCreator.java

@@ -8,6 +8,6 @@ import com.reactnativenavigation.viewcontrollers.ContainerViewController.ReactVi
 public class TestContainerViewCreator implements ReactViewCreator {
 	@Override
 	public ContainerViewController.IReactView create(final Activity activity, final String containerId, final String containerName) {
-		return new TestContainerView(activity);
+		return new TestContainerLayout(activity);
 	}
 }

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

@@ -3,7 +3,7 @@ package com.reactnativenavigation.viewcontrollers;
 import android.app.Activity;
 
 import com.reactnativenavigation.BaseTest;
-import com.reactnativenavigation.mocks.TestContainerView;
+import com.reactnativenavigation.mocks.TestContainerLayout;
 import com.reactnativenavigation.parse.NavigationOptions;
 
 import org.junit.Test;
@@ -22,7 +22,7 @@ public class ContainerViewControllerTest extends BaseTest {
 	public void beforeEach() {
 		super.beforeEach();
 		Activity activity = newActivity();
-		view = spy(new TestContainerView(activity));
+		view = spy(new TestContainerLayout(activity));
 		uut = new ContainerViewController(activity, "containerId1", "containerName", new ContainerViewController.ReactViewCreator() {
 			@Override
 			public ContainerViewController.IReactView create(final Activity activity1, final String containerId, final String containerName) {

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

@@ -6,15 +6,13 @@ import android.graphics.drawable.ColorDrawable;
 import android.view.View;
 
 import com.reactnativenavigation.BaseTest;
-import com.reactnativenavigation.mocks.TestContainerView;
+import com.reactnativenavigation.mocks.TestContainerLayout;
 import com.reactnativenavigation.parse.NavigationOptions;
-import com.reactnativenavigation.views.ContainerViewCreator;
 
 import org.junit.Test;
 
 import static org.assertj.core.api.Java6Assertions.assertThat;
 import static org.mockito.Mockito.spy;
-import static org.mockito.Mockito.verify;
 
 public class OptionsApplyingTest extends BaseTest {
 	private Activity activity;
@@ -27,14 +25,14 @@ public class OptionsApplyingTest extends BaseTest {
 		super.beforeEach();
 		activity = newActivity();
 		initialNavigationOptions = new NavigationOptions();
-		view = spy(new TestContainerView(activity));
+		view = spy(new TestContainerLayout(activity));
 		uut = new ContainerViewController(activity, "containerId1", "containerName",
-				new ContainerViewCreator(new ContainerViewController.ReactViewCreator() {
-					@Override
-					public ContainerViewController.IReactView create(final Activity activity1, final String containerId, final String containerName) {
-						return view;
-					}
-				}), initialNavigationOptions);
+                new ContainerViewController.ReactViewCreator() {
+                    @Override
+                    public ContainerViewController.IReactView create(final Activity activity1, final String containerId, final String containerName) {
+                        return view;
+                    }
+                }, initialNavigationOptions);
 	}
 
 	@Test

playground/src/containers/TopTabScreen.js

@@ -0,0 +1,40 @@
+const React = require('react');
+const { PureComponent } = require('react');
+const { View, Text } = require('react-native');
+
+class TopTabScreen extends PureComponent {
+  render() {
+    return (
+      <View style={styles.root}>
+        <Text style={styles.h1}>{this.props.text || 'Top Tab Screen'}</Text>
+        <Text style={styles.footer}>{`this.props.containerId = ${this.props.containerId}`}</Text>
+      </View>
+    );
+  }
+}
+
+module.exports = TopTabScreen;
+
+const styles = {
+  root: {
+    flexGrow: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#f5fcff'
+  },
+  h1: {
+    fontSize: 24,
+    textAlign: 'center',
+    margin: 10
+  },
+  h2: {
+    fontSize: 12,
+    textAlign: 'center',
+    margin: 10
+  },
+  footer: {
+    fontSize: 10,
+    color: '#888',
+    marginTop: 10
+  }
+};

playground/src/containers/WelcomeScreen.js

@@ -152,7 +152,7 @@ class WelcomeScreen extends Component {
       topTabs: [
         {
           container: {
-            name: 'navigation.playground.TextScreen',
+            name: 'navigation.playground.TopTabScreen',
             passProps: {
               text: 'This is top tab 1'
             }
@@ -160,7 +160,7 @@ class WelcomeScreen extends Component {
         },
         {
           container: {
-            name: 'navigation.playground.TextScreen',
+            name: 'navigation.playground.TopTabScreen',
             passProps: {
               text: 'This is top tab 2'
             }
@@ -168,7 +168,7 @@ class WelcomeScreen extends Component {
         },
         {
           container: {
-            name: 'navigation.playground.TextScreen',
+            name: 'navigation.playground.TopTabScreen',
             passProps: {
               text: 'This is top tab 3'
             }

playground/src/containers/index.js

@@ -13,6 +13,7 @@ const CustomTransitionDestination = require('./CustomTransitionDestination');
 const CustomDialog = require('./CustomDialog');
 const BandHandlerScreen = require('./BackHandlerScreen');
 const SideMenuScreen = require('./SideMenuScreen');
+const TopTabScreen = require('./TopTabScreen');
 
 function registerContainers() {
   Navigation.registerContainer(`navigation.playground.CustomTransitionDestination`, () => CustomTransitionDestination);
@@ -29,6 +30,7 @@ function registerContainers() {
   Navigation.registerContainer('navigation.playground.CustomDialog', () => CustomDialog);
   Navigation.registerContainer('navigation.playground.BackHandlerScreen', () => BandHandlerScreen);
   Navigation.registerContainer('navigation.playground.SideMenuScreen', () => SideMenuScreen);
+  Navigation.registerContainer('navigation.playground.TopTabScreen', () => TopTabScreen);
 }
 
 module.exports = {