如何在android中创build自定义导航抽屉
您好我正在尝试创build一个类似于Gmail应用程序导航抽屉的导航抽屉。 我遵循开发者网站，但只是指定了基本的实现。 但是我需要根据我的规格来定制导航。
- 我需要添加一个标题来对抽屉中的列表项进行分类
- 我需要一个单选button来select我的一些选项
我该怎么做？
教程Android自定义导航抽屉包含一个基本的和一个自定义的项目。 后者显示如何设置一个导航抽屉如截图所示：
这些项目的源代码可以下载。
也是导航抽屉 – Live-O项目…
该项目的源代码在GitHub上可用。
MaterialDrawer库旨在为应用程序提供最简单的导航抽屉实现。 它提供了很多开箱即用的定制function，还包括一个易于使用的标题，可以用作AccountSwitcher。
请注意， Android Studio同时有一个模板项目来创build一个导航抽屉活动 ，如截图所示。
此存储库会跟踪对模板所做的更改。
对我来说更简单的解决scheme是：
注意事项：
- 此解决scheme需要由Android Studio提供的自动生成的导航抽屉活动。
-
DrawerItem，CustomDrawerAdapter和layoutcustom_drawer_item.xml是从本教程中获取的 。
1.创build这个类来包装自定义的抽屉项目：
public class DrawerItem { String ItemName; int imgResID; public DrawerItem(String itemName, int imgResID) { super(); ItemName = itemName; this.imgResID = imgResID; } public String getItemName() { return ItemName; } public void setItemName(String itemName) { ItemName = itemName; } public int getImgResID() { return imgResID; } public void setImgResID(int imgResID) { this.imgResID = imgResID; } }
2.为抽屉项目创build自定义布局（custom_drawer_item.xml）：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:id="@+id/itemLayout" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:orientation="vertical" android:layout_marginTop="0dp" android:background="?android:attr/activatedBackgroundIndicator"> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:minHeight="55dp"> <ImageView android:id="@+id/drawer_icon" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/drawer_itemName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceLarge"/> </LinearLayout> <View android:layout_width="match_parent" android:layout_height="1dp" android:layout_marginBottom="1dp" android:layout_marginTop="1dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="#DADADC"> </View> </LinearLayout> </RelativeLayout>
3.创build您的自定义适配器：
import java.util.List; import android.app.Activity; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ArrayAdapter; import android.widget.ImageView; import android.widget.TextView; public class CustomDrawerAdapter extends ArrayAdapter<DrawerItem> { Context context; List<DrawerItem> drawerItemList; int layoutResID; public CustomDrawerAdapter(Context context, int layoutResourceID, List<DrawerItem> listItems) { super(context, layoutResourceID, listItems); this.context = context; this.drawerItemList = listItems; this.layoutResID = layoutResourceID; } @Override public View getView(int position, View convertView, ViewGroup parent) { // TODO Auto-generated method stub DrawerItemHolder drawerHolder; View view = convertView; if (view == null) { LayoutInflater inflater = ((Activity) context).getLayoutInflater(); drawerHolder = new DrawerItemHolder(); view = inflater.inflate(layoutResID, parent, false); drawerHolder.ItemName = (TextView)view.findViewById(R.id.drawer_itemName); drawerHolder.icon = (ImageView) view.findViewById(R.id.drawer_icon); view.setTag(drawerHolder); } else { drawerHolder = (DrawerItemHolder) view.getTag(); } DrawerItem dItem = (DrawerItem) this.drawerItemList.get(position); drawerHolder.icon.setImageDrawable(view.getResources().getDrawable( dItem.getImgResID())); drawerHolder.ItemName.setText(dItem.getItemName()); return view; } private static class DrawerItemHolder { TextView ItemName; ImageView icon; } }
4.在自动生成的NavigationDrawerFragment类的onCreateView方法中，replace为此自动生成的适配器：
ArrayList<DrawerItem> dataList = new ArrayList<DrawerItem>(); dataList.add(new DrawerItem(getString(R.string.title_section1), R.drawable.ic_action_1)); dataList.add(new DrawerItem(getString(R.string.title_section2), R.drawable.ic_action_2)); dataList.add(new DrawerItem(getString(R.string.title_section3), R.drawable.ic_action_3)); mDrawerListView.setAdapter(new CustomDrawerAdapter( getActivity(), R.layout.custom_drawer_item, dataList));
切记为自己的资源replaceR.string.title_sectionN和R.drawable.ic_action_N 。
我使用下面的布局，并能够实现导航视图中的自定义布局。
<android.support.design.widget.NavigationView android:id="@+id/navi_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start|top" android:background="@color/navigation_view_bg_color" app:theme="@style/NavDrawerTextStyle"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <include layout="@layout/drawer_header" /> <include layout="@layout/navigation_drawer_menu" /> </LinearLayout> </android.support.design.widget.NavigationView>
一旦你知道如何实现，你可以轻松地自定义android导航抽屉。 这里是一个很好的教程 ，你可以设置它。
这将是你的mainXML的结构：
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent"> <!-- Framelayout to display Fragments --> <FrameLayout android:id="@+id/frame_container" android:layout_width="match_parent" android:layout_height="match_parent" /> <!-- Listview to display slider menu --> <ListView android:id="@+id/list_slidermenu" android:layout_width="240dp" android:layout_height="match_parent" android:layout_gravity="right" android:choiceMode="singleChoice" android:divider="@color/list_divider" android:dividerHeight="1dp" android:listSelector="@drawable/list_selector" android:background="@color/list_background"/> </android.support.v4.widget.DrawerLayout>
您可以通过添加标题来自定义此列表视图。 和单选button。
我需要添加一个标题来对抽屉中的列表项进行分类
自定义listView或使用listView
我需要一个单选button来select我的一些选项
你可以做到这一点，而无需修改NavigationDrawer的当前实现，你只需要为你的listView创build一个自定义的适配器。 您可以添加一个父布局作为Drawer那么你可以做任何复杂的布局在这个正常的。
使用Activity的Android导航抽屉我只是遵循这个例子： http : //antonioleiva.com/navigation-view/
你只需要几个定制：
public class MainActivity extends AppCompatActivity { public static final String AVATAR_URL = "http://lorempixel.com/200/200/people/1/"; private DrawerLayout drawerLayout; private View content; private Toolbar toolbar; private NavigationView navigationView; private ActionBarDrawerToggle drawerToggle; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_dashboard); toolbar = (Toolbar) findViewById(R.id.toolbar); drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout); initToolbar(); setupDrawerLayout(); content = findViewById(R.id.content); drawerToggle = setupDrawerToggle(); final ImageView avatar = (ImageView) navigationView.getHeaderView(0).findViewById(R.id.avatar); Picasso.with(this).load(AVATAR_URL).transform(new CircleTransform()).into(avatar); } private void initToolbar() { final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); final ActionBar actionBar = getSupportActionBar(); if (actionBar != null) { actionBar.setHomeAsUpIndicator(R.drawable.ic_menu_black_24dp); actionBar.setDisplayHomeAsUpEnabled(true); } } private ActionBarDrawerToggle setupDrawerToggle() { return new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close); } @Override protected void onPostCreate(Bundle savedInstanceState) { super.onPostCreate(savedInstanceState); // Sync the toggle state after onRestoreInstanceState has occurred. drawerToggle.syncState(); } @Override public void onConfigurationChanged(Configuration newConfig) { super.onConfigurationChanged(newConfig); // Pass any configuration change to the drawer toggles drawerToggle.onConfigurationChanged(newConfig); } private void setupDrawerLayout() { drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout); navigationView = (NavigationView) findViewById(R.id.navigation_view); navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(MenuItem menuItem) { int id = menuItem.getItemId(); switch (id) { case R.id.drawer_home: Intent i = new Intent(getApplicationContext(), MainActivity.class); startActivity(i); finish(); break; case R.id.drawer_favorite: Intent j = new Intent(getApplicationContext(), SecondActivity.class); startActivity(j); finish(); break; } return true; } });
}这是xml布局
<android.support.v4.widget.DrawerLayout android:id="@+id/drawer_layout" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:context=".MainActivity"> <FrameLayout android:id="@+id/content" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.AppBarLayout android:id="@+id/appBarLayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:layout_scrollFlags="scroll|enterAlways|snap" /> </android.support.design.widget.AppBarLayout> </FrameLayout> <android.support.design.widget.NavigationView android:id="@+id/navigation_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" app:headerLayout="@layout/drawer_header" app:menu="@menu/drawer"/>
在菜单中添加drawer.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"> <group android:checkableBehavior="single"> <item android:id="@+id/drawer_home" android:checked="true" android:icon="@drawable/ic_home_black_24dp" android:title="@string/home"/> <item android:id="@+id/drawer_favourite" android:icon="@drawable/ic_favorite_black_24dp" android:title="@string/favourite"/> ... <item android:id="@+id/drawer_settings" android:icon="@drawable/ic_settings_black_24dp" android:title="@string/settings"/> </group>
要打开和closures抽屉，请在string.xml中添加此值
<string name="drawer_open">Open</string> <string name="drawer_close">Close</string>
drawer.xml
enter code here
<ImageView android:id="@+id/avatar" android:layout_width="64dp" android:layout_height="64dp" android:layout_margin="@dimen/spacing_large" android:elevation="4dp" tools:src="@drawable/ic_launcher"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@+id/email" android:layout_marginLeft="@dimen/spacing_large" android:layout_marginStart="@dimen/spacing_large" android:text="Username" android:textAppearance="@style/TextAppearance.AppCompat.Body2"/> <TextView android:id="@+id/email" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_marginLeft="@dimen/spacing_large" android:layout_marginStart="@dimen/spacing_large" android:layout_marginBottom="@dimen/spacing_large" android:text="username@mymail.com" android:textAppearance="@style/TextAppearance.AppCompat.Body1"/>
如果你使用的是Android Studio它提供了一个非常简单的工具来创build一个导航抽屉的活动。
右键单击你的包，去New | Activity | Navigation Drawer Activity New | Activity | Navigation Drawer Activity
你可以命名这个BaseActivity所以你想要有一个导航抽屉的任何活动只会扩展它（假设活动还没有扩展另一个类）。 要扩大活动，看看这个 。
如果你运行你的应用程序，这是你得到的：
从这里开始，您需要自定义抽屉上的项目并将内容添加到main content view中，请遵循官方文档或您select的任何内容。
在android中简单的导航抽屉的例子 。
我希望这个博客也能帮助别人。
