背景:2013年google提出drawerlayout是開發者更方便的開發側滑菜
單,在沒有drawerlayout之前很多開發者都使用github開源組件
slidingmenu,個人覺得drawerlayout更加好用,在這爲大家提供可參考
的個人學習見解
1.初步掌握drawerlayout
2.actionbar和drawerlayout聯動
3.點擊圖標實現菜單的切換
1.drawerlayout是v4包裏面的組件,請查看你的v4包裏面是否存在drawerlayout。class,有的新建工程中並沒有,刪除重新導入有的就行了。
drawerlayout實現規範:
1.
刪除所有控件,讓drawerlayout成爲直接子佈局,然後drawerlayout裏面包含了兩個子佈局,這兩個子佈局裏面的屬性必須要有的屬性有:
內容佈局:
android:layout_width="match_parent"
android:layout_height="match_parent"
菜單佈局:
width最好不大於320dp
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/draw_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" >
</FrameLayout>
<ListView
android:id="@+id/left_drawer"
android:layout_width="240dp"
android:layout_gravity="start"
android:layout_height="match_parent"
android:background="#ffffcc"
android:divider="@null" >
</ListView>
</android.support.v4.widget.DrawerLayout>
讓listview適配上數據
R.layout.listview_item_layout爲一個佈局文件,這個文件裏面沒有佈局,只有一個textview
adapter = new ArrayAdapter<String>(getApplicationContext(), R.layout.listview_item_layout, menu_list);
mListView.setAdapter(adapter);
滑出菜單,給listview添加點擊事件,點擊的反應就是讓framlayout被fragment填充
mListView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View v, int position,long arg3) {
Toast.makeText(getApplicationContext(), "asdfasdf", 1000).show();
Fragment fragment = new ContentFragment();
Bundle bundle = new Bundle();
bundle.putString("text",menu_list.get(position) );
fragment.setArguments(bundle);
FragmentManager manager = getFragmentManager();
manager.beginTransaction().replace(R.id.content_frame, fragment).commit();
//點擊之後隱藏菜單
mDrawerLayout.closeDrawer(mListView);
}
});
2.
給drawerlayout設置監聽器
所要用到的類有ActionBarDrawerToggle看起來不像一個監聽器
我們把它當作監聽器來用,裏面有兩個回調方法要用到
onDrawerOpened()、onDrawerClosed();
在裏面實現顯示actionbar裏面的信息與否
示例:
mActionBarDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.drawable.ic_launcher, R.string.drawer_open, R.string.drawer_close){
@Override
public void onDrawerOpened(View drawerView) {
// TODO Auto-generated method stub
//改變actionbar的title
getActionBar().setTitle("請選擇");
//下面這個方法調用之後會去調用onPrepareOptionsMenu()
invalidateOptionsMenu();
super.onDrawerOpened(drawerView);
}
@Override
public void onDrawerClosed(View drawerView) {
// TODO Auto-generated method stub
getActionBar().setTitle(mtitle);
invalidateOptionsMenu();
super.onDrawerClosed(drawerView);
}
};
mDrawerLayout.setDrawerListener(mActionBarDrawerToggle);
//所以重寫onPrepareOptionsMenu
@Override
public boolean onPrepareOptionsMenu(Menu menu) {
//判斷是否打開菜單的方法
boolean check_open = mDrawerLayout.isDrawerOpen(mListView);
//獲取actionbar上面的元素設置可見性
menu.findItem(R.id.menu_settings).setVisible(!check_open);
return super.onPrepareOptionsMenu(menu);
}
3.
首先設置actiobar的兩條屬性
要用到的方法有onOptionsItemSelected,onPostCreate,syncState
第一個方法就不用多做介紹了,就是監聽圖標的點擊事件,第二個方法和第三個方法實現同步和圖標的偏移效果
getActionBar().setDisplayHomeAsUpEnabled(true);
getActionBar().setDisplayShowHomeEnabled(true);
給圖標添加點擊事件
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// TODO Auto-generated method stub
//判斷是否點擊 if(mActionBarDrawerToggle.onOptionsItemSelected(item)){
return true;
}
return super.onOptionsItemSelected(item);
}
實現同步
@Override
protected void onPostCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
mActionBarDrawerToggle.syncState();
super.onPostCreate(savedInstanceState);
}
下面是全部的源碼:
activity_main.xml
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/draw_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" >
</FrameLayout>
<ListView
android:id="@+id/left_drawer"
android:layout_width="240dp"
android:layout_gravity="start"
android:layout_height="match_parent"
android:background="#ffffcc"
android:divider="@null" >
</ListView>
</android.support.v4.widget.DrawerLayout>
listview_item_layout.xml
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/listview_item_layout_textview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="26dp"
android:paddingTop="14dp"
android:paddingRight="26dp"
android:paddingBottom="14dp"
android:textSize="26sp"
android:textColor="#000000"
/>
content_fragment_layout.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/content_fragment_layout_textview_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="11111"/>
</LinearLayout>
Strings.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">DrawerLayoutDemo</string>
<string name="hello_world">Hello world!</string>
<string name="menu_settings">Settings</string>
<string name="drawer_open">Drawer Open!</string>
<string name="drawer_close">Drawer Close!</string>
</resources>
mainactivity.java
package com.example.drawerlayoutdemo;
import java.util.ArrayList;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.Fragment;
import android.app.FragmentManager;
import android.content.res.Configuration;
import android.os.Bundle;
import android.support.v4.app.ActionBarDrawerToggle;
import android.support.v4.widget.DrawerLayout;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;
public class MainActivity extends Activity {
private DrawerLayout mDrawerLayout;
private ListView mListView;
private ArrayList<String> menu_list;
private ArrayAdapter<String> adapter;
private ActionBarDrawerToggle mActionBarDrawerToggle;
private String mtitle;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mtitle = (String)getTitle();
mDrawerLayout =(DrawerLayout) findViewById(R.id.draw_layout);
mListView = (ListView) findViewById(R.id.left_drawer);
menu_list = new ArrayList<String>();
adapter = new ArrayAdapter<String>(getApplicationContext(), R.layout.listview_item_layout, menu_list);
mListView.setAdapter(adapter);
for(int i=0;i<5;i++){
menu_list.add("列表項"+i);
}
mListView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View v, int position,
long arg3) {
Toast.makeText(getApplicationContext(), "asdfasdf", 1000).show();
Fragment fragment = new ContentFragment();
Bundle bundle = new Bundle();
bundle.putString("text",menu_list.get(position) );
fragment.setArguments(bundle);
FragmentManager manager = getFragmentManager();
manager.beginTransaction().replace(R.id.content_frame, fragment).commit();
mDrawerLayout.closeDrawer(mListView);
}
});
mActionBarDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.drawable.ic_launcher, R.string.drawer_open, R.string.drawer_close){
@Override
public void onDrawerOpened(View drawerView) {
// TODO Auto-generated method stub
getActionBar().setTitle("請選擇");
invalidateOptionsMenu();//call onPrepareOptionsMenu()
super.onDrawerOpened(drawerView);
}
@Override
public void onDrawerClosed(View drawerView) {
// TODO Auto-generated method stub
getActionBar().setTitle(mtitle);
invalidateOptionsMenu();
super.onDrawerClosed(drawerView);
}
};
mDrawerLayout.setDrawerListener(mActionBarDrawerToggle);
getActionBar().setDisplayHomeAsUpEnabled(true);
getActionBar().setDisplayShowHomeEnabled(true);
}
@Override
public boolean onPrepareOptionsMenu(Menu menu) {
boolean check_open = mDrawerLayout.isDrawerOpen(mListView);
menu.findItem(R.id.menu_settings).setVisible(!check_open);
return super.onPrepareOptionsMenu(menu);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// TODO Auto-generated method stub
getMenuInflater().inflate(R.menu.activity_main, menu);
return super.onCreateOptionsMenu(menu);
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// TODO Auto-generated method stub
if(mActionBarDrawerToggle.onOptionsItemSelected(item)){
return true;
}
return super.onOptionsItemSelected(item);
}
@Override
protected void onPostCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
mActionBarDrawerToggle.syncState();
super.onPostCreate(savedInstanceState);
}
}
content_fragment.java
package com.example.drawerlayoutdemo;
import android.annotation.SuppressLint;
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
public class ContentFragment extends Fragment {
private TextView textview;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// TODO Auto-generated method stub
View view = inflater.inflate(R.layout.content_fragment_layout, container,false);
textview = (TextView) view.findViewById(R.id.content_fragment_layout_textview_1);
String text = getArguments().getString("text");
textview.setText(text);
return view;
}
}