android官方控件DrawerLayout和Toolbar地配合使用

首先說下配置工做,由於如今Android機所採用的版本4.0如下都比較少了,因此我司的APP基本是把最低版本定在了4.0(3.0以Pad爲主嘛,至於android的Pad,算了,不提也罷),不然會報「java.lang.IllegalArgumentException: AppCompat does not support the current theme features」的錯誤,[stackOverFlow上有相關錯誤](http://http://stackoverflow.com/questions/29784124/java-lang-illegalargumentexception-appcompat-does-not-support-the-current-theme)。下面上代碼,首先是Style文件:
//此處主題必須設置爲Theme.AppCompat.NoActionBar,即隱藏ActionBar
<resources>

    <!-- Base application theme. -->
    <style name="AppTheme.Base" parent="Theme.AppCompat.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="android:windowNoTitle">true</item>

        <!-- Actionbar color 此處是ToolBar背景色-->
        <item name="colorPrimary">@color/accent_material_dark</item>
        <!--Status bar color 此處是狀態欄顏色-->
        <item name="colorPrimaryDark">@color/accent_material_light</item>
        <!--Window color-->
        <item name="android:windowBackground">@color/dim_foreground_material_dark</item>
    </style>
</resources>

接下來是Layout文件:java

<RelativeLayout 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"  tools:context=".MainActivity">

    <!--Toolbar的背景使用Style裏的定義-->
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:layout_alignParentTop="true"
        />
    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer"
        android:layout_below="@+id/toolbar"
             android:layout_width="match_parent"
        android:layout_height="match_parent"
        >
        <!--DrawerLayout內部的佈局份有且只能兩部分,主內容區域在嘴上,側滑欄區域在下面-->
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <TextView
                android:text="背景部分"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </FrameLayout>
        <!--ListView必須設置layout_gravity,代表側滑欄滑出的方向-->
        <ListView
            android:id="@+id/listDrawer"
            android:layout_gravity="right"
            android:layout_width="100dp"
            android:layout_height="match_parent"/>
    </android.support.v4.widget.DrawerLayout>


</RelativeLayout>

突然想到了,attr這個屬性是針對styles文件進行解析的,匹配對應名字的顏色

最後是Activity:android

package waiqin.example.com.drawerlayoutapp;

import android.os.Bundle;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Gravity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class MainActivity extends AppCompatActivity {

    private Toolbar toolbar;
    private DrawerLayout drawer;
    private ListView list;
    private String [] array = {"條目1","條目2","條目3"};
    private ArrayAdapter<String> adapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        adapter = new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,array);
        initToolbar();
        initView();
    }

    private void initToolbar()
    {
        toolbar = (Toolbar) findViewById(R.id.toolbar);

        //設置toolbar標題
        toolbar.setTitle("Drawer");
        //設置Navigation
        toolbar.setNavigationIcon(R.drawable.common_btn_back);
        //設置點擊Navigation的方法
        toolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });
        //爲了讓ToolBar各項設置都生效的話,這個方法必須放到最後
        setSupportActionBar(toolbar);
    }

    private void initView()
    {
        drawer = (DrawerLayout) findViewById(R.id.drawer);
        list = (ListView) findViewById(R.id.listDrawer);
        list.setAdapter(adapter);
    }

    //此方法定義Menu的佈局樣式,返回false則不顯示Menu
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }


    //此方法定義點擊Menu按鈕產生的事件
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        //點擊側滑彈出的事件
        if (id == R.id.action_settings) {
            if (drawer.isDrawerOpen(Gravity.RIGHT))
            {
                drawer.closeDrawer(Gravity.RIGHT);
            }
            else
            {
                drawer.openDrawer(Gravity.RIGHT);
            }
            return true;
        }

        return super.onOptionsItemSelected(item);
    }


}

最後是Menu的佈局文件:app

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools" tools:context=".MainActivity">
    <!--設置toolbar右側setting部分的圖標內容,showAsAction設置成always圖片才能被本身的成功替換掉-->
    <item android:id="@+id/action_settings" android:title="@string/action_settings"
        android:icon="@drawable/common_btn_submit_nor"
        android:orderInCategory="100" app:showAsAction="always" />
</menu>
![效果如圖:](https://static.oschina.net/uploads/img/201508/23161841_jjG2.jpg "在這裏輸入圖片標題")
相關文章
相關標籤/搜索