初识Style和Theme

Posted 2021-01-10 slyfox

初识Style和Theme

学习自

• http://www.jcodecraeer.com/a/basictutorial/2016/0812/6533.html

认识Style

大家还记得如何设置一个 无限循环的或者 具有具体进度的ProgressBar吗？

<ProgressBar
    style="@style/Base.Widget.AppCompat.ProgressBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp" />

显示效果

<ProgressBar
    style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"
    android:progress="50" />

显示效果

那为什么同样都是一个 ProgressBar 控件，但是为什么会有如此大相庭径的显示效果呢？请注意这两种的显示效果的 Style 是不相同的。

我们看一下这两个Style的源码:

<style name="Base.Widget.AppCompat.ProgressBar" parent="android:Widget.ProgressBar">
    <item name="android:minWidth">@dimen/abc_action_bar_progress_bar_size</item>
    <item name="android:maxWidth">@dimen/abc_action_bar_progress_bar_size</item>
    <item name="android:minHeight">@dimen/abc_action_bar_progress_bar_size</item>
    <item name="android:maxHeight">@dimen/abc_action_bar_progress_bar_size</item>
</style>
<!-- Base.Widget.AppCompat.ProgressBar 继承自 android:Widget.ProgressBar-->
<!-- android:Widget.ProgressBar 的源码-->

<style name="Widget.ProgressBar">
    <item name="indeterminateOnly">true</item>
    <item name="indeterminateDrawable">@drawable/progress_medium_white</item>
    <item name="indeterminateBehavior">repeat</item>
    <item name="indeterminateDuration">3500</item>
    <item name="minWidth">48dip</item>
    <item name="maxWidth">48dip</item>
    <item name="minHeight">48dip</item>
    <item name="maxHeight">48dip</item>
    <item name="mirrorForRtl">false</item>
</style>

从上面的Style中我们可以发现，这不就是View的属性吗。看到这里，我们应该就对Style有一个了解了——Style 就是对View的属性的抽取，避免了繁琐的设置属性的机械性工作，并且也更易于修改，避免了冗余的代码。

自定义Style

在一个Android项目中，使用统一的样式的Button是非常重要的，所以Button的一些通用的属性我们可以抽取成为 Style。直接自 res/values/styles.xml 文件中添加。

<!--
  声明一个Button的Style
  一个粉色的背景
  白色的字体
-->
<style name="MyButton">
    <item name="android:background">#c25454</item>
    <item name="android:textAllCaps">false</item>
    <item name="android:textColor">#FFFFFF</item>
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
</style>

在布局文件中使用它。

<!-- 通过使用style，避免了繁琐的属性的声明 -->
<Button
    style="@style/MyButton"
    android:text="Button" />

Style的继承

Style同样是可以进行继承的。

<style name="MyButton">
    <item name="android:background">#c25454</item>
    <item name="android:textAllCaps">false</item>
    <item name="android:textColor">#FFFFFF</item>
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
</style>
<!--其他属性继承自MyButton，但是自己又重新定义了background的值-->
<style name="MyButton.Blue" parent="MyButton">
    <item name="android:background">#90206dcc</item>
</style>

Theme

Style是为View设置的，那么有没有这么一种“Style”是为一个Activity乃至为整个系统设置一个 Style 呢？ 当然是有这么一个东西了，他就是 Theme。

Theme可以应用于 Activity和Application(整个应用)，但是为了保证真个APP的界面的风格是统一的，正常情况下并不会为Activity来单独地设置一个Theme，往往都是为整个Application来设置Theme。

为Application和Activity设置Theme

<!-- Theme属性设置整个Application的Theme -->
<application
    android:allowBackup="true"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name"
    android:roundIcon="@mipmap/ic_launcher_round"
    android:supportsRtl="true"
    android:theme="@style/AppTheme">
    <!-- Theme属性设置属于该Activity的Theme -->
    <activity
        android:name=".MainActivity"
        android:theme="@style/Theme.AppCompat.NoActionBar">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>

</application>

@style/AppTheme

Application被设置的一个默认的Theme APPTheme 位于 src/values/styles.xml

<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>

可以看出来 Theme 也是一个Style，我们可以同改变AppTheme的相关属性来影响Application的显示效果。

Theme Editor

当然，通过写 xml 的代码来自定义个Theme真是太痛苦了。幸好AndroidStudio为我们提供了Theme的GUI的设计器。

总结

根据上面的选项我们就可以比较轻松的修改我们的Theme了，当然如果想要让Theme更好看一些，还是得需要参考一些设计的比较好的作品，或者说采用一些经典的配色，本文就到此结束了，在下一篇的文章呢，将会带学习一下Android换肤的功能。