android.support.v4.widget.DrawerLayout 侧滑样式
布局
<
RelativeLayout
xmlns:
android
=
"http://schemas.android.com/apk/res/android"
xmlns: tools = "http://schemas.android.com/tools"
android : id = "@+id/activity_main"
android :layout_width= "match_parent"
android :layout_height= "match_parent"
tools :context= "com.whq.administrator.designdemo.MainActivity">
< android.support.v7.widget.Toolbar //toolbar在drawerlayout布局外侧滑时不压住toolbar
android : id = "@+id/toolbar"
android :layout_width= "match_parent"
android :background= "?attr/colorPrimary"
android :layout_height= "?android:attr/actionBarSize" />
<!--?attr/ 这种样式代表允许你使用当前 theme 中任意的 attribute-->
< android.support.v4.widget.DrawerLayout //drawerlayout就是实现带有侧滑界面的效果的布局
android : id = "@+id/drawer"
android :layout_height= "match_parent"
android :layout_width= "match_parent"
android :layout_below= "@+id/toolbar">
<!-- Content -->
< RelativeLayout//不可更改
android :layout_width= "match_parent"
android :layout_height= "match_parent">
这个是主界面内容布局
< TextView
android :text= "qqqqqqqqqqqqqq"
android :background= "#00ff00"
android :layout_width= "match_parent"
android :layout_height= "match_parent" />
</ RelativeLayout>
<!-- Side Drawer -->
< LinearLayout//不可更改
android : id = "@+id/drawer_view"
android :layout_width= "100dp"//这个可以自定义
android :layout_height= "match_parent"
android:layout_gravity= "start"//这个必须加上不能忘
android :background= "#000000"
android :orientation= "vertical">
这个是侧边栏布局内容
</ LinearLayout>
</ android.support.v4.widget.DrawerLayout>
</ RelativeLayout>
xmlns: tools = "http://schemas.android.com/tools"
android : id = "@+id/activity_main"
android :layout_width= "match_parent"
android :layout_height= "match_parent"
tools :context= "com.whq.administrator.designdemo.MainActivity">
< android.support.v7.widget.Toolbar //toolbar在drawerlayout布局外侧滑时不压住toolbar
android : id = "@+id/toolbar"
android :layout_width= "match_parent"
android :background= "?attr/colorPrimary"
android :layout_height= "?android:attr/actionBarSize" />
<!--?attr/ 这种样式代表允许你使用当前 theme 中任意的 attribute-->
< android.support.v4.widget.DrawerLayout //drawerlayout就是实现带有侧滑界面的效果的布局
android : id = "@+id/drawer"
android :layout_height= "match_parent"
android :layout_width= "match_parent"
android :layout_below= "@+id/toolbar">
<!-- Content -->
< RelativeLayout//不可更改
android :layout_width= "match_parent"
android :layout_height= "match_parent">
这个是主界面内容布局
< TextView
android :text= "qqqqqqqqqqqqqq"
android :background= "#00ff00"
android :layout_width= "match_parent"
android :layout_height= "match_parent" />
</ RelativeLayout>
<!-- Side Drawer -->
< LinearLayout//不可更改
android : id = "@+id/drawer_view"
android :layout_width= "100dp"//这个可以自定义
android :layout_height= "match_parent"
android:layout_gravity= "start"//这个必须加上不能忘
android :background= "#000000"
android :orientation= "vertical">
这个是侧边栏布局内容
</ LinearLayout>
</ android.support.v4.widget.DrawerLayout>
</ RelativeLayout>
代码
private Toolbar
toolbar;
private DrawerLayout mDrawerLayout;
private DrawerLayout mDrawerLayout;
private ActionBarDrawerToggle mDrawerToggle;
toolbar = (Toolbar) findViewById(R.id.
toolbar);
toolbar.setTitle( " 我从草原来 ");
// toolbar.setSubtitle(" 未来为我盛开 ");
toolbar.setBackgroundColor(Color. parseColor( "#ff0000"));
setSupportActionBar( toolbar); // 此方法只有 AppCompatActivity 才有
// 这边要留意的是 setNavigationIcon 需要放在 setSupportActionBar 之后才会生效。
getSupportActionBar().setDisplayHomeAsUpEnabled( true);
mDrawerLayout = (DrawerLayout) findViewById(R.id. drawer);
// 實作 drawer toggle 並放入 toolbar
mDrawerToggle = new ActionBarDrawerToggle( this, mDrawerLayout, toolbar, R.string. drawer_open, R.string. drawer_close); //这两个String字符串在string.xml中自定义,没看见它显示出来
mDrawerToggle.syncState();
toolbar.setTitle( " 我从草原来 ");
// toolbar.setSubtitle(" 未来为我盛开 ");
toolbar.setBackgroundColor(Color. parseColor( "#ff0000"));
setSupportActionBar( toolbar); // 此方法只有 AppCompatActivity 才有
// 这边要留意的是 setNavigationIcon 需要放在 setSupportActionBar 之后才会生效。
getSupportActionBar().setDisplayHomeAsUpEnabled( true);
mDrawerLayout = (DrawerLayout) findViewById(R.id. drawer);
// 實作 drawer toggle 並放入 toolbar
mDrawerToggle = new ActionBarDrawerToggle( this, mDrawerLayout, toolbar, R.string. drawer_open, R.string. drawer_close); //这两个String字符串在string.xml中自定义,没看见它显示出来
mDrawerToggle.syncState();
mDrawerLayout.setDrawerListener(mDrawerToggle);
将 DrawerLayout 作为 布局的 根布局,并将 toolbar 移到 content 的 layout 中,这样就可以达到这样的效果了。
需要注意的是地方在 Side(左侧菜单linearlayout布局) 的 layout 要设定 clickable 的属性设定为 true,否则会在侧边栏打开的状况下,还能按到位于界面下方的 up button。
- <android.support.v4.widget.DrawerLayout
- xmlns:android="http://schemas.android.com/apk/res/android"
- xmlns:tools="http://schemas.android.com/tools"
- android:id="@+id/drawer"
- android:layout_height="match_parent"
- android:layout_width="match_parent"
- tools:context=".MainActivity">
- <!-- Content -->
- <RelativeLayout
- android:layout_width="match_parent"
- android:layout_height="match_parent">
- <android.support.v7.widget.Toolbar
- android:id="@+id/toolbar"
- ... />
- ...
- </RelativeLayout>
- <!-- Side Drawer -->
- <LinearLayout
- android:id="@+id/drawer_view"
- android:layout_width="@dimen/navdrawer_width"
- android:layout_height="match_parent"
- android:layout_gravity="start"
- android:clickable="true"
- android:background="#88FFFFFF"
- android:orientation="vertical">
- </LinearLayout>
- </android.support.v4.widget.DrawerLayout>
个人感觉也可以实现左右边都有侧滑效果 两个linearlayout 一个layout_gravity为start另一个为end
3.遮住statusBar的效果实现
在 作为根布局的 drawer layout 跟 side drawer 的 layout 各别加上 android:fitsSystemWindows="true" 这个属性
另外一个要改的地方是在styles.xml
<
item
name=
"android:statusBarColor">@android:color/transparent</
item>