Android開發之Navigationdrawer導航抽屜功能的實現

jopen 10年前發布 | 72K 次閱讀 Android Android開發 移動開發

     導航抽屜(navigationdrawer)是一個從屏幕左邊滑入的面板,用于顯示應用的主要導航項目。用戶可以通過在屏幕左邊緣滑入或者觸摸操作欄的 應用圖標打開導航抽屜。導航抽屜覆蓋在內容之上,但不覆蓋操作欄。當導航抽屜完全打開后,操作欄的標題需要更換為應用的名稱,而不是顯示當前視圖的名稱, 并且關閉所有和當前視圖相關的操作按鈕。操作欄的“更多操作”菜單按鈕不需要關閉,以保證用戶可以隨時訪問“設置”和“幫助”。下面我們就來實現導航抽屜 的功能。

    a1.png

 Layout布局文件代碼

    <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">  
        <!-- The main content view -->  
        <FrameLayout  
            android:id="@+id/content_frame"  
            android:layout_width="match_parent"  
            android:layout_height="match_parent"   


            />  
        <!-- The navigation drawer -->  
        <ListView android:id="@+id/left_drawer"  
            android:layout_width="100dp"  
            android:layout_height="match_parent"  
            android:layout_gravity="start"  
            android:choiceMode="singleChoice"  
            android:dividerHeight="1dp"  
           android:background="#ffffff"/>  
    </android.support.v4.widget.DrawerLayout>  
注意要點:

(1)主要視圖(上述FrameLayout)必須為DrawerLayout中的第一個孩子,因為XML意味著z順序和抽屜必須的內容。  

(2)主要內容視圖必須設置為匹配父視圖的寬度和高度,因為它代表整個UI導航抽屜時隱藏。  

(3)抽屜視圖(上述ListView)必須指定它的水平重力與android:layout_gravity屬性。支持從右到左的語言(RTL),指定值與“開始”而不是“左”(右邊的抽屜里出 現時,布局是RTL)。   

(4)抽屜視圖指定寬度的dp單位和父視圖的高度匹配。抽屜的寬度應不超過320 dp所以用戶總是可以看到部分的主要內容。

(5)DrawerLayout必須成為布局的根節點

MainActivity的代碼
package com.example.g07_navigationdrawer;  

import android.app.Activity;  
import android.app.Fragment;  
import android.app.FragmentManager;  
import android.os.Bundle;  

import android.support.v4.app.ActionBarDrawerToggle;  
import android.support.v4.widget.DrawerLayout;  
import android.view.View;  
import android.widget.AdapterView;  
import android.widget.ArrayAdapter;  
import android.widget.ListAdapter;  
import android.widget.ListView;  
import android.widget.Toast;  

public class MainActivity extends Activity {  
    private String[] mPlanetTitles; // listView的每一個item的名字  
    private DrawerLayout mDrawerLayout;  
    private ListView mDrawerList;  
    private ActionBarDrawerToggle mDrawerToggle; // 用來監聽DrawerLayout事件  

    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_main);  
        mPlanetTitles = getResources().getStringArray(R.array.planets_array);  
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);  
        mDrawerList = (ListView) findViewById(R.id.left_drawer);  
        // 為ListView添加適配器  
        mDrawerList.setAdapter((ListAdapter) new ArrayAdapter<String>(this,  
                android.R.layout.simple_list_item_1, mPlanetTitles));  
        // 監聽ListView的點擊事件  
        mDrawerList.setOnItemClickListener(new DrawerItemClickListener());  
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);  
        // 監聽DrawerLayout的監聽事件  
        mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,  
                R.drawable.ic_launcher, R.string.app_name, R.string.app_name) {  
            public void onDrawerClosed(View view) {  
                super.onDrawerClosed(view);  
                Toast.makeText(MainActivity.this, "抽屜關閉了", Toast.LENGTH_SHORT)  
                        .show();  
            }  
            public void onDrawerOpened(View drawerView) {  
                super.onDrawerOpened(drawerView);  
                Toast.makeText(MainActivity.this, "抽屜打開了", Toast.LENGTH_SHORT)  
                        .show();  
            }  
        };  
        mDrawerLayout.setDrawerListener(mDrawerToggle);  

    }  

    private class DrawerItemClickListener implements  
            ListView.OnItemClickListener {  
        @Override  
        public void onItemClick(AdapterView<?> parent, View view, int position,  
                long id) {  
            // 根據ListView的被選中的選項切換界面布局  
            Fragment fragment = new Fragment();  
            FragmentManager fragmentManager = getFragmentManager();  
            fragmentManager.beginTransaction()  
                    .replace(R.id.content_frame, fragment).commit();  
            mDrawerList.setItemChecked(position, true);  
            // 給操作欄設置標題  
            getActionBar().setTitle(mPlanetTitles[position]);  
            mDrawerLayout.closeDrawer(mDrawerList);  
        }  
    }  
}  
來自:http://blog.csdn.net/gerogelin/article/details/25409549
 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!