Android5.0-Material Design(done)

最新推荐文章于 2021-01-20 14:27:51 发布

丑丑鱼1992

最新推荐文章于 2021-01-20 14:27:51 发布

阅读量677

点赞数

文章标签： Material Design

本文链接：https://blog.csdn.net/u013768203/article/details/49531939

版权

Material Design简介

Material Design是谷歌新的设计语言，谷歌希望寄由此来统一各种平台上的用户体验，Material Design的特点是干净的排版和简单的布局，以此来突出内容。
Material Design对排版、材质、配色、光效、间距、文字大小、交互方式、动画轨迹都做出了建议，以帮助设计者设计出符合Material Design风格的应用。
更多详情请见Material Design文档：
中文版网站 http://design.1sters.com/
英文版 http://www.google.com/design/spec/material-design/introduction.html

Material Design使用

作为我们开发者，最关心的还是如何在项目中使用Material Design风格：
1 设置应用的 targetSdkVersion 和 targetSdkVersion 为21
2 在values目录下的style资源文件中创建一个style，让其继承自 android:Theme.Material
3 在AndroidManifest中指定应用的主题或者Activity的主题为我们设定的样式

演示:android_sample(5.0综合demo)-debug.apk
在低版本android系统上实现Material设计应用码农明明桑

1.主题样式

谷歌官方我们提供了三种配色风格的Material Design样式
1 黑色主题 Theme.Material

<style name="AppTheme" parent="android:Theme.Material.Light">

2   明亮主题 Theme.Material.Light 
    在as中src目录下有vlaue-v21的文件夹 对应21版的5.0显示,默认是这个主题
3   明亮主题黑色ActionBar 
Theme.Material.Light.DarkActionBar

这里写图片描述

我们也可以继承系统提供的Material Design样式，进行配色修改：

这里写图片描述

<?xml version="1.0" encoding="utf-8"?>                                    <resources>                                                                                                            <style name="AppTheme" parent="android:Theme.Material.Light"> 
<item name="android:colorPrimaryDark">#2e56cd</item>                        <item name=“android:colorPrimary”>#3b73f1</item>
<item name="android:navigationBarColor">#0c0c0c</item> 
<item name=“android:windowBackground">@color/windowbg
</item> 
</style> 
</resources>

1   android:colorPrimaryDark 应用的主要暗色调，statusBarColor默认使用该颜色
2   android:statusBarColor 状态栏颜色，默认使用colorPrimaryDark
3   android:colorPrimary 应用的主要色调，actionBar默认使用该颜色
4   android:windowBackground 窗口背景颜色
5   android:navigationBarColor 底部栏颜色
6   android:colorForeground 应用的前景色，ListView的分割线，switch滑动区默认使用该颜色
7   android:colorBackground 应用的背景色，popMenu的背景默认使用该颜色
8   android:colorAccent 一般控件的选种效果默认采用该颜色
9   android:colorControlNormal 控件的默认色调　
10  android:colorControlHighlight 控件按压时的色调
11  android:colorControlActivated 控件选中时的颜色，默认使用colorAccent
12  android:colorButtonNormal 默认按钮的背景颜色
13  android:textColor Button，textView的文字颜色
14  android:textColorPrimaryDisableOnly RadioButton checkbox等控件的文字
15  android:textColorPrimary 应用的主要文字颜色，actionBar的标题文字默认使用该颜色

多种主题的选择

    public class MainActivity extends Activity {
        @Override  

        protected void onCreate(Bundle savedInstanceState) { 
            super.onCreate(savedInstanceState);
 int ThemeId = getIntent().getIntExtra("ThemeId", -1);  
            if (ThemeId == R.style.AppTheme_Red) { 
                setTheme(R.style.AppTheme_Red);  } else if (ThemeId == R.style.AppTheme_Pink) { 
                setTheme(R.style.AppTheme_Pink); }
 setContentView(R.layout.activity_main); }

        public void red(View view) { 
            //每次打开一个intent的时候都有动画去重动画 
            finish(); 
            overridePendingTransition(0, 0);//Activity的切换动画 
               /* 
               这个函数有两个参数，一个参数是第一个activity进入时的动画，另外一个参数则是第二个activity退出时的动画。  
               这里需要特别说明的是，关于overridePendingTransition这个函数，有两点需要主意 
               1.它必需紧挨着startActivity()或者finish()函数之后调用" 
               2.它只在android2.0以及以上版本上适用
               */
  
            //重启自己 
            Intent intent = new Intent(MainActivity.this, MainActivity.class); 
            //告知要切换的主题 
            intent.putExtra("ThemeId", R.style.AppTheme_Red); 
            startActivity(intent); 
            Toast.makeText(this, "red", Toast.LENGTH_SHORT).show(); 
            overridePendingTransition(0, 0); 
        }

        public void pink(View view) { 
            // setTheme(R.style.AppTheme_Pink); 运行没显示 
            Intent intent = new Intent(MainActivity.this, MainActivity.class); 
            intent.putExtra("ThemeId", R.style.AppTheme_Pink); 
            startActivity(intent); 
            Toast.makeText(this, "pink", Toast.LENGTH_SHORT).show(); 
            overridePendingTransition(0, 0); 
        }
    }

value-v21/styles.xml

     <?xml version="1.0" encoding="utf-8"?> <resources> 
<!--红色主题--> 
<style name="AppTheme_Red" parent="android:Theme.Material.Light.DarkActionBar">
         <!--应用的主要暗色调--> <item name="android:colorPrimaryDark">
    @color/red_colorPrimaryDark</item>         <!--actionBar默认使用该颜色--> 
    <item name="android:colorPrimary">@color/red_colorPrimary</item>         <!--窗口背景颜色--> 
    <item name="android:windowBackground">@color/red_windowBackground</item>         <!--底部栏颜色--> 
    <item name="android:navigationBarColor">@color/red_navigationBarColor</item> 
</style>

<!--粉色主题--> 
<style name="AppTheme_Pink" parent="android:Theme.Material.Light.DarkActionBar">
         <!--应用的主要暗色调--> <item name="android:colorPrimaryDark">
    @color/pink_colorPrimaryDark</item>         <!--actionBar默认使用该颜色--> 
    <item name="android:colorPrimary">@color/pink_colorPrimary</item>         <!--窗口背景颜色--> 
    <item name="android:windowBackground">@color/pink_windowBackground</item>         <!--底部栏颜色--> 
    <item name="android:navigationBarColor">@color/pink_navigationBarColor</item> 
</style>
 
</resources>

color.xml

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
<!--红色--> 
<color name="red_colorPrimaryDark">#ffb0120a</color>
 <color name="red_colorPrimary">#ffe51c23</color>
 <color name="red_windowBackground">#fff36c60</color> 
<color name="red_navigationBarColor">#ffd01716</color> 
<!--粉色--> 
<color name="pink_colorPrimaryDark">#ff880e4f</color>
 <color name="pink_colorPrimary">#ffe91e63</color>
 <color name="pink_windowBackground">#fff06292</color> 
<color name="pink_navigationBarColor">#ffc2185b</color> 
</resources>