一:5.X UI设计初步
新特性
二:Material Design主题
Material Design现在有三种默认的主题可以设置
@android:style/Theme.Material(dark version)
@android:style/Theme.Material.Light(light version)
@android:style/Theme.Material.Light.DarkActionBar
同时Android 5.X提出了Color Palette的概念,开发者可以设定系统区域的颜色,使整个App颜色风格和系统颜色风格保持统一
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="android:Theme.Material">
<!-- Customize your theme here. -->
<item name="colorPrimary">#BEBEBE</item>
<item name="colorPrimaryDark">#FF5AEBFF</item>
<item name="android:navigationBarColor">#FFFF4130</item>
</style>
</resources>
三:Palette
Android 5.X创新地使用palette来提取颜色,从而让主题能够动态适应当前页面的色调。做到整个App颜色基调和谐统一。
Android内置了几种提取色调的种类,
使用Palette首先再AS中引用相关依赖。
implementation 'com.android.support:palette-v7:28.0.0'
可以传递一个Bitmap对象给Palette,并调用它的Palette.generate()静态方法或者Palette.generateAysnc()方法来创建一个Palette。接下来就可以使用getter方法来检索相应的色调。这些色调就是上面列出来的色调。
下面的例子是如何通过加载的图片的柔和色调来改变状态栏和Actionbar的色调。
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2);
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.seekbar_bg_pic);
//创建Palette对象
Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
@Override
public void onGenerated(@Nullable Palette palette) {
//通过Palette来获取对应的色调
Palette.Swatch vibrant = palette.getDarkVibrantSwatch();
//将颜色设置给相应的组件
getActionBar().setBackgroundDrawable(new ColorDrawable(vibrant.getRgb()));
Window window = getWindow();
window.setStatusBarColor(vibrant.getRgb());
}
});
}
}
palette.get...Swatch();
四:视图与阴影
阴影效果
Google增加了View的新属性——Z,对应垂直方向上的高度变化。
Android5.X中,View的Z值由两部分组成,elevation和translationZ(都是新引入的属性)。elevation是静态的成员,translationZ可以在代码中使用来实现动画效果
Z = elevation + translationZ
通过在XML布局代码中使用如下代码来静态设置View的视图高度。
android:elevation = "XXdp'
通过下面的代码演示了不同视图高度所显示的效果不同
在程序中同样可以使用如下代码动态改变视图高度
view.setTranlationZ(XXX);
通常也会使用属性动画来为视图高度改变的时候增加一个动画效果
if(flag){
view.animate().translationZ(100);
flag = false;
}else{
view.animate().translationZ(0);
flag = true;
}
五:Tinting和Clipping
Tinting(着色) Clipping(裁剪)。
TInting(着色)
在XML文件的imageView标签中设置tint属性和tintMode属性。tint属性设置颜色,tintMode设置着色模式。
Clipping(裁剪)
Clipping可以让我们改变一个视图的外形。要使用Clipping,首先要使用ViewOutlineProvider来修改outline,然后再通过setOutlineProvider将outline作用给视图。
<?xml version="1.0" encoding="utf-8"?>
<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:gravity="center"
android:orientation="vertical">
<TextView
android:id="@+id/tv_rect"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="20dp"
android:elevation="1dp"
android:gravity="center" />
<TextView
android:id="@+id/tv_circle"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="20dp"
android:elevation="1dp"
android:gravity="center" />
</LinearLayout>
Java代码
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
View v1 = findViewById(R.id.tv_rect);
View v2 = findViewById(R.id.tv_circle);
//获取Outline
ViewOutlineProvider viewOutlineProvider1 = new ViewOutlineProvider() {
@Override
public void getOutline(View view, Outline outline) {
//修改outline为特定形状
outline.setRoundRect(0, 0, view.getWidth(), view.getHeight(), 30);
}
};
//获取Outline
ViewOutlineProvider viewOutlineProvider2 = new ViewOutlineProvider() {
@Override
public void getOutline(View view, Outline outline) {
//修改outline为特定形状
outline.setOval(0, 0, view.getWidth(), view.getHeight());
}
};
//重新设置形状
v1.setOutlineProvider(viewOutlineProvider1);
v2.setOutlineProvider(viewOutlineProvider2);
}
}
使用RecyclerView,要导入recyclerView的依赖在V7包中,同样需要list item子目录,在Material Design中通常与CardView配合使用
RecyclerView相比ListView更加先进的是,它已经封装好了ViewHolder,只需要实现功能就可以了。
RecyclerView定义了LayoutManager来帮助开发者更加方便地创建不同的布局。也可以自定义LayoutManager创建自己的布局。
mRList.setLayoutManager(new LinearLayoutManager(RecyclerTest.this));
mRList.setLayoutManager(new GridLayoutManager(RecyclerTest.this,3));
CardView是一个容器类布局
它提供了卡片这一种形式,开发者可以定义卡片的大小与视图高度,并设置圆角角度,也需要引入v7包中cardView的依赖。其次需要引入新的名字空间
xmlns:card_view=http://schems.android.com/apk/res-auto来添加。这样才可以通过自定义的名字空间来引用它的属性。
card_view:cardBackgroundColor="@color/cardview_background"
card_view:cardCornerRadius="8dp"
两个属性,前者设置背景颜色,后者设置圆角的角度。
七:Activity过渡动画
曾经的Android在Activity进行跳转的时候,只是非常生硬地切换,即使通过overridePendingtransition(int Id,int outId)这个方法来给Activity增加一些切换动画,效果也是差强人意。
更加丰富的Activity转场效果动画。三种Transition类型
首先看三种Activity过渡动画,例如从活动A到活动B。
startActivity(intent,ActivityOptions.makeSceneTransitionAnimation(this).toBundle());
8.1ripple波纹效果
8.2Circular Reveal
具体表现为一个View以圆形的形式展开,揭示出来
8.3View state changes Animation
视图状态切换动画
九Toolbar
这里是引用
Toolbar比Actionbar自由,可控。
要使用要引入v7包支持,设置主题为NoActionBar.
十Notification