Android5.0特性 - DrawerLayout的俩种使用方式

123 阅读1分钟

在我的印象中,因为Android 5.0 的出现,让其在UI方面进一步的赶上了IOS,所以我把Design库,V4,V7包下的控件都会逐一进行讲解,本篇带来的是DrawerLayout的使用(虽然已经很成熟,但是当做回顾)

初始UI:
这里写图片描述
方式一:因为DrawerLayout又名抽屉布局,所以我们是可以直接拖拽的,至于拖拽方向,可以通过Start与End进行确定
这里写图片描述

方式二:通过DrawerLayout.openDrawer(GravityCompat.START)进行事件显示(这里显示的也是我们最后的效果图(第一个方式最终显示的效果是一样的,只因表明拖拽的效果),有点丑请见谅> <)
这里写图片描述

注意点

  1. 首先我们要注意DrawerLayout为最外层布局
  2. 第一个视图为当前的主显示视图,我们一般都设置为Fragment
  3. DrawerLayout中的布局,我们可以自定义控件进行显示,也可以使用NavigationView进行处理(BottomNavigationView的使用与问题处理方案

MainActivity

package com.example.DrawerLayout;

import android.os.Bundle;
import android.app.Activity;
import android.support.v4.view.GravityCompat;
import android.support.v4.widget.DrawerLayout;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {

	private TextView mMainText;
	private DrawerLayout mLayout;
	private TextView mLayoutText;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		initView();
	}

	private void initView() {
		//最外层的DrawerLayout布局
		mLayout = (DrawerLayout) findViewById(R.id.layout);
		//主页面显示的按键
		mMainText = (TextView) findViewById(R.id.tv_mian);
		//DrawerLayout的内部事件
		mLayoutText = (TextView) findViewById(R.id.tv_layout);
		//主页面的点击事件
		mMainText.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View v) {
				mLayout.openDrawer(GravityCompat.START);
			}
		});
		//DrawerLayout内部的点击事件
		mLayoutText.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View v) {
				Toast.makeText(MainActivity.this, "这里是DrawerLayout的内部事件", 0).show();
			}
		});
	}
}

activity_main

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <TextView
            android:id="@+id/tv_mian"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="点击之后出现我们的DrawerLayout布局" />
    </FrameLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#fff"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/tv_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#000"
            android:text="DrawerLayout布局"
            android:textColor="#f00" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#000"
            android:text="DrawerLayout布局"
            android:textColor="#f00" />
    </LinearLayout>

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