Skip to content

Android drawer implementation #82

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
guyca merged 3 commits into from
Jun 25, 2016
Merged

Android drawer implementation #82

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
b96c05f
Drawer implementation
Jun 24, 2016
af89ea5
Fix possible NPE when setting nav bar button color
Jun 24, 2016
fe4835c
Move drawer setup to BaseReactActivity
Jun 25, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
77 changes: 73 additions & 4 deletions android/app/src/main/java/com/reactnativenavigation/activities/BaseReactActivity.java
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,21 @@
package com.reactnativenavigation.activities;

import android.content.Intent;
import android.content.res.Configuration;
import android.os.Build;
import android.os.Bundle;
import android.os.Handler;
import android.provider.Settings;
import android.support.annotation.CallSuper;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.KeyEvent;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.EditText;
import android.widget.FrameLayout;
import android.widget.Toast;

import com.facebook.common.logging.FLog;
Expand All @@ -28,12 +32,14 @@
import com.reactnativenavigation.controllers.ModalController;
import com.reactnativenavigation.core.RctManager;
import com.reactnativenavigation.core.objects.Button;
import com.reactnativenavigation.core.objects.Drawer;
import com.reactnativenavigation.core.objects.Screen;
import com.reactnativenavigation.modal.RnnModal;
import com.reactnativenavigation.packages.RnnPackage;
import com.reactnativenavigation.utils.ContextProvider;
import com.reactnativenavigation.utils.StyleHelper;
import com.reactnativenavigation.views.RnnToolBar;
import com.reactnativenavigation.views.ScreenStack;

import java.util.Arrays;
import java.util.List;
Expand All @@ -48,8 +54,10 @@ public abstract class BaseReactActivity extends AppCompatActivity implements Def
protected static final String KEY_ANIMATED = "animated";
protected static final String KEY_BADGE = "badge";
protected static final String KEY_HIDDEN = "hidden";
protected static final String KEY_SIDE = "side";
protected static final String KEY_TAB_INDEX = "tabIndex";
protected static final String KEY_TITLE = "title";
protected static final String KEY_TO = "to";
private static final String TAG = "BaseReactActivity";
private static final String REDBOX_PERMISSION_MESSAGE =
"Overlay permissions needs to be granted in order for react native apps to run in dev mode";
Expand All @@ -59,6 +67,9 @@ public abstract class BaseReactActivity extends AppCompatActivity implements Def
private boolean mDoRefresh = false;
private Menu mMenu;
protected RnnToolBar mToolbar;
protected ActionBarDrawerToggle mDrawerToggle;
protected DrawerLayout mDrawerLayout;
protected ScreenStack mDrawerStack;

/**
* Returns the name of the bundle in assets. If this is null, and no file path is specified for
Expand Down Expand Up @@ -223,7 +234,7 @@ public void push(Screen screen) {

if (getCurrentNavigatorId().equals(screen.navigatorId) &&
getScreenStackSize() >= 1) {
mToolbar.showBackButton(screen);
mToolbar.setNavUpButton(screen);
}
}
}
Expand All @@ -233,15 +244,16 @@ public Screen pop(String navigatorId) {
if (mToolbar != null &&
getCurrentNavigatorId().equals(navigatorId) &&
getScreenStackSize() <= 2) {
mToolbar.hideBackButton();
mToolbar.setNavUpButton();
}

return null;
}

@CallSuper
public Screen popToRoot(String navigatorId) {
if (mToolbar != null) {
mToolbar.hideBackButton();
mToolbar.setNavUpButton();
}

return null;
Expand All @@ -251,7 +263,7 @@ public Screen popToRoot(String navigatorId) {
public Screen resetTo(Screen screen) {
StyleHelper.updateStyles(mToolbar, screen);
if (mToolbar != null) {
mToolbar.hideBackButton();
mToolbar.setNavUpButton();
}

return null;
Expand All @@ -273,6 +285,14 @@ public Screen getCurrentScreen() {

public abstract int getScreenStackSize();

@Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
if (mDrawerToggle != null) {
mDrawerToggle.onConfigurationChanged(newConfig);
}
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
mMenu = menu;
Expand All @@ -285,6 +305,12 @@ public boolean onCreateOptionsMenu(Menu menu) {

@Override
public boolean onOptionsItemSelected(MenuItem item) {
if (mDrawerToggle != null &&
getScreenStackSize() == 1 &&
mDrawerToggle.onOptionsItemSelected(item)) {
return true;
}

if (item.getItemId() == android.R.id.home) {
onBackPressed();
} else {
Expand All @@ -297,6 +323,14 @@ public boolean onOptionsItemSelected(MenuItem item) {
return super.onOptionsItemSelected(item);
}

@Override
public void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
if (mDrawerToggle != null) {
mDrawerToggle.syncState();
}
}

public Menu getMenu() {
return mMenu;
}
Expand Down Expand Up @@ -355,6 +389,20 @@ public void invokeDefaultOnBackPressed() {
super.onBackPressed();
}

protected void setupDrawer(Screen screen, Drawer drawer, int drawerFrameId, int drawerLayoutId) {
Copy link
Copy Markdown
Author

@FeralAI FeralAI Jun 25, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

setupDrawer is taking in the layout IDs here since I'm not sure there's a way to get those from the base activity. I wasn't able to when initially refactoring.

Copy link
Copy Markdown
Author

@FeralAI FeralAI Jun 25, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nevermind me, it makes sense. They're different layouts, so they will generate different layout IDs.

Copy link
Copy Markdown
Collaborator

@guyca guyca Jun 25, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We also don't have to pass the id's as params to setupDrawer since in both layout files we use the same ids for the views. findViewById will search for these views in the layout which was passed to setContentView. No biggie, I'll merge and make that minor change later.
@jskuby Thanks a lot for your work!

if (drawer == null || drawer.left == null) {
return;
}

mDrawerStack = new ScreenStack(this);
FrameLayout drawerFrame = (FrameLayout) findViewById(drawerFrameId);
drawerFrame.addView(mDrawerStack);
mDrawerStack.push(drawer.left);

mDrawerLayout = (DrawerLayout) findViewById(drawerLayoutId);
mDrawerToggle = mToolbar.setupDrawer(mDrawerLayout, drawer.left, screen);
}

public void setNavigationButtons(ReadableMap buttons){
if (mToolbar == null) {
return;
Expand Down Expand Up @@ -384,4 +432,25 @@ public void toggleNavigationBar(ReadableMap params) {
mToolbar.showToolbar(animated);
}
}

public void toggleDrawer(ReadableMap params) {
if (mToolbar == null || mDrawerToggle == null) {
return;
}

boolean animated = params.getBoolean(KEY_ANIMATED);
String side = params.getString(KEY_SIDE);
String to = params.getString(KEY_TO);
switch (to) {
case "open":
mToolbar.showDrawer(animated);
break;
case "closed":
mToolbar.hideDrawer(animated);
break;
default:
mToolbar.toggleDrawer(animated);
break;
}
}
}
8 changes: 6 additions & 2 deletions android/app/src/main/java/com/reactnativenavigation/activities/BottomTabActivity.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
import com.facebook.react.bridge.ReadableMap;
import com.reactnativenavigation.R;
import com.reactnativenavigation.core.RctManager;
import com.reactnativenavigation.core.objects.Drawer;
import com.reactnativenavigation.core.objects.Screen;
import com.reactnativenavigation.utils.StyleHelper;
import com.reactnativenavigation.views.RnnToolBar;
Expand All @@ -25,6 +26,7 @@
* Created by guyc on 02/04/16.
*/
public class BottomTabActivity extends BaseReactActivity implements AHBottomNavigation.OnTabSelectedListener {
public static final String DRAWER_PARAMS = "drawerParams";
public static final String EXTRA_SCREENS = "extraScreens";

private static final String TAB_STYLE_BUTTON_COLOR = "tabBarButtonColor";
Expand Down Expand Up @@ -52,7 +54,9 @@ protected void handleOnCreate() {
mContentFrame = (FrameLayout) findViewById(R.id.contentFrame);

final ArrayList<Screen> screens = (ArrayList<Screen>) getIntent().getSerializableExtra(EXTRA_SCREENS);
final Drawer drawer = (Drawer) getIntent().getSerializableExtra(DRAWER_PARAMS);
mBottomNavigation.setForceTint(true);
setupDrawer(screens.get(0), drawer, R.id.drawerFrame, R.id.drawerLayout);
setupTabs(getIntent().getExtras());
setupPages(screens);

Expand Down Expand Up @@ -189,9 +193,9 @@ public void onTabSelected(int position, boolean wasSelected) {

// Hide or show back button if needed
if (getScreenStackSize() > 1) {
mToolbar.showBackButton(getCurrentScreen());
mToolbar.setNavUpButton(getCurrentScreen());
} else {
mToolbar.hideBackButton();
mToolbar.setNavUpButton();
}
}

Expand Down
8 changes: 7 additions & 1 deletion android/app/src/main/java/com/reactnativenavigation/activities/SingleScreenActivity.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@

import com.reactnativenavigation.R;
import com.reactnativenavigation.core.RctManager;
import com.reactnativenavigation.core.objects.Drawer;
import com.reactnativenavigation.core.objects.Screen;
import com.reactnativenavigation.utils.StyleHelper;
import com.reactnativenavigation.views.RnnToolBar;
Expand All @@ -14,6 +15,7 @@
*/
public class SingleScreenActivity extends BaseReactActivity {

public static final String DRAWER_PARAMS = "drawerParams";
public static final String EXTRA_SCREEN = "extraScreen";

private ScreenStack mScreenStack;
Expand All @@ -27,7 +29,11 @@ protected void handleOnCreate() {
mToolbar = (RnnToolBar) findViewById(R.id.toolbar);

final Screen screen = (Screen) getIntent().getSerializableExtra(EXTRA_SCREEN);
final Drawer drawer = (Drawer) getIntent().getSerializableExtra(DRAWER_PARAMS);

mNavigatorId = screen.navigatorId;
setupToolbar(screen);
setupDrawer(screen, drawer, R.id.drawerFrame, R.id.drawerLayout);

mScreenStack = new ScreenStack(this);
FrameLayout contentFrame = (FrameLayout) findViewById(R.id.contentFrame);
Expand All @@ -48,7 +54,7 @@ protected void setupToolbar(Screen screen) {
mToolbar.update(screen);
StyleHelper.updateStyles(mToolbar, screen);
}

@Override
public void push(Screen screen) {
super.push(screen);
Expand Down
23 changes: 23 additions & 0 deletions android/app/src/main/java/com/reactnativenavigation/core/objects/Drawer.java
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
package com.reactnativenavigation.core.objects;

import com.facebook.react.bridge.ReadableMap;

import java.io.Serializable;

public class Drawer extends JsonObject implements Serializable {
private static final long serialVersionUID = 982836768712398756L;

private static final String KEY_LEFT = "left";
private static final String KEY_RIGHT = "right";
private static final String KEY_DISABLE_OPEN_GESTURE = "disableOpenGesture";

public final Screen left;
public final Screen right;
public final boolean disableOpenGesture;

public Drawer(ReadableMap params) {
left = params.hasKey(KEY_LEFT) ? new Screen(params.getMap(KEY_LEFT)) : null;
right = params.hasKey(KEY_RIGHT) ? new Screen(params.getMap(KEY_RIGHT)) : null;
disableOpenGesture = getBoolean(params, KEY_DISABLE_OPEN_GESTURE);
}
}
8 changes: 6 additions & 2 deletions android/app/src/main/java/com/reactnativenavigation/core/objects/Screen.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ public class Screen extends JsonObject implements Serializable {
private static final String KEY_RIGHT_BUTTONS = "rightButtons";
private static final String KEY_TOOL_BAR_STYLE = "navigatorStyle";
private static final String KEY_STATUS_BAR_COLOR = "statusBarColor";
private static final String KEY_TOOL_BAR_COLOR = "toolBarColor";
private static final String KEY_TOOL_BAR_COLOR = "navBarBackgroundColor";
private static final String KEY_TOOL_BAR_HIDDEN = "navBarHidden";
private static final String KEY_NAVIGATION_BAR_COLOR = "navigationBarColor";
private static final String KEY_NAV_BAR_BUTTON_COLOR = "navBarButtonColor";
Expand All @@ -44,7 +44,7 @@ public class Screen extends JsonObject implements Serializable {
private static final String KEY_TAB_INDICATOR_COLOR = "tabIndicatorColor";
private static final String KEY_PROPS = "passProps";

public final String title;
public String title;
public final String label;
public final String screenId;
public final String screenInstanceId;
Expand Down Expand Up @@ -85,6 +85,10 @@ public Screen(ReadableMap screen) {
setToolbarStyle(screen);
}

public void setTitle(ReadableMap params) {
this.title = getString(params, KEY_TITLE);
}

public void setButtons(ReadableMap params) {
this.buttons = getButtons(params);
}
Expand Down
25 changes: 23 additions & 2 deletions android/app/src/main/java/com/reactnativenavigation/modules/RctActivityModule.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
import com.reactnativenavigation.activities.RootActivity;
import com.reactnativenavigation.activities.SingleScreenActivity;
import com.reactnativenavigation.controllers.ModalController;
import com.reactnativenavigation.core.objects.Drawer;
import com.reactnativenavigation.core.objects.Screen;
import com.reactnativenavigation.modal.RnnModal;
import com.reactnativenavigation.utils.BridgeUtils;
Expand All @@ -39,14 +40,17 @@ public String getName() {
}

@ReactMethod
public void startTabBasedApp(ReadableArray screens, ReadableMap style) {
public void startTabBasedApp(ReadableArray screens, ReadableMap style, ReadableMap drawerParams) {
Activity context = ContextProvider.getActivityContext();
if (context != null && !context.isFinishing()) {
Intent intent = new Intent(context, BottomTabActivity.class);
intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TASK | Intent.FLAG_ACTIVITY_NEW_TASK);

Bundle extras = new Bundle();
extras.putSerializable(BottomTabActivity.EXTRA_SCREENS, createScreens(screens));
if (drawerParams != null) {
extras.putSerializable(BottomTabActivity.DRAWER_PARAMS, new Drawer(drawerParams));
}
if (style != null) {
BridgeUtils.addMapToBundle(((ReadableNativeMap) style).toHashMap(), extras);
}
Expand All @@ -72,14 +76,17 @@ private ArrayList<Screen> createScreens(ReadableArray screens) {
}

@ReactMethod
public void startSingleScreenApp(ReadableMap screen) {
public void startSingleScreenApp(ReadableMap screen, ReadableMap drawerParams) {
BaseReactActivity context = ContextProvider.getActivityContext();
if (context != null && !context.isFinishing()) {
Intent intent = new Intent(context, SingleScreenActivity.class);
intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TASK | Intent.FLAG_ACTIVITY_NEW_TASK);

Bundle extras = new Bundle();
extras.putSerializable(SingleScreenActivity.EXTRA_SCREEN, new Screen(screen));
if (drawerParams != null) {
extras.putSerializable(SingleScreenActivity.DRAWER_PARAMS, new Drawer(drawerParams));
}
intent.putExtras(extras);

context.startActivity(intent);
Expand Down Expand Up @@ -148,6 +155,20 @@ public void run() {
});
}

@ReactMethod
public void toggleDrawer(final ReadableMap params) {
final BaseReactActivity context = ContextProvider.getActivityContext();
if (context == null || context.isFinishing()) {
return;
}
context.runOnUiThread(new Runnable() {
@Override
public void run() {
context.toggleDrawer(params);
}
});
}

@ReactMethod
public void toggleNavigationBar(final ReadableMap params) {
final BaseReactActivity context = ContextProvider.getActivityContext();
Expand Down
Loading