Android 侧边栏(使用Support Library 4提供的扩展组件)

本文转自:http://www.apkbus.com/android-117148-1-1.html

写在前面的话:
接触Android已经有一段时间了,自己积累的东西也算蛮多的。总结以往的经验,凡是关键性的问题,一般都是要查阅API来解决的。所以,笔者建议同学们认真阅读API和Guider,Android的开发API文档是最容易阅读的(至少笔者是这么认为的,也接触一些windows phone的开发基础)。
今天,笔者为大家介绍Android侧边栏的使用。我也接触了一些侧边栏的第三方牛人写的插件,确实也是不错的。笔者介绍的是在Android扩展的包中的组件DrawerLayout,是一个很好的侧边栏,支持手势打开。好了,下面简单介绍使用组件的方法。
包括的内容有:
1、手势打开侧边栏(手要从接近左边向右滑,这点不是很好用)
2、使用fragment的按钮来打开侧边栏
3、使用menu键来打开侧边栏。

首先,来看看布局文件:

<android.support.v4.widget.DrawerLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/main_layout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <!-- 页面内容 -->

    <FrameLayout
        android:id="@+id/main_content"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </FrameLayout>

    <!-- 侧边栏的选项 -->

    <ListView
        android:id="@+id/left_drawer"
        android:layout_width="150dp"
        android:layout_height="fill_parent"
        android:layout_gravity="start"
        android:background="@android:color/background_dark" />

</android.support.v4.widget.DrawerLayout>

再来看看Activiy中的内容:

public class MainActivity extends FragmentActivity {

    public DrawerLayout drawerLayout;// 侧边栏布局
    public ListView leftList;// 侧边栏内的选项
    public ArrayAdapter<String> arrayAdapter;
    private String[] items;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initViews();
    }

    // 初始化控件
    private void initViews() {
        drawerLayout = (DrawerLayout) findViewById(R.id.main_layout);
        items = getResources().getStringArray(R.array.left_array);
        leftList = (ListView) findViewById(R.id.left_drawer);
        arrayAdapter = new ArrayAdapter<String>(this, R.layout.list_item, items);
        leftList.setAdapter(arrayAdapter);
        leftList.setOnItemClickListener(itemListener);
        initFragments();

    }

    // 添加碎片
    private void initFragments() {
        FragmentManager manager = getSupportFragmentManager();
        FragmentTransaction transaction = manager.beginTransaction();
        DrawerFragment fragment = new DrawerFragment();
        // 设置在fragment中按钮来控制侧边栏的打开
        fragment.setDrawerLayout(drawerLayout, leftList);
        transaction.add(R.id.main_content, fragment);
        transaction.commit();
    }

    // 选项点击事件
    OnItemClickListener itemListener = new OnItemClickListener() {

        @Override
        public void onItemClick(AdapterView<?> arg0, View view, int position, long arg3) {
            // 设置Activity的标题,这里只是用来做一个测试,你可以在这里用来处理单击侧边栏的选项事件
            setTitle(items[position]);
            // 关闭侧边栏
            drawerLayout.closeDrawer(leftList);
            Log.i("onItemSelected",
                    "open?:" + drawerLayout.isDrawerOpen(leftList));
        }

    };

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        // TODO Auto-generated method stub
        // 使用menu键打开或关闭侧边栏
        if (keyCode == KeyEvent.KEYCODE_MENU) {

            if (drawerLayout.isDrawerOpen(leftList)) {
                drawerLayout.closeDrawer(leftList);
            } else {
                drawerLayout.openDrawer(leftList);
            }
        }
        return super.onKeyDown(keyCode, event);
    }

}

还有内容填充的片段代码:

public class DrawerFragment extends Fragment implements OnClickListener {

    public DrawerLayout layout;
    public View view;

    public DrawerFragment() {
        super();
        // TODO Auto-generated constructor stub
    }

    public void setDrawerLayout(DrawerLayout layout, View view) {
        this.layout = layout;
        this.view = view;
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        View rootView = inflater.inflate(R.layout.fragment_layout, container,
                false);
        Button openBtn = (Button) rootView.findViewById(R.id.open);
        openBtn.setOnClickListener(this);
        return rootView;
    }

    @Override
    public void onClick(View v) {
        // TODO Auto-generated method stub
        if (v.getId() == R.id.open) {
            // 打开侧边栏
            if (!layout.isDrawerOpen(view)) {
                layout.openDrawer(view);
            }
        }
    }
}

具体的使用效果图如下:

 

源码:http://pan.baidu.com/s/1mrdCx

posted @ 2013-11-15 18:08  似水流云  阅读(1837)  评论(0编辑  收藏  举报