android 侧边布局,Android DrawerLayout带有侧滑功能的布局类（1）

DrawerLayout顾名思义就是一个管理布局的。使用方式可以与其它的布局类类似。

DrawerLayout带有滑动的功能。只要按照drawerLayout的规定布局方式写完布局，就能有侧滑的效果。

直接将DrawerLayout作为根布局，然后其内部

第一个View为内容区域

第二个View为左侧菜单

第三个View为右侧侧滑菜单

当前第三个是可选的。

使用的包如下：

import android.support.v4.widget.DrawerLayout;

使用这些包的时候有时有的会报错。这时候确保android.support.v4是不是最新的版本。

可以更新一下support包，文件存放在sdk/extres/support中。

然后可以通过eclipse>project right click>Android Tools>Add Support library…

或者可以直接把文件复制到Project中libs文件夹中。

xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/drawer_layout"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/content_frame"

android:layout_width="match_parent"

android:layout_height="match_parent" />

android:id="@+id/left_drawer"

android:layout_width="240dp"

android:layout_height="match_parent"

android:layout_gravity="start"

android:choiceMode="singleChoice"

android:divider="@android:color/transparent"

android:dividerHeight="0dp"

android:background="#111"/>

Drawer positioning and layout is controlled using the android:layout_gravity attribute on child views corresponding to which side of the view you want the drawer to emerge from: left or right.

(Or start/end on platform versions that support layout direction.)

也就是说

android:layout_gravity="start"相当于左侧的MENU向右滑动即显示菜单，LEFT/START(RIGHT/END)那么从布局文件中可知：

FrameLayout是内容区， ListView是左侧菜单。

我们需做一个Fragment来装载内容：

public class PageFragment extends Fragment {

public final static String ITEM_POSITION_NUMBER = "item_position_num";

public PageFragment(){}

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

View convertView = inflater.inflate(R.layout.page_fragment_layout, null);

TextView tv = (TextView) convertView.findViewById(R.id.textView);

int num = getArguments().getInt(ITEM_POSITION_NUMBER);

//从res/array中获取list数据

String[] dynastyList = getResources().getStringArray(R.array.list_item);

tv.setText(dynastyList[num]);

return convertView;

}

}

代码中可以看出当我们在左侧菜单中选择SelectItem时会把对应的值显示到内容区。

代码中的page_fragment_layout.xml仅是FrameLayout内加一个TextView所以就不贴代码了。

接下来我们需要把listView进行填充数据。

private ListView menuList;

private String[] mMenuTitles;

private String[] historyTitles;

private String[] musicTitles;

private String[] movieTitles;

private String[] listTitles;

// 历史栏

historyTitles = getResources().getStringArray(R.array.history);

// 音乐栏

musicTitles = getResources().getStringArray(R.array.music);

// 电影栏

movieTitles = getResources().getStringArray(R.array.movie);

// 标题数组

mMenuTitles = getResources().getStringArray(R.array.title);

// 每一項的標題

listTitles = getResources().getStringArray(R.array.list_item);

drawLayout = (DrawerLayout) findViewById(R.id.drawer_layout);

menuList = (ListView) findViewById(R.id.left_menu);

// 设置菜单阴影效果

// drawLayout.setDrawerShadow(R.drawable.drawer_shadow,

// GravityCompat.START);

List list = new ArrayList();

// 菜单加入历史标题和历史项

HeaderItem historyHeader = new HeaderItem(mMenuTitles[0]);

list.add(historyHeader);

for (int i = 0; i < historyTitles.length; i++) {

EventItem historyitem = new EventItem(historyTitles[i]);

list.add(historyitem);

}

// 菜单加入音乐标题和音乐项

HeaderItem musicHeader = new HeaderItem(mMenuTitles[1]);

list.add(musicHeader);

for (int i = 0; i < musicTitles.length; i++) {

EventItem musicItem = new EventItem(musicTitles[i]);

list.add(musicItem);

}

// 菜单加入电影标题和电影项

HeaderItem movieHeader = new HeaderItem(mMenuTitles[2]);

list.add(movieHeader);

for (int i = 0; i < movieTitles.length; i++) {

EventItem movieItem = new EventItem(movieTitles[i]);

list.add(movieItem);

}

MyListAdapter adapter = new MyListAdapter(this, list);

menuList.setAdapter(adapter);

这个数据填充有点麻烦。自定义ListAdapter然后进行适配。

数据在res/values/arrays.xml中

三国

楚汉

春秋

战国

爵士

古典

现代

民谣

悬疑

爱情

历史

恐怖

历史

音樂

电影

歷史

三国

楚汉

春秋

战国

音樂

爵士

古典

现代

民谣

電影

悬疑

爱情

历史

恐怖

然后就是listView的监听：

private void initListener() {

// 菜单单击事件监听器

menuList.setOnItemClickListener(new DrawerItemClickListener());

}

/* The click listner for ListView in the navigation drawer */

private class DrawerItemClickListener implements

ListView.OnItemClickListener {

@Override

public void onItemClick(AdapterView> parent, View view, int position,

long id) {

Log.i("Light", "position:" + position);

selectItem(position);

}

}

private void selectItem(int position) {

// update the main content by replacing fragments

PageFragment fragment = new PageFragment();

// 将当前选择的项传递到Fragment

Bundle args = new Bundle();

args.putInt(PageFragment.ITEM_POSITION_NUMBER, position);

fragment.setArguments(args);

FragmentTransaction ft = MainActivity.this.getSupportFragmentManager()

.beginTransaction();

ft.replace(R.id.content_frame, fragment).commit();

drawLayout.closeDrawer(menuList);

// update selected item and title, then close the drawer

menuList.setItemChecked(position, true);

// 注意这里改变的是ActionBar的标题

getActionBar().setTitle(listTitles[position]);

}

我们关心的是当某一个Item被点击时会发生什么即代码：

private void selectItem(int position) {

// update the main content by replacing fragments

PageFragment fragment = new PageFragment();

// 将当前选择的项传递到Fragment

Bundle args = new Bundle();

args.putInt(PageFragment.ITEM_POSITION_NUMBER, position);

fragment.setArguments(args);

FragmentTransaction ft = MainActivity.this.getSupportFragmentManager()

.beginTransaction();

ft.replace(R.id.content_frame, fragment).commit();

drawLayout.closeDrawer(menuList);

// update selected item and title, then close the drawer

menuList.setItemChecked(position, true);

// 注意这里改变的是ActionBar的标题

getActionBar().setTitle(listTitles[position]);

}

从代码中可以看出

1. 首先我们先通过new PageFragment();获取内容区。

2. 通过Bundle把数据打包起来然后注入fragment.setArguments(args);中这样fragment就能获取到此数据。

在fragment类中通过getArguments().getInt(ITEM_POSITION_NUMBER);可以获取传递的值。

3. 然后通过ft.replace(R.id.content_frame, fragment).commit();把内容替换成之前定义的PageFragment

4. 关闭菜单通过drawLayout.closeDrawer(menuList); 整个代码中我们仅用DrawLayout这一个函数

5. 同时把ActionBar的标题改为selectedItem对应的值。

*这时有人会问我们怎么没有ListView与DrawerLayout进行绑定的操作。我们在之前也说过DrawerLayout中的第二个开始即是菜单View，内部已经绑定好了。

就这些内容可以实现左右侧滑动菜单效果了。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。