Help us understand the problem. What is going on with this article?

動的なテーマで、スタイリングを楽にする(メモ)

More than 3 years have passed since last update.

問題

  • UX: 午前中で、Theme.AppCompat.Lightを利用し、しかし、寝る前に目に優しく利用したいからTheme.AppCompatに切り替えたい。

    • 今回は、テーマとともに、textColorを動的に切り替える
  • 開発者側:(あくまでも自分が今まで)よくやっているのがこうなる

style.xml
<resources>

    <!-- Dark theme -->
    <style name="TextAppearance.MyDarkTheme.Small" parent="TextAppearance.AppCompat.Small">
        <item name="android:textColor">@color/text_color_dark</item>
    </style>

    <!-- Light theme -->
    <style name="TextAppearance.MyLightTheme.Small" parent="TextAppearance.AppCompat.Small">
        <item name="android:textColor">@color/text_color_light</item>
    </style>

</resources>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <!-- Default theme is Light -->
    <TextView 
        ...
        android:textAppearance="@style/TextAppearance.MyLightTheme.Small"
    />

</RelativeLayout>

MainActivity.java
// onCreate()
// 1. getTheme value from Preference
// 2. call setTheme for current Activity
// 3. change TextAppearance on specific TextViews <-- ここでテキストのスタイリングを切り替える
// ...

解決

style.xml
<resources>

    <!-- BEGIN: Custom attributes -->
    <attr name="myCustomTextColor" format="color"/>
    <!-- END: Custom attributes -->

    <!-- Dark theme -->
    <!-- Base application theme. -->
    <style name="MyTheme.Dark" parent="Theme.AppCompat">
        <item name="myCustomTextColor">@color/text_color_dark</item>
    </style>

    <!-- Light theme -->
    <style name="MyTheme.Light" parent="Theme.AppCompat.Light">
        <item name="myCustomTextColor">@color/text_color_light</item>
    </style>

    <!-- 一つのスタイリングだけでオッケー -->
    <style name="TextAppearance.MyTheme.Small" parent="TextAppearance.AppCompat.Small">
        <item name="android:textColor">?attr/myCustomTextColor</item>
    </style>

</resources>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <!-- Default theme is Light -->
    <TextView 
        ...
        android:textAppearance="@style/TextAppearance.MyTheme.Small"
    />

</RelativeLayout>

終わりに

その他に、カスタマイズなものがあれば同じく〜。2つ以上のテーマをサポートしたい時に、楽

eneim
the simple, the best
http://ene.im
givery
Giveryは社会を豊かにする人々のための成長エコシステムを創造する「成長」支援企業です。ITとリアルの両軸で事業を展開し、お客様・ユーザーの皆様・社員・社会の成長を全力で応援します。
https://givery.co.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away