Android DrawerLayout帶有側(cè)滑功能的布局類(1)
DrawerLayout顧名思義就是一個管理布局的。使用方式可以與其它的布局類類似。
DrawerLayout帶有滑動的功能。只要按照drawerLayout的規(guī)定布局方式寫完布局,就能有側(cè)滑的效果。
直接將DrawerLayout作為根布局,然后其內(nèi)部
第一個View為內(nèi)容區(qū)域
第二個View為左側(cè)菜單
第三個View為右側(cè)側(cè)滑菜單
當前第三個是可選的。
使用的包如下:
import android.support.v4.widget.DrawerLayout;
使用這些包的時候有時有的會報錯。這時候確保android.support.v4是不是最新的版本。
可以更新一下support包,文件存放在sdk/extres/support中。
然后可以通過eclipse>project right click>Android Tools>Add Support library…
或者可以直接把文件復制到Project中l(wèi)ibs文件夾中。
<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 android:id="@+id/content_frame" android:layout_width="match_parent" android:layout_height="match_parent" /> <ListView 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"/> </android.support.v4.widget.DrawerLayout>
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" 相當于左側(cè)的MENU向右滑動即顯示菜單,LEFT/START(RIGHT/END)
那么從布局文件中可知:
FrameLayout是內(nèi)容區(qū), ListView是左側(cè)菜單。
我們需做一個Fragment來裝載內(nèi)容:
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數(shù)據(jù) String[] dynastyList = getResources().getStringArray(R.array.list_item); tv.setText(dynastyList[num]); return convertView; } }
代碼中可以看出當我們在左側(cè)菜單中選擇SelectItem時會把對應的值顯示到內(nèi)容區(qū)。
代碼中的page_fragment_layout.xml僅是FrameLayout內(nèi)加一個TextView所以就不貼代碼了。
接下來我們需要把listView進行填充數(shù)據(jù)。
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); // 標題數(shù)組 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<Item> list = new ArrayList<Item>(); // 菜單加入歷史標題和歷史項 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);
這個數(shù)據(jù)填充有點麻煩。自定義ListAdapter然后進行適配。
數(shù)據(jù)在res/values/arrays.xml中
<?xml version="1.0" encoding="utf-8"?> <resources> <string-array name="history"> <item >三國</item> <item >楚漢</item> <item >春秋</item> <item >戰(zhàn)國</item> </string-array> <string-array name="music"> <item >爵士</item> <item >古典</item> <item >現(xiàn)代</item> <item >民謠</item> </string-array> <string-array name="movie"> <item >懸疑</item> <item >愛情</item> <item >歷史</item> <item >恐怖</item> </string-array> <string-array name="title"> <item >歷史</item> <item >音樂</item> <item >電影</item> </string-array> <string-array name="list_item"> <item >歷史</item> <item >三國</item> <item >楚漢</item> <item >春秋</item> <item >戰(zhàn)國</item> <item >音樂</item> <item >爵士</item> <item >古典</item> <item >現(xiàn)代</item> <item >民謠</item> <item >電影</item> <item >懸疑</item> <item >愛情</item> <item >歷史</item> <item >恐怖</item> </string-array> </resources>
然后就是listView的監(jiān)聽:
private void initListener() { // 菜單單擊事件監(jiān)聽器 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被點擊時會發(fā)生什么即代碼:
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();獲取內(nèi)容區(qū)。
2. 通過Bundle把數(shù)據(jù)打包起來然后注入fragment.setArguments(args);中這樣fragment就能獲取到此數(shù)據(jù)。
在fragment類中通過getArguments().getInt(ITEM_POSITION_NUMBER);可以獲取傳遞的值。
3. 然后通過ft.replace(R.id.content_frame, fragment).commit();把內(nèi)容替換成之前定義的PageFragment
4. 關閉菜單通過drawLayout.closeDrawer(menuList); 整個代碼中我們僅用DrawLayout這一個函數(shù)
5. 同時把ActionBar的標題改為selectedItem對應的值。
*這時有人會問我們怎么沒有ListView與DrawerLayout進行綁定的操作。我們在之前也說過DrawerLayout中的第二個開始即是菜單View,內(nèi)部已經(jīng)綁定好了。
就這些內(nèi)容可以實現(xiàn)左右側(cè)滑動菜單效果了。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
- Android使用DrawerLayout實現(xiàn)仿QQ雙向側(cè)滑菜單
- Android原生側(cè)滑控件DrawerLayout使用方法詳解
- Android官方的側(cè)滑控件DrawerLayout的示例代碼
- Android中DrawerLayout實現(xiàn)側(cè)滑菜單效果
- Android側(cè)滑菜單控件DrawerLayout使用詳解
- Android之側(cè)滑菜單DrawerLayout的使用介紹
- Android組件DrawerLayout仿網(wǎng)易新聞v4.4側(cè)滑菜單
- android側(cè)滑菜單控件DrawerLayout使用方法詳解
- Android使用DrawerLayout實現(xiàn)側(cè)滑菜單效果
- Android布局控件DrawerLayout實現(xiàn)完美側(cè)滑效果
相關文章
安卓監(jiān)聽屏幕的橫豎翻轉(zhuǎn)實現(xiàn)方法
這篇文章主要介紹了安卓監(jiān)聽屏幕的橫豎翻轉(zhuǎn)實現(xiàn)方法,有需要的朋友可以參考一下2013-12-12Android ConstraintLayout約束布局使用實例介紹
ConstraintLayout是Google在Google I/O 2016大會上發(fā)布的一種新的布局容器(ViewGroup),它支持以靈活的方式來放置子控件和調(diào)整子控件的大小,下面這篇文章主要給大家介紹了關于Android中ConstraintLayout約束布局詳細解析的相關資料,需要的朋友可以參考下2022-10-10Android ScrollView實現(xiàn)下拉彈回動畫效果
這篇文章主要為大家詳細介紹了Android ScrollView實現(xiàn)下拉彈回動畫效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-08-08Android中自定義view實現(xiàn)側(cè)滑效果
這篇文章主要介紹了Android中自定義view實現(xiàn)側(cè)滑效果的相關資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-11-11