Quantcast
Channel: CSDN博客移动开发推荐文章
Viewing all articles
Browse latest Browse all 5930

Android系统主题总结和使用

$
0
0

一,Android主题的发展过程

1,在Android3.0之前,Android的界面不论是从系统还是空间的主题都是按钮为白色,点击事件为黄色。现在看来很简陋。


2,Holo主题:Android3.0 (API11)开始,Google推出了Holo主题(就是我们印象中的黑底白字蓝主色的主题)。在4.0重google又发布了应用设计规范Android Design。有了设计规范的指导,就有了更多的应用采用Holo主题。所以我们可以简单认为Android Design就是Holo主题。但是这种主题是适合移动设备,其他平台略显突兀。

      在4.0之前Android可以说是没有设计可言的,在4.0之后推出了Android Design,从此Android在设计上有了很大的改善,而在程序实现上相应的就是Holo风格,所以你看到有类似 Theme.Holo.Light、 Theme.Holo.Light.DarkActionBar 就是4.0的设计风格,但是为了让4.0之前的版本也能有这种风格怎么办呢?这个时候就不得不引用v7包了,所以对应的就有 Theme.AppCompat.Light、Theme.AppCompat.Light.DarkActionBar,如果你的程序最小支持的版本是API14(即Android 4.0),那么可以不用考虑v7的兼容。


3,Material 主题从Android5.0(API21)开始,Google又推出了材料设计语言Material Design,又叫Google Design。MD崇尚的就是图层扁平化,所有图层像纸或者卡片一样重叠在一起,所以Android5.0就有了RecyclerView和CardView。图层之间有间隔,所以Android5.0中有了translation和elevation两个属性。同时也规范了Android的运动元素,界面上的每个元素不是无故产生的,同时每个图层的产生和消失都有方向的约定,从哪里来就往哪里去,这也是为什么Android 5.0中会有Ripple,Circular Receal,Activity Transition.

     Android在5.0版本推出了Material Design的概念,这是Android设计上又一大突破。对应的程序实现上就有Theme.Material.Light、 Theme.Material.Light.DarkActionBar等,但是这种风格只能应用在在5.0版本的手机,如果在5.0之前应用Material Design该怎么办呢?同样的引用appcompat-v7包,这个时候的Theme.AppCompat.Light、Theme.AppCompat.Light.DarkActionBar就是相对应兼容的Material Design的Theme。


二,Android Theme的分类

    1,android:Theme                             API 1 开始
    2,android:Theme.Holo                     API 11(android3.0) 开始
    3,android:Theme.DeviceDefault      API 14(android4.0) 开始
    4,android:Theme.Material               API 21(android5.0) 开始
    5,Theme.AppCompat                      兼容包AppCompat_v7中的主题


三,使用系统主题的位置

  1,使用非兼容包主题的方法:在style标签的parent里面输入“Android:Theme”会有自动提示

  Theme主题和DeviceDefault主题

Holo主题


Material主题


  2,使用兼容主题的方法。在style标签的parent里面输入“Theme”会有自动提示




API 1:
android:Theme 根主题
android:Theme.Black 背景黑色
android:Theme.Light 背景白色
android:Theme.Wallpaper 以桌面墙纸为背景
android:Theme.Translucent 透明背景
android:Theme.Panel 平板风格
android:Theme.Dialog 对话框风格

API 11:
android:Theme.Holo Holo根主题
android:Theme.Holo.Black Holo黑主题
android:Theme.Holo.Light Holo白主题

API 14:
Theme.DeviceDefault 设备默认根主题
Theme.DeviceDefault.Black 设备默认黑主题
Theme.DeviceDefault.Light 设备默认白主题

API 21: (网上常说的 Android Material Design 就是要用这种主题)
Theme.Material Material根主题
Theme.Material.Light Material白主题

兼容包v7中带的主题:
Theme.AppCompat 兼容主题的根主题
Theme.AppCompat.Black 兼容主题的黑色主题
Theme.AppCompat.Light 兼容主题的白色主题

更多主题:
以下都是指“包含”,比如包含“Dialog”表示对话框风格
比如Theme.Dialog、Theme.Holo.Dialog、Theme.Material.Dialog、Theme.AppCompat.Dialog都是对话框风格
具体有没有这种组合,你就在“自动提示”中来看就可以,提示有就有,没有就没有。

Black 黑色风格
Light 光明风格
Dark 黑暗风格
DayNight 白昼风格
Wallpaper 墙纸为背景
Translucent 透明背景
Panel 平板风格
Dialog 对话框风格
NoTitleBar 没有TitleBar
NoActionBar 没有ActionBar
Fullscreen 全屏风格
MinWidth 对话框或者ActionBar的宽度根据内容变化,而不是充满全屏
WhenLarge 对话框充满全屏
TranslucentDecor 半透明风格
NoDisplay 不显示,也就是隐藏了
WithActionBar 在旧版主题上显示ActionBar

常见主题

•android:theme="@android:style/Theme.Dialog"   将一个Activity显示为能话框模式
•android:theme="@android:style/Theme.NoTitleBar"  不显示应用程序标题栏
•android:theme="@android:style/Theme.NoTitleBar.Fullscreen"  不显示应用程序标题栏,并全屏
•android:theme="Theme.Light"  背景为白色
•android:theme="Theme.Light.NoTitleBar"  白色背景并无标题栏 
•android:theme="Theme.Light.NoTitleBar.Fullscreen"  白色背景,无标题栏,全屏
•android:theme="Theme.Black"  背景黑色
•android:theme="Theme.Black.NoTitleBar"  黑色背景并无标题栏
•android:theme="Theme.Black.NoTitleBar.Fullscreen"    黑色背景,无标题栏,全屏
•android:theme="Theme.Wallpaper"  用系统桌面为应用程序背景
•android:theme="Theme.Wallpaper.NoTitleBar"  用系统桌面为应用程序背景,且无标题栏
•android:theme="Theme.Wallpaper.NoTitleBar.Fullscreen"  用系统桌面为应用程序背景,无标题栏,全屏
•android:theme="Translucent" 背景为透明
•android:theme="Theme.Translucent.NoTitleBar"  透明背景并无标题栏
•android:theme="Theme.Translucent.NoTitleBar.Fullscreen"  透明背景并无标题栏,全屏
•android:theme="Theme.Panel"  内容容器
•android:theme="Theme.Light.Panel" 背景为白色的内容容器

AppCompat_v7兼容包主题细分:(以'com.android.support:appcompat-v7:25.1.0'为例:)

Theme.AppCompat 作用于Activity层面以上的主题
Base、Platform 作为父类被继承的,一般不直接使用

AlertDialog.AppCompat 对话框深色
AlertDialog.AppCompat.Light 对话框浅色
Animation.AppCompat.Dialog 带动画效果的对话框
Animation.AppCompat.DropDownUp
RtlOverlay.Widget.AppCompat
RtlUnderlay.Widget.AppCompat
TextAppearance.AppCompat 文字样式相关
ThemeOverlay.AppCompat
Widget.AppCompat 控件相关的主题


关于Theme.ApCompat兼容主题
主题间的继承关系:(以Theme.AppCompat为例)
Theme.AppCompat ——> Base.Theme.AppCompat
Base.Theme.AppCompat ——> Base.V*.Theme.AppCompat (*可能是7、21、23等)
Base.V*.Theme.AppCompat ——> Platform.AppCompat
Platform.AppCompat ——> android:Theme


其中第二步:版本25.1.0有四种选择:Base、Base.V21、Base.V22、Base.V23。(更早的版本还有V7、V11等)
兼容:App在运行时会根据系统的版本选择对应的父类主题。大于21选择V21,大于22选择V22


系统通常预定义的主题样式:
Theme.AppCompat 深色主题
Theme.AppCompat.NoActionBar 没有ActionBar
Theme.AppCompat.Dialog 对话框适用
Theme.AppCompat.Dialog.Alert 警告框适用(根据屏幕决定宽度)
Theme.AppCompat.Dialog.MinWidth 对话框适用(根据内容决定宽度)
Theme.AppCompat.DialogWhenLarge 充满屏幕(继承自Theme.AppCompat,但没有扩展)
Theme.AppCompat.CompactMenu 看名字是用于Menu菜单。未验证
其他主题系统默认都会有上述几种类型的子主题,以此类推就好。
例如:浅色主题只需要将Theme.AppCompat 替换成 Theme.AppCompat.Light即可


四,为什么需要Theme.AppCompat主题?

那么这个Theme.AppCompat到底是什么呢?就要从其他的三个系统基本主题说起

          1,android:Theme
          2,android:Theme.Holo
          3,android:Theme.Material

是的,这三个主题就对应了上一节说的三种Android主题。android:Theme是所有主题的超级父类所有的主题都是它继承或者间接继承来的。android:Theme.Holo从Api 11开始才可以使用。android:Theme.Material从Api 21开始可以使用。

如果我们要在不同版本的系统上用各自的主题,比如在4.0之下的系统用android:Theme4.0至5.0的系统用Holo主题5.0及之后的系统使用Material Design,那我们需要建不同的value-vX目录。在各自的目录中的style继承相应的系统主题。在运行是系统就会根据平台版本使用相应的主题。如果使用的主题没有找到,那么系统就会根据App指定的targetSdkVersion自动设置主题,假如设置的targetSdkVersion超过了系统的版本,系统就设置为支持的最高系统sdk版本的主题。


最后一句话怎么理解,举个例子,如果在我们在Api 24的sdk下进行开发,设置我们的应用targetSdkVersion=16,应用的资源目录下建立value-16,这是针对4.4以上平台的资源目录,在styles.xml中我们继承android:Theme.Material,这很明显是在5.0系统之上才能用的。虽然Android Studio会给出提示,但可以编译通过。现在我们把App放在一台4.4的机器上跑,这时系统是找不到android:Theme.Material这个主题的。那么系统就会看targtSdkVersion,发现是16,所以系统就会将App的主题设置为Holo的。如果我们其他的所有配置都不变,只把targetSdkVersion改成9,系统就会把App的主题设置为android:Theme的主题。这时如果把targetSdkVersion改成24,4.4的机器是不支持24的,那么出来的效果依然是android:Theme.Holo主题。


那么有同学就要问了,如果我要在Android 4.4(支持Holo主题)的机器上使用Material主题(Android 5.0)怎么办呢?(就是低版本要使用高版本的系统主题)没事,Google已经帮我们想好了解决方案。毕竟Google希望在不同的平台和版本上推广Material Design嘛。这样才能给用户提供一致性的体验。介于此,Android里就有了Theme.AppCompat主题和AppCompatActivity。细心的同学也会发现现在用Android Studio新建一个工程,默认的MainActivity继承的是AppCompatActivitiy,默认的主题就是Theme.AppCompat。


我们先来说Theme.AppCompat,这个主题可以让5.0以下的系统使用Material主题。我们只需要让我们的系统主题继承Theme.AppCompat即可。只需要指定这个就OK了,是不是很简单。

有必要说的是,使用了Theme.AppCompat之后,targetSdkVersion就不受影响了。继续拿上一节的例子说,在Api24 Sdk下开发,targtSdkVersion=9,跑在4.4的机器上,你会发现依然是Material主题。

所以可以总结出,应用使用了Theme.AppCompat主题,不论我们的targetSdkVersion指定为多少,跑在任意版本的系统上都会呈现出Material主题。


五,Android Material Design 详解(使用support v7兼容5.0以下系统)

     Material Design是Google在2014年的I/O大会上推出的全新设计语言。Material Design是基于Android 5.0(API level 21)的,兼容5.0以下的设备时需要使用版本号v21.0.0以上的support v7包中的appcpmpat,不过遗憾的是support包只支持Material Design的部分特性。使用eclipse或Android Studio进行开发时,直接在Android SDK Manager中将Extras->Android Support Library升级至最新版即可。

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:23.4.0'
}
1.创建一个Android应用,应用主题Theme.AppCompat(或其子主题,如Theme.AppCompat.Light.DarkActionBar)

apply plugin: 'com.android.application'

android {
    compileSdkVersion 23
    buildToolsVersion "24.0.3"

    defaultConfig {
        applicationId "com.tuke.customtheme"
        minSdkVersion 15
        targetSdkVersion 23
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:23.4.0'
}
本文中示例程序使用minSdkVersion=15,即属于使用support包实现Material Design风格

自动生成的activity默认继承AppCompatActivity

public class CustomTheme extends AppCompatActivity {//继承AppCompatActivity

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_custom_theme);
    }
}

CustomTheme的主题默认是

 <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here.自定义你的主题 -->

        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        
    </style>


2.如果想自定义主题,自定义程序所使用的主题的某些属性,示例:



<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here.自定义你的主题 -->

        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>

        <item name="android:textColorPrimary">@color/textColorPrimary</item>
        <item name="android:windowBackground">@color/windowBackground</item>
        <item name="android:textColor">@color/textColor</item>
        <item name="android:colorControlNormal">@color/colorControlNormal</item>
    </style>
    <style name="myTheme" parent="android:t">

    </style>
    
</resources>

1.colorPrimary                     应用的主要色调,actionBar默认使用该颜色,Toolbar导航栏的底色
2.colorPrimaryDark             应用的主要暗色调,statusBarColor默认使用该颜色
3.statusBarColor                 状态栏颜色,默认使用colorPrimaryDark
4.windowBackground          窗口背景颜色
5.navigationBarColor           底部栏颜色
6.colorForeground               应用的前景色,ListView的分割线,switch滑动区默认使用该颜色
7.colorBackground              应用的背景色,popMenu的背景默认使用该颜色
8.colorAccent                      CheckBox,RadioButton,SwitchCompat等一般控件的选中效果默认采用该颜色
9.colorControlNormal          CheckBox,RadioButton,SwitchCompat等默认状态的颜色。
10.colorControlHighlight      控件按压时的色调
11.colorControlActivated      控件选中时的颜色,默认使用colorAccent
12.colorButtonNormal          默认按钮的背景颜色
13.editTextColor:               默认EditView输入框字体的颜色。
14.textColor                         Button,textView的文字颜色
15.textColorPrimaryDisableOnly           RadioButton checkbox等控件的文字
16.textColorPrimary            应用的主要文字颜色,actionBar的标题文字默认使用该颜色
17.colorSwitchThumbNormal:             switch thumbs 默认状态的颜色. (switch off)


Android5.0设置主题样式:

<style name="RedTheme" parent="android:Theme.Material">
        <!-- 状态栏颜色,会被statusBarColor效果覆盖-->
        <item name="android:colorPrimaryDark">@color/status_red</item>
        <!-- 状态栏颜色,继承自colorPrimaryDark -->
        <item name="android:statusBarColor">@color/status_red</item>
        <!-- actionBar颜色 -->
        <item name="android:colorPrimary">@color/action_red</item>
        <!-- 背景颜色 -->
        <item name="android:windowBackground">@color/window_bg_red</item>
        <!-- 底部栏颜色 -->
        <item name="android:navigationBarColor">@color/navigation_red</item>
        <!-- ListView的分割线颜色,switch滑动区域色-->
        <item name="android:colorForeground">@color/fg_red</item>
        <!-- popMenu的背景色 -->
        <item name="android:colorBackground">@color/bg_red</item>
        <!-- 控件默认颜色 ,效果会被colorControlActivated取代  -->
        <item name="android:colorAccent">@color/control_activated_red</item>
        <!-- 控件默认时颜色  -->
        <item name="android:colorControlNormal">@color/control_normal_red</item>
        <!-- 控件按压时颜色,会影响水波纹效果,继承自colorAccent  -->
        <item name="android:colorControlHighlight">@color/control_highlight_red</item>
        <!-- 控件选中时颜色 -->
        <item name="android:colorControlActivated">@color/control_activated_red</item>
        <!-- Button的默认背景 -->
        <item name="android:colorButtonNormal">@color/button_normal_red</item>
        <!-- Button,textView的文字颜色  -->
        <item name="android:textColor">@color/white_text</item>
        <!-- RadioButton checkbox等控件的文字 -->
        <item name="android:textColorPrimaryDisableOnly">@color/white_text</item>
        <!-- actionBar的标题文字颜色 -->
        <item name="android:textColorPrimary">@color/white_text</item>
    </style>

参考文章:

http://blog.csdn.net/jack__frost/article/details/51998863

http://www.2cto.com/kf/201412/362272.html

http://blog.csdn.net/wjc295/article/details/54347807

http://www.cnblogs.com/Jude95/p/4369816.html

http://blog.csdn.net/zl18603543572/article/details/49754933

http://www.aoaoyi.com/archives/623.html

作者:tuke_tuke 发表于2017/6/13 20:14:07 原文链接
阅读:24 评论:0 查看评论

Viewing all articles
Browse latest Browse all 5930

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>