【Google官方译文】Styles and Themes

来源:互联网 发布:version mac 破解版 编辑:程序博客网 时间:2024/05/01 05:29

转: 【Google官方译文】Styles and Themes


【译文开始】

style 是指定view或window外观和格式的属性集合。它可以定义诸如高度、间距、字体颜色、字体大小、背景色等更多属性。style被定义在与layout分开的xml资源文件中。

例如,通过使用style,你可以使用如下的layout文件:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">TextView</span>    <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:layout_width</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"fill_parent"</span>    <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:layout_height</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"wrap_content"</span>    <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:textColor</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"#00FF00"</span>    <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:typeface</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"monospace"</span>    <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:text</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"@string/hello"</span> /></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li></ul>

然后将其转变为下面这样:

<code class="hljs perl has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><TextView    style=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">@style</span>/CodeFont"</span>    android:text=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">@string</span>/hello"</span> /></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

所有和style相关的属性都被移除并被放入了名为CodeFont的style中,该style通过style属性进行了应用。稍后你将看到该style的定义。

theme是应用于整个Activity或application的style,而不是单个View(如上面的例子)。当style被当成theme使用时,该Activity或application中的每个View将使用每一个它所支持的style属性。例如:可以将相同的CodeFont style应用于一个Activity,那么Activity中的所有text都会有绿色的monospace字体。

定义 Styles

要创建style集合,将一个XML文件保存在工程目录res/values/下。XML文件的名字可以随意,但它必须使用xml扩展名并保存在res/values/文件夹。

XML文件的根节点必须是<resources>

对于每个要创建的style,添加一个<style>节点,它的name唯一指定了该style(该属性是必须的)。然后为style的每个属性添加一个<item>标签,它的name定义了属性,其后紧随一个value(该属性是必须的)。<item>的value可以是字符串、十六进制颜色、另一个资源类型的引用或者其他依赖于style属性的value。下面的例子展示了只有单个style的文件:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><span class="hljs-pi" style="color: rgb(0, 102, 102); box-sizing: border-box;"><?xml version="1.0" encoding="utf-8"?></span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">resources</span>></span>    <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"CodeFont"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">parent</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"@android:style/TextAppearance.Medium"</span>></span><span class="css" style="box-sizing: border-box;">        <<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span> <span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">name</span>="<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">android</span><span class="hljs-pseudo" style="color: rgb(0, 0, 0); box-sizing: border-box;">:layout_width"</span>><span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">fill_parent</span></<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span>>        <<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span> <span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">name</span>="<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">android</span><span class="hljs-pseudo" style="color: rgb(0, 0, 0); box-sizing: border-box;">:layout_height"</span>><span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">wrap_content</span></<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span>>        <<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span> <span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">name</span>="<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">android</span><span class="hljs-pseudo" style="color: rgb(0, 0, 0); box-sizing: border-box;">:textColor"</span>><span class="hljs-id" style="box-sizing: border-box; color: rgb(155, 112, 63);">#00FF00</span></<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span>>        <<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span> <span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">name</span>="<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">android</span><span class="hljs-pseudo" style="color: rgb(0, 0, 0); box-sizing: border-box;">:typeface"</span>><span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">monospace</span></<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span>>    </span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span>></span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">resources</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li></ul>

<resources>下的每个子元素在编译期将转化为应用资源对象,通过<style>name属性的value可以引用它们。该style例子可以用@style/CodeFont在XML布局中引用(如上面的介绍)。

<style>中的parent属性是可选的,它指定了该style应该继承属性的另一个style资源ID。如果你想的话,可以重写继承的style属性。

谨记,你想以theme形式用在Activity或application上的style和用在View上的style是完全一样在XML中定义的。一个style,比方说上述的style,能以style的形式用于单个View或以them的形式用于整个Activity或application。后续将讨论怎样将style用于单个View上或者作为applicaition theme。

继承

<style>中的parent属性可让你的style指定一个继承其属性的style。你可以从现有的style继承属性,只定义那些你想修改或增加的属性。可以从自己创建的styles继承,也可以选择系统自带的(继承系统自带style的信息请看下面)。例如,你可以继承Android默认的text appearance并修改它:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"GreenText"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">parent</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"@android:style/TextAppearance"</span>></span><span class="css" style="box-sizing: border-box;">        <<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span> <span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">name</span>="<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">android</span><span class="hljs-pseudo" style="color: rgb(0, 0, 0); box-sizing: border-box;">:textColor"</span>><span class="hljs-id" style="box-sizing: border-box; color: rgb(155, 112, 63);">#00FF00</span></<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span>>    </span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

如果你想继承自己定义的style,可以不使用parent属性。作为替代,仅仅将被继承的style的name作为新style的name的前缀。例如,要创建继承自上述CodeFont的新style,但要使颜色变红,编辑如下的新style:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;">  <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"CodeFont.Red"</span>></span><span class="css" style="box-sizing: border-box;">        <<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span> <span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">name</span>="<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">android</span><span class="hljs-pseudo" style="color: rgb(0, 0, 0); box-sizing: border-box;">:textColor"</span>><span class="hljs-id" style="box-sizing: border-box; color: rgb(155, 112, 63);">#FF0000</span></<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span>>    </span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

注意,<style>标签中没有parent属性,因为name属性以CodeFont这个style的name开始(CodeFontstyle已经被创建),这个新style继承了CodeFont的所有属性。然后重写android:textColor属性将text变红。你可以用@style/CodeFont.Red来引用这一新style。

通过点号将names链接,你可以随意地继续继承。例如,你可以继承CodeFont.Red使其成为bigger,就像这样:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"> <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"CodeFont.Red.Big"</span>></span><span class="css" style="box-sizing: border-box;">        <<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span> <span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">name</span>="<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">android</span><span class="hljs-pseudo" style="color: rgb(0, 0, 0); box-sizing: border-box;">:textSize"</span>>30<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">sp</span></<span class="hljs-tag" style="color: rgb(0, 0, 0); box-sizing: border-box;">item</span>>    </span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

这样就同时继承了CodeFontCodeFont.Red两个styles,然后增加了android:textSize属性。

注意: 通过链接names来继承这一技术只适用于自己定义的styles,系统自带的styles不支持这么做。要引用系统自带的style,如TextAppearance,必须使用parent属性。

Style 属性

既然你已经明白了style如何定义,你需要了解<item>节点可以定义哪些style属性。有些可能你已经知道,如layout_widthtextColor。当然,你可以使用更多的style属性。

寻找特定View属性的最佳之处就是对应的类参考,那儿列出了所有支持的XML属性。例如,所有列在TextView 的XML attributes表格中的属性可用于定义TextView style(或其子类)。参考中有一个属性android:inputType,所以你可以将其放入一个<EditText>节点,就像这样:

<code class="hljs r has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><EditText    android:inputType=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"number"</span>    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">...</span> /></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

作为替代,你可以为EditText新建一个包含这个属性的style:

<code class="hljs r has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><style name=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"Numbers"</span>>  <item name=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"android:inputType"</span>>number</item>  <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">...</span></style></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li></ul>

然后布局文件就可以实现这一style:

<code class="hljs r has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><EditText    style=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"@style/Numbers"</span>    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">...</span> /></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

这个简单的例子看起来意味着更多的工作,但当你增加更多的属性并将这个style复用在多处时,回报将是巨大的。

所有可用style属性的参考,可以查看R.attr。记住,不是所有的View对象都接受相同的style属性,所以一般应参考特定View支持的属性。但是,如果一个View不支持应用于其上style中的所有属性,那这个View只会应用那些它支持的属性,其它的属性会被自动忽略。

有些style属性是所有View元素都不支持的,只能当作theme使用。这些style属性应用于整个window而非任一种View。如用于theme的style属性:隐藏标题栏、隐藏状态栏、改变window背景色。这些style属性不属于任一View对象。要知道这些theme专用的style属性,查看R.attr中那些以window开头的属性。例如,windowNoTitlewindowBackground是只在style当做theme用于Activity或application时才起作用的style属性。下一节介绍将style用作theme。 
注意 :别忘了在每个<item>元素中对属性名加上android:命名空间这个前缀。例如: 
<item name="android:inputType">

将Styles和Themes应用于UI

有两种设置style的方法:

  • 对于单个View,通过在布局XML文件中的View节点上增加style属性。
  • 或者,对于整个Activity或application,通过在Android manifest的<activity><application>节点上增加android:theme属性。

当你在布局中对单个View应用style,该style中定义的属性只用于该View。如果style被用于一个ViewGroup,子View不会继承这些style属性,只有你直接应用style的节点会发生作用。但是,你可以将style用作theme,这样就能作用于所有View节点。

为了将style用作theme,你必须在Android manifest中将该style应用于一个Activity或application。这么做之后,该Activity或application中的每个View都会应用它所支持的属性。例如,如果将之前例子中的CodeFont style用于一个Activity,那所有支持该text style属性的View节点都会应用这些属性。不支持这些属性的View则会忽略这些属性。如果一个View只支持其中的部分属性,那它只会应用那些属性。

将style用于View

下面展示了如何在布局中将style用于一个View:

<code class="hljs perl has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><TextView    style=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">@style</span>/CodeFont"</span>    android:text=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">@string</span>/hello"</span> /></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

现在这个TextView会应用名为CodeFont 的style。(见上面 定义属性 中的例子)

注意:style属性不需要android:命名空间这一前缀。

将theme用于一个Activity或application

要将一个theme用在应用的所有activities 中,打开AndroidManifest.xml文件并在<application>标签中加入指定style名的android:theme属性。例如:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">application</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:theme</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"@style/CustomTheme"</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li></ul>

如果你只想在一个Activity中应用theme,就在相应的<activity>标签中增加android:theme属性。

正如Android提供了其他自带资源,你也可以使用许多自带的themes,而不用自己写。例如,你可以使用Dialog theme使你的Activity像一个dialog box:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">activity</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:theme</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"@android:style/Theme.Dialog"</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li></ul>

或者,你想让背景透明,可以使用Translucent theme:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">activity</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:theme</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"@android:style/Theme.Translucent"</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li></ul>

如果你喜欢一个theme,但想改变它,只需将该theme添加为你定制theme的parent。例如,你可以改变传统的light theme以使用自己的颜色,就像这样:

<code class="hljs applescript has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><color <span class="hljs-property" style="box-sizing: border-box;">name</span>=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"custom_theme_color"</span>><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">#b0b0ff</color></span><style <span class="hljs-property" style="box-sizing: border-box;">name</span>=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"CustomTheme"</span> parent=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"android:Theme.Light"</span>>    <<span class="hljs-property" style="box-sizing: border-box;">item</span> <span class="hljs-property" style="box-sizing: border-box;">name</span>=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"android:windowBackground"</span>>@color/custom_theme_color</<span class="hljs-property" style="box-sizing: border-box;">item</span>>    <<span class="hljs-property" style="box-sizing: border-box;">item</span> <span class="hljs-property" style="box-sizing: border-box;">name</span>=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"android:colorBackground"</span>>@color/custom_theme_color</<span class="hljs-property" style="box-sizing: border-box;">item</span>></style></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li></ul>

现在可以在Android Manifest中使用CustomTheme代替Theme.Light了:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">activity</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">android:theme</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"@style/CustomTheme"</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li></ul>

根据系统版本选择theme

较新的Android版本上有额外的themes,你可能想在这些较新的系统上使用这些themes,同时兼容旧系统。要做到这一点,你可以定制一个theme,它能根据系统版本使用资源选择来切换不同parent themes

例如,这里有一个定制theme的声明,它很简单,只是标准系统中的默认light theme。它将出现在res/values下的XML文件中( 通常是res/values/styles.xml):

<code class="hljs r has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><style name=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"LightThemeSelector"</span> parent=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"android:Theme.Light"</span>>    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">...</span></style></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

当运行在Android 3.0(API Level 11)或更高版本上时,如果想让这个theme使用较新的holographic theme,可以在res/values-v11下的XML文件中放置该theme的一个替代声明,它要使用holographic theme作为parent theme

<code class="hljs r has-numbering" style="display: block; padding: 0px; background: transparent; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal;"><style name=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"LightThemeSelector"</span> parent=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"android:Theme.Holo.Light"</span>>    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">...</span></style></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right: 1px solid rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li></ul>

现在像别的theme一样使用它,当运行在Android 3.0或更高版本上时,应用会自动切换到holographic theme

你可以在 R.styleable.Theme找到能用在themes中的标准属性清单。

更多关于提供可选资源 的信息,例如基于系统版本或其他设备配置的themes和layouts,请查看 Providing Resources 文档。

使用系统Styles和Themes

Android系统提供了大量你可应用的styles和themes。你可以在R.style类中找到所有可用styles的参考。要使用其中的styles,用点号替代style名称中的下划线。例如,可以用"@android:style/Theme.NoTitleBar"来使用Theme_NoTitleBartheme。

但是,R.style没有很好地文档化,也没有充分地描述这些styles,所以查看这些styles和themes的真实源码会对它们能提供的style属性有更好的理解。需要Android styles and themes的更棒的参考,请查看下面的源码:

  • Android Styles (styles.xml)
  • Android Themes (themes.xml)

这些文档可以通过示例来帮助你学习。例如,在Android themes源码中,你可以看到<style name="Theme.Dialog">的声明。在这个声明中,你能找到被系统用来形成dialogs的所有属性。

更多关于XML文件中styles and themes语法的信息,请查看Style Resource 文档。

要查看那些你能用于定义style或theme的style属性(如"windowBackground""textAppearance"),请查看R.attr或你正为其创建style的各自View类。

【译文结束】


0 0
原创粉丝点击