iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 20
0
Mobile Development

大一之 Android Kotlin 自習心路歷程系列 第 20

[Day 20] Android in Kotlin: Theme 和 Style 的使用分享

  • 分享至 

  • xImage
  •  

Colors

在一個 android 的程式開發中,如果要刻畫面的話,一定會大量使用顏色

res values
為了以後方便使用,我將這次會需要用到的所有顏色先取樣下來,並放在 res -> values -> colors 裡面

colors
看著看著竟覺得有些療癒

以後在改顏色的時候,就可以用上面名字代替,比起 RGB code 還要有辨識性。

Style

是一種能快速使得同一種類型的元件改變外觀的功能。在 app 中,常常使用同一種外觀的按鈕,比如說這個計算機的按鈕。

一樣的東西如果說每次出現都要加入全部的屬性,那就會顯得有些不方便,有了 style 以後,就可以套用上 style 省去一大堆步驟以外,還好分辨元件功能。

<Button
    android:id="@+id/bt_1"
    android:text="@string/_1"
    style="@style/CalculatorButton"/>

只要改 text 跟 id 就好了,剩下背景、大小等的都在 style 裡面寫好了

<style name="CalculatorButton" parent="TextAppearance.AppCompat.Button">
    <item name="android:background">@drawable/ahorro_button_calculator</item>
    <item name="android:textColor">@color/AhorroTextColor</item>
    <item name="android:textSize">20sp</item>
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">62dp</item>
</style>

Theme

Theme 是給對於畫面的主題,他能夠自訂出想要的顏色,而底下的各類元件就使用它的顏色;比如說:在程式內有更改成「黑色主題」,那只要改變 theme,就可以輕鬆改變顏色。

關於顏色可以看看這篇文章,他有對於各種顏色用途做簡單的介紹。文章底下還有個可以輕鬆選擇輔色的功能,滿酷的。
The color system - Material Design

在筆者的暑假作業中,就因為有兩個功能趨近於相同的畫面
main expense

main income

為了能夠使用同一個 class 卻顯示不同的顏色,使用 theme 就對了

他當然不只可以設定顏色,但在這邊我就只有這樣。

android:background="?attr/colorPrimary"

只要你元件的顏色是使用 theme 上的,那麼在切換 fragment 前改 theme 以後

setTheme(R.style.ExpenseTheme)
transaction= supportFragmentManager.beginTransaction().apply {
    replace(R.id.main_fragment, frgExpense)
    commit()
}

顯示的顏色就會依照 theme 做更改,非常方便!


上一篇
[Day 19] Android in Kotlin: Naigation Drawer 分享
下一篇
[Day 21] Android in Kotlin: MVVM 架構分享 —— 簡介
系列文
大一之 Android Kotlin 自習心路歷程30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言