Android左侧菜单栏之DrawerLayout+Fragment
关于DrawerLayout，官方网站给出了相当好的案例
不过对于版本的限定，要求比较高
不过去掉ActionBarDrawerToggle，更换android.app.Fragment
就可以兼容到8了
老规矩，先看效果图，不然浪费大家的时间就是罪过了
看目录结构：
fragment中的内容都一样，如果在实际开发中，下面的实现有损性能，各位可以自己优化下
先看布局文件activity_main.xml:
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/body_background" >
<RelativeLayout
android:id="@+id/header"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#293236"
android:gravity="center_vertical" >
<Button
android:id="@+id/left"
style="@style/ButtonHeadStyle"
android:text="Menu" />
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:gravity="center"
android:textColor="#FFF"
android:textSize="18sp" />
</RelativeLayout>
<android.support.v4.widget.DrawerLayout
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/header" >
<FrameLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ListView
android:id="@+id/drawer_list"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="#111"
android:choiceMode="singleChoice"
android:divider="@android:color/transparent"
android:dividerHeight="0dp" />
</android.support.v4.widget.DrawerLayout>
</RelativeLayout>
drawer_list_item.xml，此处用的是官方Demo，不过修改了一些配置：
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/activatedBackgroundIndicator"
android:gravity="center_vertical"
android:minHeight="?attr/listPreferredItemHeightSmall"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textAppearance="?attr/textAppearanceListItemSmall"
android:textColor="#fff" />
项目目录截图少了点文件，抱歉，在values文件中创建attrs.xml：
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="AppTheme">
<!-- Drawable used as a background for activated items. -->
<attr name="activatedBackgroundIndicator" format="reference" />
<!-- Attributes below are needed to support the navigation drawer on Android 3.x. -->
<!-- A smaller, sleeker list item height. -->
<attr name="listPreferredItemHeightSmall" format="dimension" />
<!-- The preferred TextAppearance for the primary text of small list items. -->
<attr name="textAppearanceListItemSmall" format="reference" />
</declare-styleable>
</resources>
在values-v11目录中的style.xml文件中添加如下信息：
<resources>
<!--
Base application theme for API 11+. This theme completely replaces
AppBaseTheme from res/values/styles.xml on API 11+ devices.
-->
<style name="AppBaseTheme" parent="android:Theme.Holo.Light">
<!-- API 11 theme customizations can go here. -->
<item name="textAppearanceListItemSmall">@style/DrawerMenu</item>
<item name="activatedBackgroundIndicator">@android:color/transparent</item>
<item name="listPreferredItemHeightSmall">48dp</item>
</style>
<style name="DrawerMenu">
<item name="android:textSize">16sp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">@android:color/black</item>
</style>
</resources>
在values-v14目录中的style.xml中添加如下信息：
<resources>
<!--
Base application theme for API 14+. This theme completely replaces
AppBaseTheme from BOTH res/values/styles.xml and
res/values-v11/styles.xml on API 14+ devices.
-->
<style name="AppBaseTheme" parent="android:Theme.Holo.Light.DarkActionBar">
<!-- API 14 theme customizations can go here. -->
<item name="textAppearanceListItemSmall">?android:attr/textAppearanceListItemSmall</item>
<item name="activatedBackgroundIndicator">?android:attr/activatedBackgroundIndicator</item>
<item name="listPreferredItemHeightSmall">?android:attr/listPreferredItemHeightSmall</item>
</style>
</resources>
fragment_home.xml文件：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="@+id/textview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</LinearLayout>
MainActivity.java：
/**
* DrawerLayout右侧菜单栏
* 兼容到8
* @author Francis-ChinaFeng
* @version 1.0 2014-02-14
*/
public class MainActivity extends FragmentActivity {
private Button mDrawerButton;
private TextView title;
private DrawerLayout mDrawerLayout;
private ListView mDrawerList;
private String[] menus;
private List<Fragment> fragments;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
init();
setAdapter();
setListener();
if (savedInstanceState == null) {
selectItem(0);
}
}
private void init() {
mDrawerButton = (Button) findViewById(R.id.left);
title = (TextView) findViewById(R.id.title);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
mDrawerList = (ListView) findViewById(R.id.drawer_list);
menus = new String[] {
"Home", "Mercury", "Venus", "Mars", "About", "Setting"
};
fragments = new ArrayList<Fragment>();
fragments.add(HomeFragment.newInstance("Home"));
fragments.add(MercuryFragment.newInstance("Mercury"));
fragments.add(VenusFragment.newInstance("Venus"));
fragments.add(MarsFragment.newInstance("Mars"));
fragments.add(AboutFragment.newInstance("About"));
fragments.add(SettingFragment.newInstance("Setting"));
}
private void setAdapter() {
mDrawerList.setAdapter(new ArrayAdapter<String>(this, R.layout.drawer_list_item, menus));
}
private void setListener() {
mDrawerButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (mDrawerLayout.isDrawerOpen(mDrawerList)) {
mDrawerLayout.closeDrawer(mDrawerList);
} else {
mDrawerLayout.openDrawer(mDrawerList);
}
}
});
mDrawerList.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> adapterView, View v, int position,
long id) {
selectItem(position);
}
});
}
private void selectItem(int position) {
Fragment fragment = fragments.get(position);
FragmentManager manager = getSupportFragmentManager();
manager.beginTransaction().replace(R.id.content_frame, fragment).commit();
title.setText(menus[position]);
mDrawerList.setItemChecked(position, true);
mDrawerLayout.closeDrawer(mDrawerList);
}
}
HomeFragment.java，几个Fragment文件的内容都一样，实际开发在做处理：
/**
*
* @author Francis-ChinaFeng
* @version 1.0 2014-2-14
*/
public class HomeFragment extends Fragment {
public static final String TAG = "content";
private View view;
private TextView textView;
private String content;
public static HomeFragment newInstance(String content) {
HomeFragment fragment = new HomeFragment();
Bundle args = new Bundle();
args.putString(TAG, content);
fragment.setArguments(args);
return fragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Bundle bundle = getArguments();
content = bundle != null ? bundle.getString(TAG) : "";
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
view = inflater.inflate(R.layout.fragment_home, container, false);
init();
return view;
}
private void init() {
textView = (TextView) view.findViewById(R.id.textview);
textView.setText(content);
}
}
至此，左侧菜单效果就搞定了，效果还不赖。