Toolbar

来源:互联网 发布:中国联合工程公司知乎 编辑:程序博客网 时间:2024/06/10 12:07

Material Design:一种界面设计语言

这里写图片描述

之前没怎么用过toolbar,最近看书看到,toolbar挺实用的,而且官方推荐实用的。有必要详细了解下了。

对比优点:

Actionbar:只能位于活动的顶部
Toolbar:继承了Actionbar的所有功能,但更灵活,可以配合其他控件来完成一些Material Design的效果。

具体学习

  1. 主题AppTheme指定为不带ActionBar的:
    <!-- 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>

Theme.AppCompat.NoActionBar:深色主题:主题色为深色,陪衬色设为淡色

这里写图片描述

Theme.AppCompat.Light.NoActionBar:淡色主题:主题色为淡色,陪衬色设为深色

这里写图片描述

页面写法:
使用app命名空间是为了兼容低版本。

    <android.support.v7.widget.Toolbar        android:id="@+id/toolbar"        android:layout_width="match_parent"    <!--actionbar的高度-->    android:layout_height="?attr/actionBarSize"    android:background="?attr/colorPrimary"    <!--单独使用深色主题-->    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"    <!--弹窗使用浅色主题-->    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"    />

写一个toolbar随ScrollView渐变效果

参考文章:https://www.cnblogs.com/wjtaigwh/p/5818371.html

这里写图片描述

activity.xml

这里写图片描述

1.toolbar.xml

<?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"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:paddingTop="22dp"    android:paddingBottom="4dp"    >    <!--左侧按钮-->    <ImageView        android:id="@+id/headLeftImg"        android:layout_width="wrap_content"        android:layout_height="match_parent"        android:layout_centerVertical="true"        android:padding="10dp"        android:scaleType="center"        android:src="@mipmap/goodsback"        />    <!--标题-->    <TextView        android:id="@+id/headTitleTv"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center"        android:tag="50"        android:text="@string/app_name"        android:textColor="#00000000"/></android.support.v7.widget.Toolbar>

2.TranslucentScrollView.java

import android.content.Context;import android.util.AttributeSet;import android.widget.ScrollView;/** * 自定义ScrollView,监听滑动 * @author liyuanli * @data 2017/11/17 */public class TranslucentScrollView extends ScrollView {    private OnScrollChangedListener mOnScrollChangedListenner;    public interface OnScrollChangedListener {        void onScrollChanged(ScrollView who, int l, int t, int oldl, int oldt);    }    public void setOnScrollChangedListenner(OnScrollChangedListener onScrollChangedListenner) {        mOnScrollChangedListenner = onScrollChangedListenner;    }    public TranslucentScrollView(Context context) {        super(context);    }    public TranslucentScrollView(Context context, AttributeSet attrs) {        super(context, attrs);    }    public TranslucentScrollView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);    }    @Override    protected void onScrollChanged(int l, int t, int oldl, int oldt) {        super.onScrollChanged(l, t, oldl, oldt);        if (mOnScrollChangedListenner != null) {            mOnScrollChangedListenner.onScrollChanged(this, l, t, oldl, oldt);        }    }}

3.Activity.java

    private float headerHeight;//顶部高度    private float minHeaderHeight;//顶部最低高度,即Bar的高度    @Override    public void initView(Bundle savedInstanceState) {        scrollview.setOnScrollChangedListenner(this);        headerHeight = getResources().getDimension(R.dimen.dimen_900);        minHeaderHeight = getResources().getDimension(R.dimen.abc_action_bar_default_height_material);    }    @Override    public void onScrollChanged(ScrollView who, int l, int t, int oldl, int oldt) {        //y轴偏移量        float scrollY = who.getScrollY();        //变化率        float headerBarOffsetY = headerHeight - minHeaderHeight;        float offset = 1 - Math.max((headerBarOffsetY - scrollY) / headerBarOffsetY, 0f);        if (offset <= 0.1) {            headLeftImg.setImageResource(R.mipmap.goodsback);            iv_totop.setVisibility(View.GONE);        } else {            headLeftImg.setImageResource(R.mipmap.back);            iv_totop.setVisibility(View.VISIBLE);        }        headTitleTv.setTextColor(Color.argb((int) (offset * 255), 0, 0, 0));        //Toolbar背景色透明度goodsback        toolbar.setBackgroundColor(Color.argb((int) (offset * 255), 255, 255, 255));    }
原创粉丝点击