Android ToolBar+DrawerLayout的实现

来源:互联网 发布:js settimeout无效 编辑:程序博客网 时间:2024/05/16 15:30

实现思路:
1.关联相应的依赖包

compile ‘com.android.support:appcompat-v7:25.3.1’

2.主布局

<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="com.example.toolbar.MainActivity" >      <include layout="@layout/toolbar" />      <android.support.v4.widget.DrawerLayout          android:id="@+id/drawer"          android:layout_width="match_parent"          android:layout_height="match_parent" >          <!-- 内容界面 -->          <LinearLayout              android:layout_width="match_parent"              android:layout_height="match_parent"              android:orientation="vertical" >              <com.example.toolbar.widget.PagerSlidingTabStrip                  android:id="@+id/tabs"                  android:layout_width="match_parent"                  android:layout_height="48dip" >              </com.example.toolbar.widget.PagerSlidingTabStrip>              <android.support.v4.view.ViewPager                  android:id="@+id/pager"                  android:layout_width="match_parent"                  android:layout_height="match_parent" >              </android.support.v4.view.ViewPager>          </LinearLayout>          <!-- 侧滑菜单内容 -->          <LinearLayout              android:id="@+id/drawer_view"              android:layout_width="match_parent"              android:layout_height="match_parent"              android:layout_gravity="start"              android:background="@drawable/drawer"              android:orientation="vertical"              android:padding="8dp" >              <TextView                  android:layout_width="match_parent"                  android:layout_height="match_parent" />          </LinearLayout>      </android.support.v4.widget.DrawerLayout>  </LinearLayout>  

Toolbar布局

<?xml version="1.0" encoding="utf-8"?><android.support.v7.widget.Toolbarandroid:id="@+id/toolbar"xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app ="http://schemas.android.com/apk/res-auto"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="?attr/colorPrimary"android:popupTheme="@style/ThemeOverlay.AppCompat.Light"android:theme="@style/ThemeOverlay.AppCompat.ActionBar"    ></android.support.v7.widget.Toolbar>

Toolbar条上item的布局

<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" >    <item android:id="@+id/action_edit"        android:title="edit"        android:orderInCategory="80"        android:icon="@mipmap/ic_launcher"        app:showAsAction="ifRoom" />    <item android:id="@+id/action_share"        android:title="share"        android:orderInCategory="90"        android:icon="@mipmap/ic_launcher"        app:showAsAction="ifRoom" />    <item android:id="@+id/action_settings"        android:title="settings"        android:orderInCategory="100"        app:showAsAction="never"/></menu>

3.需要在style文件中,设置noActiobBar

<resources>    <!-- Base application theme. -->    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">        <!-- Customize your theme here. -->        <item name="colorPrimary">@color/colorPrimary</item>        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>        <item name="colorAccent">@color/colorAccent</item>    </style></resources>

4.在Activity中去找到ToolBar控件,然后关联ActionBar操作

mToolBar = (Toolbar) this.findViewById(R.id.toolbar);        mToolBar.setTitle("XHTest");        setSupportActionBar(mToolBar);        // 3.设置返回箭头        getSupportActionBar().setDisplayHomeAsUpEnabled(true);        ActionBarDrawerToggle toggle =  new ActionBarDrawerToggle(this,mDrawer,mToolBar,R.string.app_name,R.string.app_name);        toggle.syncState();        mDrawer.addDrawerListener(toggle);        mToolBar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {            @Override            public boolean onMenuItemClick(MenuItem item) {                switch(item.getItemId()) {//                    case R.id.action_search://                        Toast.makeText(getApplicationContext(), "搜索", Toast.LENGTH_SHORT).show();//                        break;                    case R.id.action_edit:                        Toast.makeText(getApplicationContext(), "搜索", Toast.LENGTH_SHORT).show();                        break;                    case R.id.action_settings:                        Toast.makeText(getApplicationContext(), "设置", Toast.LENGTH_SHORT).show();                        break;                    case R.id.action_share:                        Toast.makeText(getApplicationContext(), "分享", Toast.LENGTH_SHORT).show();                        break;                    default:                        break;                }                return true;            }        });

5.注意,要调用onCreateOptionsMenu方法,ToolBar上的item才会显示

// 1.必须创建菜单,才会显示    @Override    public boolean onCreateOptionsMenu(Menu menu) {        MenuInflater inflater = getMenuInflater();        inflater.inflate(R.menu.toolbar_item,menu);        return super.onCreateOptionsMenu(menu);    }

6.Palette的使用
6.1 首先关联一个依赖包

compile ‘com.android.support:palette-v7:23.4.0’

6.2 使用Palette的异步方法

private void changeBackgroundColor(int position) {// 用来提取颜色的BitmapBitmap bitmap = BitmapFactory.decodeResource(getResources(), PaletteFragment.getBackgroundBitmapPosition(position));// Palette的部分Palette.Builder builder = Palette.from(bitmap);builder.generate(new Palette.PaletteAsyncListener() {@Override public void onGenerated(Palette palette) {        //获取到充满活力的这种色调        Palette.Swatch vibrant = palette.getVibrantSwatch();        //根据调色板Palette获取到图片中的颜色设置到toolbar和tab中背景,标题等,使整个UI界面颜色统一        toolbar_tab.setBackgroundColor(vibrant.getRgb());        toolbar_tab.setSelectedTabIndicatorColor(colorBurn(vibrant.getRgb()));        toolbar.setBackgroundColor(vibrant.getRgb());        if (android.os.Build.VERSION.SDK_INT >= 21) {            Window window = getWindow();            window.setStatusBarColor(colorBurn(vibrant.getRgb()));            window.setNavigationBarColor(colorBurn(vibrant.getRgb()));        }    }}); }; /**     * 颜色加深处理     *     * @param RGBValues     *            RGB的值,由alpha(透明度)、red(红)、green(绿)、blue(蓝)构成,     *            Android中我们一般使用它的16进制,     *            例如:"#FFAABBCC",最左边到最右每两个字母就是代表alpha(透明度)、     *            red(红)、green(绿)、blue(蓝)。每种颜色值占一个字节(8位),值域0~255     *            所以下面使用移位的方法可以得到每种颜色的值,然后每种颜色值减小一下,在合成RGB颜色,颜色就会看起来深一些了     * @return     */    private int colorBurn(int RGBValues) {        int alpha = RGBValues >> 24;        int red = RGBValues >> 16 & 0xFF;        int green = RGBValues >> 8 & 0xFF;        int blue = RGBValues & 0xFF;        red = (int) Math.floor(red * (1 - 0.1));        green = (int) Math.floor(green * (1 - 0.1));        blue = (int) Math.floor(blue * (1 - 0.1));        return Color.rgb(red, green, blue);    }

0 0