第十四章：样式(Style)和主题(Theme)

简介

Android的样式(Style)和主题(Theme)文件就好比WEB开发中的CSS一样，可以实现UI界面的风格统一管理，这和Windows平台的XAML格式(Silverlight、WPF)类似。比如我们遇到特殊的节日我们只需变更我们的Style和Theme就可以切换一种新的Style和Theme。还有现有的一些应用提供我们可以自定义UI风格，就是应用的这个原理。Android的主题样式文件存储在res\values目录下，如res\values\styles.xml。

样式(Style)

Style我们可以应用到单个组件或者一类组件，比如我们可以设置组件的字体、颜色等。

下面的文件就是Android SDK（Version16）提供的一个Style文件片段（详细文件在：\android-sdk\platforms\android-16\data\res\values\styles.xml），如下所示我们可以看到系统的各个控件的默认的样式风格

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Global Theme Styles -->
    <eat-comment />

    <style name="WindowTitleBackground">
        <item name="android:background">@android:drawable/title_bar</item>
    </style>

    <style name="WindowTitle">
        <item name="android:singleLine">true</item>
        <item name="android:textAppearance">@style/TextAppearance.WindowTitle</item>
        <item name="android:shadowColor">#BB000000</item>
        <item name="android:shadowRadius">2.75</item>
    </style>

    <style name="Widget.EditText">
        <item name="android:focusable">true</item>
        <item name="android:focusableInTouchMode">true</item>
        <item name="android:clickable">true</item>
        <item name="android:background">?android:attr/editTextBackground</item>
        <item name="android:textAppearance">?android:attr/textAppearanceMediumInverse</item>
        <item name="android:textColor">?android:attr/editTextColor</item>
        <item name="android:gravity">center_vertical</item>
    </style>

    <style name="Widget.ExpandableListView" parent="Widget.ListView">
        <item name="android:groupIndicator">@android:drawable/expander_group</item>
        <item name="android:indicatorLeft">?android:attr/expandableListPreferredItemIndicatorLeft</item>
        <item name="android:indicatorRight">?android:attr/expandableListPreferredItemIndicatorRight</item>
        <item name="android:childDivider">@android:drawable/divider_horizontal_dark_opaque</item>
    </style>

    <style name="Widget.ImageButton">
        <item name="android:focusable">true</item>
        <item name="android:clickable">true</item>
        <item name="android:scaleType">center</item>
        <item name="android:background">@android:drawable/btn_default</item>
    </style>

    <style name="Widget.WebView">
        <item name="android:focusable">true</item>
        <item name="android:focusableInTouchMode">true</item>
        <item name="android:scrollbars">horizontal|vertical</item>
    </style>

    <style name="Widget.Gallery">
        <item name="android:fadingEdge">none</item>
        <item name="android:gravity">center_vertical</item>
        <item name="android:spacing">-20dip</item>
        <item name="android:unselectedAlpha">0.85</item>
    </style>

    <style name="Widget.PopupWindow">
        <item name="android:popupBackground">@android:drawable/editbox_dropdown_background_dark</item>
        <item name="android:popupAnimationStyle">@android:style/Animation.PopupWindow</item>
    </style>

    <!-- Default

我们可以看到Style文件的跟元素像其他资源文件一样是：<resources> ，样式文件内部由多个的<style>节点构成，每一个style构成一个样式，样式还可以继承。如下所示，指定了样式名称已经其父样式的名称：

<style name="Widget.ExpandableListView" parent="Widget.ListView">

当然如果子样式定义的属性在父样式中存在，那么子样式将会覆盖父样式。

比如我们可以定义如下的样式：

<?xml version="1.0" encoding="UTF-8"?>
<resources>
    <!-- 定义一个样式，指定字体大小、字体颜色 -->
    <style name="style1">
        <item name="android:textSize">20sp</item>
        <item name="android:textColor">#00d</item>
    </style>
    <!-- 定义一个样式，继承前一个颜色 -->
    <style name="style2" parent="@style/style1">
        <item name="android:background">#ee6</item>
        <item name="android:padding">8dp</item>
        <!-- 覆盖父样式中指定的属性 -->
        <item name="android:textColor">#000</item>
    </style>
</resources>

我们可以在我们的layout文件中如下使用：[packagename.]style.file_name

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<!-- 指定使用style1的样式 -->
<EditText
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/style1"
    style="@style/style1"
    />
<!-- 指定使用style2的样式 -->
<EditText
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/style2"
    style="@style/style2"
    />
</LinearLayout>

主题(Theme)

Theme一般用于整个应用或者一些特定的Activity。Theme一般用来设置应用的或者窗体的外观样式，比如应用背景，应用边框及标题等。

下面的代码片段是Android SDK自带的默认主题（详细文件在：\android-sdk\platforms\android-16\data\res\values\themes_device_defaults.xml）：

<?xml version="1.0" encoding="UTF-8"?>
    <style name="Theme.DeviceDefault" parent="Theme.Holo" >
        <!-- Text styles -->
        <item name="textAppearance">@android:style/TextAppearance.DeviceDefault</item>
        <item name="textAppearanceInverse">@android:style/TextAppearance.DeviceDefault.Inverse</item>

        <item name="textAppearanceLarge">@android:style/TextAppearance.DeviceDefault.Large</item>
        <item name="textAppearanceMedium">@android:style/TextAppearance.DeviceDefault.Medium</item>
        <item name="textAppearanceSmall">@android:style/TextAppearance.DeviceDefault.Small</item>
        <item name="textAppearanceLargeInverse">@android:style/TextAppearance.DeviceDefault.Large.Inverse</item>
        <item name="textAppearanceMediumInverse">@android:style/TextAppearance.DeviceDefault.Medium.Inverse</item>
        <item name="textAppearanceSmallInverse">@android:style/TextAppearance.DeviceDefault.Small.Inverse</item>
        <item name="textAppearanceSearchResultTitle">@android:style/TextAppearance.DeviceDefault.SearchResult.Title</item>
        <item name="textAppearanceSearchResultSubtitle">@android:style/TextAppearance.DeviceDefault.SearchResult.Subtitle</item>

        <item name="textAppearanceButton">@android:style/TextAppearance.DeviceDefault.Widget.Button</item>

        <item name="textAppearanceLargePopupMenu">@android:style/TextAppearance.DeviceDefault.Widget.PopupMenu.Large</item>
        <item name="textAppearanceSmallPopupMenu">@android:style/TextAppearance.DeviceDefault.Widget.PopupMenu.Small</item>

        <!-- Button styles -->
        <item name="buttonStyle">@android:style/Widget.DeviceDefault.Button</item>

        <item name="buttonStyleSmall">@android:style/Widget.DeviceDefault.Button.Small</item>
        <item name="buttonStyleInset">@android:style/Widget.DeviceDefault.Button.Inset</item>

        <item name="buttonStyleToggle">@android:style/Widget.DeviceDefault.Button.Toggle</item>
        <item name="switchStyle">@android:style/Widget.DeviceDefault.CompoundButton.Switch</item>

        <item name="borderlessButtonStyle">@android:style/Widget.DeviceDefault.Button.Borderless</item>

        <item name="listSeparatorTextViewStyle">@android:style/Widget.DeviceDefault.TextView.ListSeparator</item>

        <!-- Window attributes -->
        <item name="windowTitleStyle">@android:style/WindowTitle.DeviceDefault</item>
        <item name="windowTitleBackgroundStyle">@android:style/WindowTitleBackground.DeviceDefault</item>
        <item name="android:windowAnimationStyle">@android:style/Animation.DeviceDefault.Activity</item>

        <!-- Dialog attributes -->
        <item name="alertDialogStyle">@android:style/AlertDialog.DeviceDefault</item>
        <item name="dialogTheme">@android:style/Theme.DeviceDefault.Dialog</item>
        <item name="alertDialogTheme">@android:style/Theme.DeviceDefault.Dialog.Alert</item></style>

主题和样式的定义方式类似：通过Style来指定并且也支持继承。我们自定义一个主题如下：

<?xml version="1.0" encoding="UTF-8"?>
<resources>
    <style name="CustomrTheme">
        <item name="android:windowNoTitle">true</item>
        <item name="android:windowFullscreen">true</item>
        <item name="android:windowFrame">@drawable/window_border</item>
        <item name="android:windowBackground">@drawable/star</item>
    </style>
</resources>

我们可以在代码中来设置一个Activity的主题,如下粗体代码行。

public class MainActivity extends Activity
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        setTheme(R.style.CustomerTheme)
    }
}

我们通过应用的的配置文件(AndroidManifest.xml)中来指定主题，而不是通过代码行来指定。

如果要指定一个主题应用与整个App，我们可以设置Application节点的android:theme属性：

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="org.jeriffe.app"android:versionCode="1" android:versionName="1.0">
    <application android:icon="@drawable/icon"
         android:label="@string/app_name"
        android:theme="@style/CustomerTheme">
        <activity android:name=".XXXXX">
        </activity>
    </application>
</manifest>

如果我们想指定主题应用与具体的Activity我们只需要设置activity的android:theme属性：

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="org.jeriffe.app"  android:versionCode="1"android:versionName="1.0">
    <application android:icon="@drawable/icon"
         android:label="@string/app_name">
        <activity android:name=".XXXX"
                  android:theme="@style/CustomerTheme">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

结束语

我们简单的介绍了Style和Theme，如果您有WEB开发或者WPhone或者WPF开发经验，那么您会很好的理解Style和Theme。

时间： 2024-12-30 04:42:53

第十四章：样式(Style)和主题(Theme)的相关文章

Android 样式 (style) 和主题(theme)

转载:https://gold.xitu.io/post/58441c48c59e0d0056a30bc2 样式和主题 样式是指为 View 或窗口指定外观和格式的属性集合.样式可以指定高度.填充.字体颜色.字号.背景色等许多属性. 样式是在与指定布局的 XML 不同的 XML 资源中进行定义. Android 中的样式与网页设计中层叠样式表的原理类似 - 您可以通过它将设计与内容分离. 例如,通过使用样式,您可以将以下布局 XML: <TextView android:layout_width

android的样式(style)与主题(theme)

Android上的Style分为了两个方面: 1,Theme是针对窗体级别的,改变窗体样式: 2,Style是针对窗体元素级别的,改变指定控件或者Layout的样式. Android系统的themes.xml和style.xml(位于系统源代码frameworks\base\core\res\res\values\)包含了很多系统定义好的style,建议在里面挑个合适的,然后再继承修改. 风格是一个包含一种或者多种格式化属性的集合,你可以将其用为一个单位用在布局XML单个元素当中.比如,你可以定

CSS3秘笈复习：十三章&amp;十四章&amp;十五章&amp;十六章&amp;十七章

第十三章 1.在使用浮动时,源代码的顺序非常重要.浮动元素的HTML必须处在要包围它的元素的HTML之前. 2.清楚浮动: (1).在外围div的底部添加一个清除元素:clear属性可以防止元素包围浮动元素.关键字:left.right或both. (2).浮动外围元素:让包含浮动元素的<div>也浮动.选择这种方法一定要在浮动容器后面的任何元素中添加一个clear属性,确保浮动元素落到容器的下方. (3).利用overflow : hidden.另一种常见的方法是在外围的样式中添加以下属性:

【WPF学习】第三十六章 样式基础

原文:[WPF学习]第三十六章 样式基础 前面三章介绍了WPF资源系统,使用资源可在一个地方定义对象而在整个标记中重用他们.尽管可使用资源存储各种对象,但使用资源最常见的原因之一是通过他们的保存样式. 样式是可应用于元素的属性值集合.WPF样式系统与HTML标记中的层叠样式表(Cascading Style Sheet,CSS)标准担当类似的角色.与CSS类似,通过WPF样式可定义通用的格式化特性集合,并且为了保证一致性,在整个应用程序中应用他们.与CSS一样,WPF样式也能够自动工作,指定具体

C和指针 （pointers on C）——第十四章：预处理器

第十四章 预处理器 我跳过了先进的指针主题的章节. 太多的技巧,太学科不适合今天的我.但我真的读,读懂.假设谁读了私下能够交流一下.有的小技巧还是非常有意思. 预处理器这一章的内容.大家肯定都用过.什么#include,#define #ifdef #undef这些,可是绝对用的不多.作为全面了解学C,还是应该都看一看. 预处理器使用方法非常讲究,用不好会失误,用好了会大大加快执行时速度(不是编译速度). 总结: C程序的第一个步骤就是预处理.预处理器共包括下面几个符号: 1.#define 定

Python基础教程（第十四章 网络编程）

本文内容全部出自<Python基础教程>第二版,在此分享自己的学习之路. ______欢迎转载:http://www.cnblogs.com/Marlowes/p/5538341.html______ Created on Marlowes 本章将会给读者展示一些例子,这些例子会使用多种Python的方法编写一个将网络(比如因特网)作为重要组成部分的程序.Python是一个很强大的网络编程工具,这么说有很多原因,首先,Python内有很多针对常见网络协议的库,在库顶部可以获得抽象层,这样就可以

第四十四章

第四十四章1 听罗博士讲述名人的烦恼 名与身孰亲? 名气与身体哪个更重要? 名气固然是有用的,然而不能因此放弃身体. 各位朋友大家好,今天我们接着来聊<道德经>.我们来看看老子老先生带给我们什么样的人生启发了. 今天聊第四十四章,这是新的一章了,这一章实际跟我们的人生真是有很大的关系了,因为我这个音频,除了在我微信公众号刊出之外,还在喜马拉雅播出,喜马拉雅的编辑曾经跟我说:“罗老师您最近能不能讲讲养生的内容啊?”我接下来会给大家讲中医的内容的,但是您说我讲的<道德经>就不是养生吗?

【WPF学习】第四十四章 图画

原文:[WPF学习]第四十四章 图画 通过上一章的学习,Geometry抽象类表示形状或路径.Drawing抽象类扮演了互补的角色,它表示2D图画(Drawing)--换句话说,它包含了显示矢量图像或位图需要的所有信息. 尽管有几类画图类,但只有GeometryDrawing类能使用已经学习过的几何图形.它增加了决定如何绘制图形的画笔和填充细节.可将GeometryDrawing对象视为矢量插图中的形状.例如,可将标准的窗口元文件格式(.wmf)转换成准备插入用户界面的GeometryDrawi

javascript高级程序设计 第十四章--表单脚本

javascript高级程序设计 第十四章--表单脚本 在HTML中表单由<form>元素表示,在js中表单对应的是HTMLFormElement类型,这个类型也有很多属性和方法:取得表单元素的引用还是为它添加id特性,用DOM操作来获取表单元素:提交表单:把<input>或<button>元素的type特性设置为"submit",图像按钮把<input>元素的type特性设置为"image",也可以调用submit(