Android应用的Material设计的布局兼容性的一些要点总结

Define Alternative Styles  定义替代样式
让你的app,使用Material Design的主题运行在支持它的设备上,并在早期版本的设备上可以运行较早的主题:
1. 在res/values/styles.xml 定义一个主题继承较早的主题
2. 在res/values-v21/styles.xml 定义一个相同名字的继承自Material主题 的主题
3. 在manifest中应用定义的主题
注:如果你的app使用了Material 主题,而不提供较早的主题,那么将不能运行在早期版本的设备上

Provide Alternative Layouts  提供替代布局
如果你设计的layout不引用任何的5.0中的xml属性,那么可以运行在早期版本的Android设备上。否则,你可提供一个替代布局。
替代布局建立在res/layout-v21/
为了避免重复代码,可以在res/values/  定义你的styles,新风格的在res/values-21/ 中定义,并使用style的继承,在res/values中定义一个baseStyle,在res/values-21中继承它。

Use the Support Library  使用支持库
v7 support library 包括以下的一些特性:

在应用了一个Theme.AppCompat 主题后,系统的一些组件就有了Material Design 的风格 在Theme.AppCompat 主题中,有调色主题 RecyclerView 组件显示数据集 CardView 组件创建卡片 从图像中取色

System widgets  系统组件

Theme.AppCompat 主题提供的Material Design 风格的组件有:

EditText Spinner CheckBox Radiobutton SwitchCompat CheckedTextView

Color Palette

使用v7支持库,获得Material Design 风格定义颜色板,应用一个Theme.AppCompat 主题:

<!-- extend one of the Theme.AppCompat themes --> <style name="Theme.MyTheme" parent="Theme.AppCompat.Light"> <!-- customize the color palette --> <item name="colorPrimary">@color/material_blue_500</item> <item name="colorPrimaryDark">@color/material_blue_700</item> <item name="colorAccent">@color/material_green_A200</item> </style>

Lists and Cards

使用v7支持库后,在早期的Android版本上也可运行。

Dependencies

gradle 依赖:

dependencies { compile 'com.android.support:appcompat-v7:21.0.+' compile 'com.android.support:cardview-v7:21.0.+' compile 'com.android.support:recyclerview-v7:21.0.+' }

Check the System Version  检查系统版本

以下特性只能在Android 5.0(API级别21)及以上:

Activity transitions  活动转换 Touch feedback    触觉反馈 Reveal animations  显示动画 Path-based animations  基于路径动画 Vector drawables  矢量图片 Drawable tinting  图片染色

检查代码:

// Check if we're running on Android 5.0 or higher if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { // Call some material design APIs here } else { // Implement this feature without material design }

注:要让app支持5.0,需要在manifest中Android:targetSdkVersion=21。

PS:RecyclerView
附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; } } }

时间: 2024-10-13 20:12:37

Android应用的Material设计的布局兼容性的一些要点总结的相关文章

Android应用的Material设计的布局兼容性的一些要点总结_Android

Define Alternative Styles  定义替代样式让你的app,使用Material Design的主题运行在支持它的设备上,并在早期版本的设备上可以运行较早的主题: 1. 在res/values/styles.xml 定义一个主题继承较早的主题 2. 在res/values-v21/styles.xml 定义一个相同名字的继承自Material主题 的主题 3. 在manifest中应用定义的主题 注:如果你的app使用了Material 主题,而不提供较早的主题,那么将不能运

Android应用的Material设计中图片的相关处理指南_Android

可伸缩的矢量图片不会丢失清晰度,并且单一颜色的app-icon是完美的 可定义一个bitmap作为透明度(alpha)和运行时的颜色 可对一个bitmap image取色,会取出它比较显眼的颜色 官网地址:https://developer.android.com/training/material/drawables.html 以下图片的功能能帮助你在app中实现Material设计: 图片着色 颜色提取 矢量图片 Tint Drawable Resources  为图片资源染色 在Andro

Android应用的Material设计中图片的相关处理指南

可伸缩的矢量图片不会丢失清晰度,并且单一颜色的app-icon是完美的 可定义一个bitmap作为透明度(alpha)和运行时的颜色 可对一个bitmap image取色,会取出它比较显眼的颜色 官网地址:https://developer.android.com/training/material/drawables.html 以下图片的功能能帮助你在app中实现Material设计: 图片着色 颜色提取 矢量图片 Tint Drawable Resources  为图片资源染色 在Andro

DIV CSS网页布局兼容性有哪些要点与诀窍?

css|网页 IE vs FF CSS 兼容要点:DOCTYPE 影响 CSS 处理 FF: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行 FF: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中 FF: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important

总结:CSS网页布局兼容性有哪些要点与诀窍?

css|网页 IE vs FF CSS 兼容要点:DOCTYPE 影响 CSS 处理 FF: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行 FF: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中 FF: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important

详解Android Material设计中阴影效果的实现方法_Android

View可以投下的阴影,一个View的elevation值决定了它的阴影的大小和绘制的顺序.可以设置一个视图的elevation,在布局中使用属性:android:elevation <TextView android:id="@+id/my_textview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text=&quo

Android用户界面设计:布局基础

理解布局对于好的http://www.aliyun.com/zixun/aggregation/1997.html">Android应用设计来说是非常重要的.在这个教程里,我们提供一个关于布局如何适应Android应用程序架构的概述.我们还探讨了一些特定的可用布局控件,用它们来以各种各样的方式组织应用程序屏幕内容. 什么是布局? Android开发者使用术语"布局",指的是两种含意中的一种.两种定义在这篇教程中都会用到,而且很不幸的是在Android开发社区它们被混着使

Android 各种按钮点击效果以及兼容性问题总结

概述  点击效果在安卓的原生开发中无处不见,主要是为了对用户的操作在视觉上进行反馈.这个反馈很平常也很重要.而安卓5.0开始引入的全新设计Material Design真的超赞!特别是触摸反馈的波纹效果,可惜这个波纹效果只支持5.0及以上的版本,应该是出于性能的考虑!坑爹啊!  但是既然5.0以上可以用酷炫的点击效果,那就不能浪费要用起来,这篇博客前面先讲下Button和ImageView点击效果的基本实现,然后再讲下我个人如何处理兼容Material 设计效果 按钮点击效果基本实现 Butto

Material设计素材与灵感

Material Design 是谷歌近期发布的新的视觉语言,通过结合出色的视觉设计和技术实现更好的用户体验.Material设计概念还很新,很少有相关的资源学习,不过,目前为止,我们已经整理了一小部分和Material的资源素材以及设计作品.大家可以下载这些设计素材学习或从中获取灵感. 谷歌提供的设计资源素材 在谷歌的Material Design设计指南页面中已经有一些素材分享,大家可点击这里去寻找,这里我们从中挑选比较具体和有用的素材源文件供你下载,文件格式为Adobe illustrat