Android ToolBar+DrawerLayout的实现

实现思路:
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.Toolbar
android: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) {
// 用来提取颜色的Bitmap
Bitmap 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
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值