left button

android/app/build.gradle

@@ -50,6 +50,7 @@ dependencies {
     compile "com.android.support:appcompat-v7:23.0.1"
     compile 'com.android.support:design:23.1.1'
     compile "com.facebook.react:react-native:+"  // From node_modules
+    compile 'com.balysv.materialmenu:material-menu-toolbar:1.5.4'
 
     testCompile "junit:junit:4.12"
     testCompile "org.robolectric:robolectric:3.1.1"

android/app/src/main/java/com/reactnativenavigation/bridge/NavigationReactModule.java

@@ -45,7 +45,7 @@ public class NavigationReactModule extends ReactContextBaseJavaModule {
 
     @ReactMethod
     public void setScreenTitleBarButtons(String screenInstanceId, String navigatorEventId, ReadableArray buttons) {
-        List<TitleBarButtonParams> titleBarButtons = TitleBarButtonParamsParser.parse(BundleConverter.toBundle(buttons));
+        List<TitleBarButtonParams> titleBarButtons = TitleBarButtonParamsParser.parseButtons(BundleConverter.toBundle(buttons));
         NavigationCommandsHandler.setScreenTitleBarButtons(screenInstanceId, navigatorEventId, titleBarButtons);
     }
 

android/app/src/main/java/com/reactnativenavigation/params/ScreenParams.java

@@ -7,7 +7,8 @@ import java.util.List;
 public class ScreenParams {
     public String screenId;
     public Bundle passProps;
-    public List<TitleBarButtonParams> buttons;
+    public List<TitleBarButtonParams> rightButtons;
+    public TitleBarButtonParams leftButton;
     public String title;
     public ScreenStyleParams styleParams;
     public List<TopTabParams> topTabParams;

android/app/src/main/java/com/reactnativenavigation/params/parsers/ScreenParamsParser.java

@@ -11,7 +11,8 @@ public class ScreenParamsParser extends Parser {
     private static final String KEY_NAVIGATOR_EVENT_ID = "navigatorEventID";
     private static final String KEY_PROPS = "passProps";
     private static final String KEY_NAVIGATION_PARAMS = "navigationParams";
-    private static final String KEY_BUTTONS = "titleBarButtons";
+    private static final String KEY_RIGHT_BUTTONS = "rightButtons";
+    private static final String KEY_LEFT_BUTTON = "leftButton";
     private static final String STYLE_PARAMS = "styleParams";
     public static final String TOP_TABS = "topTabs";
 
@@ -25,7 +26,12 @@ public class ScreenParamsParser extends Parser {
         result.navigationParams = params.getBundle(KEY_NAVIGATION_PARAMS);
         result.navigatorEventId = result.navigationParams.getString(KEY_NAVIGATOR_EVENT_ID);
         result.screenInstanceId = result.navigationParams.getString(KEY_SCREEN_INSTANCE_ID);
-        result.buttons = TitleBarButtonParamsParser.parse(params.getBundle(KEY_BUTTONS));
+        if (hasKey(params, KEY_RIGHT_BUTTONS)) {
+            result.rightButtons = TitleBarButtonParamsParser.parseButtons(params.getBundle(KEY_RIGHT_BUTTONS));
+        }
+        if (hasKey(params, KEY_LEFT_BUTTON)) {
+            result.leftButton = TitleBarButtonParamsParser.parseSingleButton(params.getBundle(KEY_LEFT_BUTTON));
+        }
         result.title = params.getString(KEY_TITLE);
         result.styleParams = ScreenStyleParamsParser.parse(params.getBundle(STYLE_PARAMS));
         if (hasKey(params, TOP_TABS)) {

android/app/src/main/java/com/reactnativenavigation/params/parsers/TitleBarButtonParamsParser.java

@@ -10,19 +10,16 @@ import java.util.ArrayList;
 import java.util.List;
 
 public class TitleBarButtonParamsParser extends Parser {
-    public static List<TitleBarButtonParams> parse(Bundle params) {
+    public static List<TitleBarButtonParams> parseButtons(Bundle params) {
         List<TitleBarButtonParams> result = new ArrayList<>();
-        if (params == null) {
-            return result;
-        }
 
         for (String key : params.keySet()) {
-            result.add(parseItem(params.getBundle(key)));
+            result.add(parseSingleButton(params.getBundle(key)));
         }
         return result;
     }
 
-    private static TitleBarButtonParams parseItem(Bundle bundle) {
+    public static TitleBarButtonParams parseSingleButton(Bundle bundle) {
         TitleBarButtonParams result = new TitleBarButtonParams();
         result.label = bundle.getString("title");
         if (hasKey(bundle,"icon")) {

android/app/src/main/java/com/reactnativenavigation/screens/Screen.java

@@ -15,6 +15,7 @@ import com.reactnativenavigation.params.TitleBarButtonParams;
 import com.reactnativenavigation.utils.SdkSupports;
 import com.reactnativenavigation.utils.ViewUtils;
 import com.reactnativenavigation.views.ScrollDirectionListener;
+import com.reactnativenavigation.views.TitleBarBackButtonListener;
 import com.reactnativenavigation.views.TopBar;
 
 import java.util.List;
@@ -25,12 +26,14 @@ import static android.view.ViewGroup.LayoutParams.WRAP_CONTENT;
 public abstract class Screen extends RelativeLayout implements ScrollDirectionListener.OnScrollChanged {
 
     protected final ScreenParams screenParams;
+    private final TitleBarBackButtonListener titleBarBackButtonListener;
     protected TopBar topBar;
     private VisibilityAnimator topBarVisibilityAnimator;
 
-    public Screen(Context context, ScreenParams screenParams) {
+    public Screen(Context context, ScreenParams screenParams, TitleBarBackButtonListener titleBarBackButtonListener) {
         super(context);
         this.screenParams = screenParams;
+        this.titleBarBackButtonListener = titleBarBackButtonListener;
 
         createViews();
         setStyle(screenParams.styleParams);
@@ -45,7 +48,8 @@ public abstract class Screen extends RelativeLayout implements ScrollDirectionLi
     protected abstract void createContent();
 
     private void createTitleBar() {
-        topBar.addTitleBarAndSetButtons(screenParams.buttons, screenParams.navigatorEventId);
+        topBar.addTitleBarAndSetButtons(screenParams.rightButtons, screenParams.leftButton,
+                titleBarBackButtonListener, screenParams.navigatorEventId);
         topBar.setTitle(screenParams.title);
     }
 

android/app/src/main/java/com/reactnativenavigation/screens/ScreenFactory.java

@@ -3,13 +3,16 @@ package com.reactnativenavigation.screens;
 import android.content.Context;
 
 import com.reactnativenavigation.params.ScreenParams;
+import com.reactnativenavigation.views.TitleBarBackButtonListener;
 
 public class ScreenFactory {
-    public static Screen create(Context context, ScreenParams screenParams) {
+    public static Screen create(Context context,
+                                ScreenParams screenParams,
+                                TitleBarBackButtonListener titleBarBackButtonListener) {
         if (screenParams.hasTopTabs()) {
             return new TabbedScreen(context, screenParams);
         } else {
-            return new SingleScreen(context, screenParams);
+            return new SingleScreen(context, screenParams, titleBarBackButtonListener);
         }
     }
 }

android/app/src/main/java/com/reactnativenavigation/screens/ScreenStack.java

@@ -6,6 +6,7 @@ import android.widget.FrameLayout;
 
 import com.reactnativenavigation.params.ScreenParams;
 import com.reactnativenavigation.params.TitleBarButtonParams;
+import com.reactnativenavigation.views.TitleBarBackButtonListener;
 
 import java.util.List;
 import java.util.Stack;
@@ -13,27 +14,27 @@ import java.util.Stack;
 import static android.view.ViewGroup.LayoutParams.MATCH_PARENT;
 
 // TODO there's really no reason for ScreenStack to extend FrameLayout. All screens can be added to parent.
-public class ScreenStack extends FrameLayout {
+public class ScreenStack extends FrameLayout implements TitleBarBackButtonListener {
     private Stack<Screen> stack = new Stack<>();
 
     public ScreenStack(Context context, ScreenParams initialScreenParams) {
         super(context);
         setLayoutTransition(new LayoutTransition());
-        push(initialScreenParams);
+        pushInitialScreen(initialScreenParams);
+    }
+
+    private void pushInitialScreen(ScreenParams initialScreenParams) {
+        addScreen(initialScreenParams);
     }
 
     public void push(ScreenParams screenParams) {
-        if (isEmpty()) {
-            addScreen(screenParams);
-        } else {
-            Screen previous = stack.peek();
-            addScreen(screenParams);
-            removePreviousWithoutUnmount(previous);
-        }
+        Screen previous = stack.peek();
+        addScreen(screenParams);
+        removePreviousWithoutUnmount(previous);
     }
 
     private void addScreen(ScreenParams screenParams) {
-        Screen screen = ScreenFactory.create(getContext(), screenParams);
+        Screen screen = ScreenFactory.create(getContext(), screenParams, this);
         addView(screen, new FrameLayout.LayoutParams(MATCH_PARENT, MATCH_PARENT));
         stack.push(screen);
     }
@@ -75,10 +76,6 @@ public class ScreenStack extends FrameLayout {
         stack.clear();
     }
 
-    public boolean isEmpty() {
-        return stack.isEmpty();
-    }
-
     public int getStackSize() {
         return stack.size();
     }
@@ -122,6 +119,12 @@ public class ScreenStack extends FrameLayout {
         }
     }
 
+    @Override
+    public void onTitleBarBackPress() {
+        if (canPop()) {
+            pop();
+        }
+    }
 
     //    /**
 //     * Remove the ScreenStack from {@code parent} while preventing all child react views from getting unmounted

android/app/src/main/java/com/reactnativenavigation/screens/SingleScreen.java

@@ -5,6 +5,7 @@ import android.support.annotation.NonNull;
 
 import com.reactnativenavigation.params.ScreenParams;
 import com.reactnativenavigation.views.ContentView;
+import com.reactnativenavigation.views.TitleBarBackButtonListener;
 
 import static android.view.ViewGroup.LayoutParams.MATCH_PARENT;
 
@@ -12,8 +13,9 @@ public class SingleScreen extends Screen {
 
     private ContentView contentView;
 
-    public SingleScreen(Context context, ScreenParams screenParams) {
-        super(context, screenParams);
+    public SingleScreen(Context context, ScreenParams screenParams,
+                        TitleBarBackButtonListener titleBarBarBackButtonListener) {
+        super(context, screenParams, titleBarBarBackButtonListener);
     }
 
     @Override

android/app/src/main/java/com/reactnativenavigation/views/LeftButton.java

@@ -0,0 +1,68 @@
+package com.reactnativenavigation.views;
+
+import android.content.Context;
+import android.graphics.Color;
+import android.view.View;
+
+import com.balysv.materialmenu.MaterialMenuDrawable;
+import com.reactnativenavigation.params.TitleBarButtonParams;
+
+// TODO: replace with vector menu drawable
+public class LeftButton extends MaterialMenuDrawable implements View.OnClickListener {
+
+    private static int getColor(TitleBarButtonParams params) {
+        return params != null && params.color.hasColor() ?
+                params.color.getColor() :
+                Color.BLACK;
+    }
+
+    private TitleBarButtonParams params;
+    private final TitleBarBackButtonListener titleBarBackButtonListener;
+    private final String navigatorEventId;
+
+    public LeftButton(Context context,
+                      TitleBarButtonParams params,
+                      TitleBarBackButtonListener titleBarBackButtonListener,
+                      String navigatorEventId) {
+        super(context, getColor(params), Stroke.THIN);
+        this.params = params;
+        this.titleBarBackButtonListener = titleBarBackButtonListener;
+        this.navigatorEventId = navigatorEventId;
+        setInitialState();
+    }
+
+    private void setInitialState() {
+        if (params != null) {
+            setIconState(getIconStateFromId(params.eventId));
+        } else {
+            setVisible(false);
+        }
+    }
+
+    @Override
+    public void onClick(View v) {
+        if (isBackButton()) {
+            titleBarBackButtonListener.onTitleBarBackPress();
+        }
+    }
+
+    // TODO: move to parser
+    public IconState getIconStateFromId(String id) {
+        switch (id) {
+            case "back":
+                return IconState.ARROW;
+            case "cancel":
+                return IconState.X;
+            case "accept":
+                return IconState.CHECK;
+            case "sideMenu":
+                return IconState.BURGER;
+            default:
+                throw new RuntimeException("Unsupported button type " + id);
+        }
+    }
+
+    private boolean isBackButton() {
+        return getIconState() == IconState.ARROW;
+    }
+}

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

@@ -18,16 +18,34 @@ public class TitleBar extends Toolbar {
         super(context);
     }
 
-    public void setButtons(List<TitleBarButtonParams> buttons, String navigatorEventId) {
+    public void setRightButtons(List<TitleBarButtonParams> rightButtons, String navigatorEventId) {
         Menu menu = getMenu();
         menu.clear();
 
-        for (int i = 0; i < buttons.size(); i++) {
-            final TitleBarButton button = new TitleBarButton(menu, this, buttons.get(i), navigatorEventId);
-            // Add button in reverse order because in iOS index 0 starts at right
-            final int index = buttons.size() - i - 1;
-            button.addToMenu(index);
+        if (rightButtons == null) {
+            return;
         }
+
+        addButtonsToTitleBar(rightButtons, navigatorEventId, menu);
+    }
+
+    private void addButtonsToTitleBar(List<TitleBarButtonParams> rightButtons, String navigatorEventId, Menu menu) {
+        for (int i = 0; i < rightButtons.size(); i++) {
+            final TitleBarButton button = new TitleBarButton(menu, this, rightButtons.get(i), navigatorEventId);
+            addButtonInReverseOrder(rightButtons, i, button);
+        }
+    }
+
+    private void addButtonInReverseOrder(List<TitleBarButtonParams> rightButtons, int i, TitleBarButton button) {
+        final int index = rightButtons.size() - i - 1;
+        button.addToMenu(index);
+    }
+
+    public void setLeftButton(TitleBarButtonParams leftButtonParams,
+                               TitleBarBackButtonListener titleBarBackButtonListener, String navigatorEventId) {
+        LeftButton leftButton = new LeftButton(getContext(), leftButtonParams, titleBarBackButtonListener, navigatorEventId);
+        setNavigationOnClickListener(leftButton);
+        setNavigationIcon(leftButton);
     }
 
     public void setHideOnScroll(boolean hideOnScroll) {

android/app/src/main/java/com/reactnativenavigation/views/TitleBarBackButtonListener.java

@@ -0,0 +1,5 @@
+package com.reactnativenavigation.views;
+
+public interface TitleBarBackButtonListener {
+    void onTitleBarBackPress();
+}

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

@@ -21,10 +21,13 @@ public class TopBar extends AppBarLayout {
         setId(ViewUtils.generateViewId());
     }
 
-    public void addTitleBarAndSetButtons(List<TitleBarButtonParams> buttons, String navigatorEventId) {
+    public void addTitleBarAndSetButtons(List<TitleBarButtonParams> rightButtons, TitleBarButtonParams leftButton,
+                                         TitleBarBackButtonListener titleBarBackButtonListener,
+                                         String navigatorEventId) {
         titleBar = new TitleBar(getContext());
         addView(titleBar);
-        titleBar.setButtons(buttons, navigatorEventId);
+        titleBar.setRightButtons(rightButtons, navigatorEventId);
+        titleBar.setLeftButton(leftButton, titleBarBackButtonListener, navigatorEventId);
     }
 
     public void setTitle(String title) {
@@ -40,7 +43,7 @@ public class TopBar extends AppBarLayout {
     }
 
     public void setTitleBarButtons(String navigatorEventId, List<TitleBarButtonParams> titleBarButtons) {
-        titleBar.setButtons(titleBarButtons, navigatorEventId);
+        titleBar.setRightButtons(titleBarButtons, navigatorEventId);
     }
 
     public TabLayout initTabs() {

src/deprecated/platformSpecificDeprecated.android.js

@@ -136,6 +136,7 @@ function addTabIcon(tab) {
   }
 }
 
+// TODO: add left buttons here
 function navigatorSetButtons(navigator, navigatorEventID, params) {
   if (params.rightButtons) {
     params.rightButtons.forEach(function(button) {
@@ -229,8 +230,7 @@ function addNavigatorButtons(screen) {
   Object.assign(screen, Screen.navigatorButtons);
 
   // Get image uri from image id
-  const rightButtons = screen.navigatorButtons ? screen.navigatorButtons.rightButtons : null;
-
+  const rightButtons = getRightButtons(screen);
   if (rightButtons) {
     rightButtons.forEach(function(button) {
       if (button.icon) {
@@ -242,7 +242,38 @@ function addNavigatorButtons(screen) {
     });
   }
 
-  screen.titleBarButtons = rightButtons;
+  const leftButton = getLeftButton(screen);
+  if (leftButton) {
+    if (leftButton.icon) {
+      const icon = resolveAssetSource(leftButton.icon);
+      if (icon) {
+        leftButton.icon = icon.uri;
+      }
+    }
+  }
+
+  if (rightButtons) {
+    screen.rightButtons = rightButtons;
+  }
+  if (leftButton) {
+    screen.leftButton = leftButton;
+  }
+}
+
+function getLeftButton(screen) {
+  if (screen.navigatorButtons) {
+    return screen.navigatorButtons.leftButton;
+  }
+
+  return screen.leftButton
+}
+
+function getRightButtons(screen) {
+  if (screen.navigatorButtons) {
+    return screen.navigatorButtons.rightButtons;
+  }
+
+  return screen.rightButtons
 }
 
 function addNavigationStyleParams(screen) {