AndroidUI--官方侧滑菜单DrawerLayout使用

本文介绍如何使用Android的DrawerLayout组件创建导航抽屉功能。通过XML布局文件定义主内容区域及侧边栏,并在Java代码中设置抽屉开关、列表项点击事件等。

首先编写我们的布局文件:
Drawerlayout为根布局,其内部布局分为主内容部分与侧滑菜单部分。

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawerlayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <!--主要内容-->
    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#E0EEE0"
        android:orientation="vertical"
        ></FrameLayout>

    <!--侧面抽屉需要显示的内容 -->
    <ListView
        android:id="@+id/left1_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#111"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="2dp"
        ></ListView>

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

FrameLayout为主要内容部分,颜色定义为#E0EEE0。点击就会导致侧滑菜单收回。
第二个子元素是侧滑菜单中的布局,打开菜单后即可见。

SecondDemoActivity.java

package com.example.administrator.testproject.FirstDemo;

import android.app.Activity;
import android.app.SearchManager;
import android.content.Intent;
import android.content.res.Configuration;
import android.os.Bundle;
import android.support.v4.app.ActionBarDrawerToggle;
import android.support.v4.view.GravityCompat;
import android.support.v4.widget.DrawerLayout;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.Toast;

import com.example.administrator.testproject.R;

import java.util.Locale;

/**
 * Created by Administrator on 2015/11/11.
 */
public class SecondDemoActivity extends Activity implements AdapterView.OnItemClickListener {

    /*
    侧滑菜单
     */
    private DrawerLayout mDrawerLayout;

    /*
    侧滑菜单中的列表控件
     */
    private ListView mDrawerList;

    /*
    侧滑菜单开关,用于打开/关闭Drawerlayout抽屉
    ActionBarDrawerToggle提供为Drawerlayout和ActionBar之间建立联系提供了便利
    即点击ActionBar的Home按钮,即可弹出Drawerlayout抽屉
     */
    private ActionBarDrawerToggle mDrawerToggle;

    /*
    actionbar原本显示的标题
     */
    private CharSequence mDrawerTitle;

    /*
    actionbar上显示itemlist的数据
     */
    private CharSequence mTitle;
    private String[] mPlanetTitles;

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

        mTitle = mDrawerTitle = getTitle();
        mPlanetTitles = getResources().getStringArray(R.array.planets_array);

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerlayout);
        mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow, GravityCompat.START);

        mDrawerList = (ListView) findViewById(R.id.left1_drawer);
        mDrawerList.setAdapter(new ArrayAdapter<String>(this,R.layout.drawer_list_item,mPlanetTitles));
        mDrawerList.setOnItemClickListener(this);

        getActionBar().setDisplayHomeAsUpEnabled(true);
        getActionBar().setHomeButtonEnabled(true);

        //使用ActionBarToggle作为DrawerLayout监听器
        mDrawerToggle = new ActionBarDrawerToggle(this,mDrawerLayout,R.drawable.ic_drawer,R.string.drawer_open,R.string.drawer_close){
            @Override
            public void onDrawerClosed(View drawerView){
                getActionBar().setTitle(mTitle);
                invalidateOptionsMenu();
            }

            @Override
        public void onDrawerOpened(View drawerView){
                getActionBar().setTitle(mDrawerTitle);
                invalidateOptionsMenu();
            }
        };
        mDrawerLayout.setDrawerListener(mDrawerToggle);
    }

    @Override
    public boolean onPrepareOptionsMenu(Menu menu){
        //调用方法判断Drawerlayout是否处于打开状态
        boolean drawerOpen = mDrawerLayout.isDrawerOpen(mDrawerList);
        menu.findItem(R.id.action_search).setVisible(!drawerOpen);
        return super.onPrepareOptionsMenu(menu);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu){
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.menu_main,menu);
        return super.onCreateOptionsMenu(menu);
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item){
        if (mDrawerToggle.onOptionsItemSelected(item)){
            return true;
        }
        switch (item.getItemId()){
            case R.id.action_search:
                Intent intent = new Intent(Intent.ACTION_WEB_SEARCH);
                intent.putExtra(SearchManager.QUERY,getActionBar().getTitle());
                if (intent.resolveActivity(getPackageManager()) != null){
                    startActivity(intent);
                }else {
                    Toast.makeText(this,R.string.app_not_available,Toast.LENGTH_SHORT).show();
                }
                return true;
        }
        return super.onOptionsItemSelected(item);
    }

    @Override
    public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
        selectItem(i);
    }

    private void selectItem(int i) {
        Toast.makeText(this,"You select item "+i,Toast.LENGTH_SHORT).show();

        android.app.Fragment fragment = new PlanetFragment();

        //传递索引值给Fragment,以达到选择不同的item显示不同的title
        Bundle args = new Bundle();
        args.putInt(PlanetFragment.ARG_PLANET_NUMBER, i);
        fragment.setArguments(args);
        android.app.FragmentManager fragmentManager = getFragmentManager();
        fragmentManager.beginTransaction().replace(R.id.content,fragment).commit();


        mDrawerList.setItemChecked(i,true);
        setTitle(mPlanetTitles[i]);
        mDrawerLayout.closeDrawer(mDrawerList);
    }

    @Override
    public void setTitle(CharSequence title){
        mTitle = title;
        getActionBar().setTitle(mTitle);
    }

    @Override
    public void onPostCreate(Bundle savedInstanceState){
        super.onPostCreate(savedInstanceState);
        //ActionBarDrawerToggle和Drawerlayout状态同步
        mDrawerToggle.syncState();
    }

    @Override
    public void onConfigurationChanged(Configuration newConfig){
        super.onConfigurationChanged(newConfig);
        mDrawerToggle.onConfigurationChanged(newConfig);
    }

    public static class PlanetFragment extends android.app.Fragment{
        public static final String ARG_PLANET_NUMBER = "planet_number";

        public PlanetFragment(){}

        @Override
        public View onCreateView(LayoutInflater inflater,ViewGroup container,Bundle savedInstanceState){
            View rootView = inflater.inflate(R.layout.fragment_planet,container,false);

            int i = getArguments().getInt(ARG_PLANET_NUMBER);

            String planet = getResources().getStringArray(R.array.planets_array)[i];

            int imageId = getResources().getIdentifier(planet.toLowerCase(Locale.getDefault()),"drawable",getActivity().getPackageName());

            ((ImageView)rootView.findViewById(R.id.image)).setImageResource(imageId);

            getActivity().setTitle(planet);

            return rootView;
        }
    }
}

fragment_planet.xml

<?xml version="1.0" encoding="utf-8"?>
<ImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/image"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000000"
    android:gravity="center"
    android:padding="32dp"></ImageView>

strings.xml

<resources>
    <string name="action_settings">Settings</string>
    <string name="app_name">Navigation Drawer Example</string>

    <string-array name="planets_array">
        <item>Mercury</item>
        <item>Venus</item>
        <item>Earth</item>
        <item>Mars</item>
        <item>Jupiter</item>
        <item>Saturn</item>
        <item>Uranus</item>
        <item>Neptune</item>
    </string-array>

    <string name="drawer_open">Open navigation drawer</string>
    <string name="drawer_close">Close navigation drawer</string>
    <string name="action_websearch">Web search</string>
    <string name="app_not_available">Sorry, there\'s no web browser available</string>
</resources>

这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值