Android(Lollipop/5.0) Material Design(一) 简单介绍

Material Design系列

Android(Lollipop/5.0)Material Design(一) 简单介绍

Android(Lollipop/5.0)Material Design(二) 入门指南

Android(Lollipop/5.0)Material Design(三) 使用Material主题

Android(Lollipop/5.0)Material Design(四) 创建列表和卡片

Android(Lollipop/5.0)Material Design(五) 定义阴影和裁剪View

Android(Lollipop/5.0)Material Design(六) 使用图片

Android(Lollipop/5.0)Material Design(七) 自己定义动画

Android(Lollipop/5.0)Material Design(八) 保持兼容性



官网地址:https://developer.android.com/design/material/index.html

使用Material Design 须要api21,即Lollipop/5.0以上

Material Design 为应用提供了:一个新的主题,一些组合View的新Widget,一些自己定义阴影和动画的新Api

Material 主题

在manifest.xml 中<... android:theme="@android:style/Theme.Material" /> 提示一下有非常多相关的主题

Android(Lollipop/5.0) Material Design(一) 简单介绍

详见 使用Material主题



Lists和Cards

5.0提供了两个新的Widget,它们使用了Material Design 的style和animation:

RecyclerView 一个更可插拔式的ListView,它支持不同的布局类型,而且性能有了改进。     列表式

CardView 一个能让你在其内显示重要信息,并保持连贯的视觉和感觉的卡片  卡片式

它两位于 sdk/extras/android/support/v7/cardview 和 sdk/extras/android/support/v7/RecyclerView

Android(Lollipop/5.0) Material Design(一) 简单介绍

详见 创建列表和卡片

View的阴影

View如今除了x、y属性外还有z,z代表一个view的仰角(elevation, 姑且这么翻译吧)

z越大,阴影越大;z越大,view会出如今其它view的顶部

详见 定义阴影和裁剪View

动画

新的动画Api,让你在UI控件里能创建触摸反馈,改变View的状态,切换activity的一系列自己定义动画

详细有:

响应View的touch事件的触摸反馈动画

隐藏和显示View的循环展示动画

两个Activity间的切换动画

更自然的曲线运动的动画

使用View的状态更修改画,能改变一个或多个View的属性

在View的状态更改时显示状态列表动画

这些new animations Api,已内置在标准Widget中。如Button。在自己定义view时也可使用这些api

Android(Lollipop/5.0) Material Design(一) 简单介绍

详见 使用自己定义动画

图片

可伸缩的矢量图片不会丢失清晰度。而且单一颜色的app-icon是完美的

可定义一个bitmap作为透明度(alpha)和执行时的颜色

可对一个bitmap image取色,会取出它比較显眼的颜色

详见 使用图片

附RecyclerView的样例:

import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.RecyclerView.LayoutParams;
import android.view.LayoutInflater;
import android.view.ViewGroup;
import android.widget.TextView; public class RecyclerViewActivity extends Activity {
/*
* recyclerview提供这些内置的布局管理器:
* linearlayoutmanager 显示垂直滚动列表或水平的项目。
* gridlayoutmanager 显示在一个网格项目。
* staggeredgridlayoutmanager 显示在交错网格项目。
* 自己定义的布局管理器,须要继承recyclerview.layoutmanager类。
*
* add/remove items时的动画是默认启用的。 * 自己定义这些动画须要继承RecyclerView.ItemAnimator。并实现RecyclerView.setItemAnimator()
*/
private RecyclerView mRecyclerView;
private RecyclerView.Adapter mAdapter;
private RecyclerView.LayoutManager mLayoutManager;
private String[] myDataset; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState); setContentView(R.layout.recycler_view);
mRecyclerView = (RecyclerView) findViewById(R.id.my_recycler_view); // use this setting to improve performance if you know that changes
// in content do not change the layout size of the RecyclerView
mRecyclerView.setHasFixedSize(true); // use a linear layout manager
// mLayoutManager = new LinearLayoutManager(this); // mLayoutManager = new GridLayoutManager(this, 3, GridLayoutManager.VERTICAL, true);
//true 表示,将layout内容反转
mLayoutManager = new GridLayoutManager(this, 3, GridLayoutManager.VERTICAL, false);
//HORIZONTAL 横向滚动显示内容 VERTICAL纵向
// mLayoutManager = new GridLayoutManager(this, 3, GridLayoutManager.HORIZONTAL, false); //方向也是指示滚动方向。样例中横向开头的数据交错了一点, 纵向的无交错
// mLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.HORIZONTAL);
// mLayoutManager = new StaggeredGridLayoutManager(4, StaggeredGridLayoutManager.VERTICAL); mRecyclerView.setLayoutManager(mLayoutManager);
// mRecyclerView.setLayoutManager(new MyLayoutMnager()); //数据不显示,可能还须要重写什么东西。。 // specify an adapter (see also next example) setDatas();
mAdapter = new MyAdapter(myDataset);
mRecyclerView.setAdapter(mAdapter);
} private void setDatas() {
int len = 200;
myDataset = new String[len];
for (int i = 0; i < len; i++) {
switch (i%3) {
case 0:
myDataset[i] = "中国" + i;
break;
case 1:
myDataset[i] = "美国" + i;
break;
case 2:
myDataset[i] = "澳大利亚" + i;
break;
}
}
} class MyLayoutMnager extends RecyclerView.LayoutManager { @Override
public LayoutParams generateDefaultLayoutParams() {
LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
params.topMargin = 5;
return params;
}
} class MyAdapter extends RecyclerView.Adapter<ViewHolder> {
private String[] mDataset; // Provide a reference to the views for each data item
// Complex data items may need more than one view per item, and
// you provide access to all the views for a data item in a view holder // Provide a suitable constructor (depends on the kind of dataset)
public MyAdapter(String[] myDataset) {
mDataset = myDataset;
} // Create new views (invoked by the layout manager)
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
// create a new view
TextView tv = (TextView) LayoutInflater.from(parent.getContext())
.inflate(R.layout.my_text_view, parent, false);
// set the view's size, margins, paddings and layout parameters
//...
ViewHolder vh = new ViewHolder(tv); //构建一个ViewHolder
return vh;
} // Replace the contents of a view (invoked by the layout manager)
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
// - get element from your dataset at this position
// - replace the contents of the view with that element
holder.mTextView.setText(mDataset[position]); } // Return the size of your dataset (invoked by the layout manager)
@Override
public int getItemCount() {
return mDataset.length;
}
} static class ViewHolder extends RecyclerView.ViewHolder {
// each data item is just a string in this case
public TextView mTextView;
public ViewHolder(TextView v) {
super(v);
mTextView = v;
}
}
}
上一篇:vue 点击按钮弹窗,点击关闭按钮关闭弹窗。


下一篇:Python 面向对象编程——初见