+ 
+
+
+ + Figure 1. Navigation and Action Drawers. +
+
+ 
+
+
+stub
\ No newline at end of file +Wear 2.0 adds interactive navigation and action drawers that users can pull +from the top or bottom edge of the window, respectively. The navigation drawer +appears at the top of the screen and lets users jump to different views within +the app, similar to the navigation drawer on a phone. The action drawer appears +at the bottom of the screen and provides context-specific actions for the user, +similar to the action bar on a phone. These drawers are accessible when the user +swipes from the top or bottom of the screen, and they peek when users scroll in +the opposite direction.
+
+ + Figure 1. Navigation and Action Drawers. +
+
+This lesson describes how to implement action and navigation drawers in your +app using the {@code WearableDrawerLayout} APIs. +
+ +WearableDrawerLayout object as the root view of your layout. Inside
+ the WearableDrawerLayout, add one view that contains the main content
+ for the screen (your primary layout when the drawer is hidden) and additional
+ child views that contain the contents of the drawer.
+For example, the following layout uses a WearableDrawerLayout with
+ three child views: a FrameLayout to contain the main content, a
+ navigation drawer, and an action drawer.
+<android.support.wearable.view.drawer.WearableDrawerLayout + android:id="@+id/drawer_layout" + xmlns:android="http://schemas.android.com/apk/res/android" + android:layout_width="match_parent" + android:layout_height="match_parent" + tools:deviceIds="wear"> + + <FrameLayout + android:layout_width="match_parent" + android:layout_height="match_parent" + android:id="@+id/content_frame"/> + + <android.support.wearable.view.drawer.WearableNavigationDrawer + android:id="@+id/top_navigation_drawer" + android:layout_width="match_parent" + android:layout_height="match_parent"/> + + <android.support.wearable.view.drawer.WearableActionDrawer + android:id="@+id/bottom_action_drawer" + android:layout_width="match_parent" + android:layout_height="match_parent"/> + +</android.support.wearable.view.drawer.WearableDrawerLayout> + ++
One of the first things you need to do in your activity is to initialize the +drawers list of items. You should implement {@code WearableNavigationDrawerAdapter} +to populate the navigation drawer contents. To populate the action drawer with +a list of actions, inflate an XML file into the Menu (via MenuInflater).
+ +The following code snippet shows how to initialize the contents of your drawers: +
+
+public class MainActivity extends WearableActivity implements
+WearableActionDrawer.OnMenuItemClickListener{
+ private WearableDrawerLayout mwearableDrawerLayout;
+ private WearableNavigationDrawer mWearableNavigationDrawer;
+ private WearableActionDrawer mWearableActionDrawer;
+
+ ...
+
+ @Override
+ public void onCreate(Bundle savedInstanceState) {
+ super.onCreate(savedInstanceState);
+ setContentView(R.layout.activity_main);
+
+ ......
+
+
+ // Main Wearable Drawer Layout that wraps all content
+ mWearableDrawerLayout = (WearableDrawerLayout) findViewById(R.id.drawer_layout);
+
+ // Top Navigation Drawer
+ mWearableNavigationDrawer = (WearableNavigationDrawer) findViewById(R.id.top_navigation_drawer);
+ mWearableNavigationDrawer.setAdapter(new YourImplementationNavigationAdapter(this));
+
+ // Peeks Navigation drawer on the top.
+ mWearableDrawerLayout.peekDrawer(Gravity.TOP);
+
+ // Bottom Action Drawer
+ mWearableActionDrawer = (WearableActionDrawer) findViewById(R.id.bottom_action_drawer);
+
+ // Populate Action Drawer Menu
+ Menu menu = mWearableActionDrawer.getMenu();
+ MenuInflater inflater = getMenuInflater();
+ inflater.inflate(R.menu.action_drawer_menu, menu);
+ mWearableActionDrawer.setOnMenuItemClickListener(this);
+
+ // Peeks action drawer on the bottom.
+ mWearableDrawerLayout.peekDrawer(Gravity.BOTTOM);
+ }
+}
+
+
+To use custom views in drawers, add WearableDrawerView to the
+WearableDrawerLayout. To set the contents of the drawer, call
+setDrawerContent(View)
+ instead of manually adding the view to the hierarchy. You must also specify the
+ drawer position with the android:layout_gravity attribute.
The following example specifies a top drawer:
++<android.support.wearable.view.drawer.WearableDrawerLayout> + <FrameLayout + android:id=”@+id/content” /> + + <WearableDrawerView + android:layout_width=”match_parent” + andndroid:layout_height=”match_parent” + android:layout_gravity=”top”> + <FrameLayout + android:id=”@+id/top_drawer_content” /> + </WearableDrawerView> +</android.support.wearable.view.drawer.WearableDrawerView> + ++ +
To listen for drawer events, call {@code setDrawerStateCallback()}on your
+{@code WearableDrawerLayout} and pass it an implementation of
+{@code WearableDrawerLayout.DrawerStateCallback}. This interface provides callbacks
+ for drawer events such as onDrawerOpened(),
+ onDrawerClosed(), and onDrawerStatechanged().
To set the drawers to temporarily appear, call peekDrawer() on
+your {@code WearableDrawerLayout} and pass it the {@code Gravity} of the drawer.
+ This feature is especially useful because it allows immediate access to the
+ alternate drawer views or actions associated with it.
{@code mWearableDrawerLayout.peekDrawer(Gravity.BOTTOM);}
+
+You can also call {@code setPeekContent()} on your drawer to display a custom + view when the drawer is peeking.
diff --git a/docs/html/wear/preview/images/action_drawer.gif b/docs/html/wear/preview/images/action_drawer.gif new file mode 100644 index 0000000000000..b8231372cf84f Binary files /dev/null and b/docs/html/wear/preview/images/action_drawer.gif differ diff --git a/docs/html/wear/preview/images/nav_drawer.gif b/docs/html/wear/preview/images/nav_drawer.gif new file mode 100644 index 0000000000000..1c3b1dc098f21 Binary files /dev/null and b/docs/html/wear/preview/images/nav_drawer.gif differ