Toolbar+DrawerLayout关联使用

1.导入Toolbar依赖

implementation 'com.android.support:appcompat-v7:21.0.2'

2.Values-styles.xml文件中取消头布局
在这里插入图片描述3.Values-strings.xml文件中取消头布局

<resources>
    <string name="app_name">Toolbar_DrawerLayout_Demo</string>
    <string name="open">open</string>
    <string name="close">close</string>
</resources>

4.写一个tool.xml布局

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:minHeight="?attr/actionBarSize">

</android.support.v7.widget.Toolbar>

5.写一个drawer.xml布局

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawerLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <!--主布局,ToolBar下面的布局-->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="首页"
                android:textSize="30dp"
                android:textColor="@android:color/darker_gray"
                android:layout_centerInParent="true"/>

    </RelativeLayout>
    <!--侧滑菜单,左边隐藏的布局-->
    <LinearLayout
        android:layout_width="400dp"
        android:layout_height="match_parent"
        android:background="#F5F5F5"
        android:orientation="vertical"
        android:layout_gravity="start">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="侧边栏"
                android:textSize="20sp"/>

    </LinearLayout>
</android.support.v4.widget.DrawerLayout>

6.action_main布局中引用

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">
        <!--Toolbar-->
        <include layout="@layout/tool" />
        <!--DrawerLayout-->
        <include layout="@layout/drawer" />
</LinearLayout>

7.代码

public class MainActivity extends AppCompatActivity {
    private Toolbar mToolbar;
    private DrawerLayout mDrawerLayout;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // 初始化控件
        initView();
        // 初始化数据
        initData();
    }

    private void initDrawerToggle() {
        // 参数:开启抽屉的activity、DrawerLayout的对象、toolbar按钮打开关闭的对象、描述open drawer、描述close drawer
        ActionBarDrawerToggle mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mToolbar, R.string.open, R.string.close);
        // 添加抽屉按钮,通过点击按钮实现打开和关闭功能; 如果不想要抽屉按钮,只允许在侧边边界拉出侧边栏,可以不写此行代码
        mDrawerToggle.syncState();
        // 设置按钮的动画效果; 如果不想要打开关闭抽屉时的箭头动画效果,可以不写此行代码
        mDrawerLayout.setDrawerListener(mDrawerToggle);
    }
    private void initData() {
        // 设置Toolbar标题,需在setSupportActionBar之前,不然会失效
        mToolbar.setTitle("首页");
        mToolbar.setTitleTextColor(Color.parseColor("#ffffff"));
        // 设置toolbar支持actionbar
        setSupportActionBar(mToolbar);
        // 实现按钮开关的显示及打开关闭功能并同步动画
        initDrawerToggle();
    }
    private void initView() {
        mToolbar = (Toolbar) findViewById(R.id.toolbar);
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
    }
}
发布了37 篇原创文章 · 获赞 15 · 访问量 5623
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览