Androidアプリにダークテーマを含める方法

開発者にとって、Androidアプリの作成は簡単なプロセスです。魅力的なUIを設計することは、実際には難しいことです。そのため、シンプルでありながら魅力的なUIを作成するためのインスピレーションが必要な開発者向けに、ガイド「吸わないAndroidアプリUIを設計する方法」を作成しました。そのガイドでは、アプリにダーク/ナイトモードのテーマを追加することについて簡単に説明しました。このガイドでは、そのテーマについて説明します。

ダーク/ナイトモードのテーマをアプリに追加することは、ユーザーにとって優れたオプションになる可能性があります。これにより、バッテリーの寿命が節約され、夜間の目にははるかに簡単になります。黒のテキストの白の背景、またはUIの「明るい」色の任意の組み合わせは、特に夜間に目にストレスを与えます。したがって、明るいテキストで暗い背景はストレスが少なく、目に害がありません。そのため、Facebookはまだ1つを約束した後、まだ公開していませんが、暗いテーマを含む多くの人気のあるアプリが開始されました–YouTubeとReddit 5月。

切り替え可能なダークモードをAndroidアプリに簡単に追加したい場合は、このAppualsガイドに従って、問題が発生した場合はコメントしてください。

XML属性の作成

まず、テーマを処理するXML属性ファイルを作成する必要があります。これは、2つの異なるテーマのAPKに2セットのリソースを含めて、APKサイズを肥大化させるよりもはるかに優れています。これは、AndroidがこのXMLを介して属性の色をネイティブに変更できるためです。

そのため、アプリの「resources」フォルダーに、 attrs.xmlという名前のファイルを作成します。 次の行を追加します（これらはスタイル可能な属性です）：

<declare-styleable name="CTAppTheme">
      <attr name=”primaryTextColor” format=”color”/> 
      <attr name=”secondaryTextColor” format=”color”/> 
      <attr name=”dividerColor” format=”color”/>
      <attr name=”backgroundCardColor” format=”color”/> 
      <attr name=”iconPlaceholder” format=”integer”/>
</declare-styleable>

Lollipop以前は、ドローアブルの属性を指定できなかったため、ドローアブルのリソースIDを指定する必要がありましたが、現在はそうではありません。

スタイルの追加

これを機能させるには、同じベースを共有する2つの別個のスタイルを作成する必要があります。 1つ目は明らかに主要な「明るい」テーマであり、2つ目は「暗い」テーマです。

<!-- Light base activity theme -->
<style name="ActivityTheme.Primary.Base.Light" parent="Theme.AppCompat.NoActionBar">
    <item name="primaryTextColor">#F4F4F6</item>
    <item name="secondaryTextColor">#96F4F4F6</item>
    <item name="backgroundCardColor">#FFFF</item>
    <item name="dividerColor">#F2F2F3</item>
    <item name="iconPlaceholder">@drawable/i_light_plholder</item>
</style>

<!-- Dark base activity theme -->
<style name="ActivityTheme.Primary.Base.Dark"    parent="Theme.AppCompat.NoActionBar">
    <item name="primaryTextColor">#33343B/item>
    <item name="secondaryTextColor">#8033343B</item>
    <item name="backgroundCardColor">#28292e</item>
    <item name="dividerColor">#F2F2F3</item>
    <item name="iconPlaceholder">@drawable/i_dark_pholder</item>
</style>

特定のアクティビティの実際のスタイルは次のとおりです。

<!-- Specific Feed activity theme -->
<style name="FeedActivityThemeLight" parent="ActivityTheme.Primary.Base.Light">
    <item name="android:windowBackground">#F4F4F6</item>
</style>

<style name="FeedActivityThemeDark" parent="ActivityTheme.Primary.Base.Dark">
    <item name="android:windowBackground">#33343B</item>
</style>

これらのテーマの1つをアプリのアクティビティのマニフェストに指定する必要があります。この場合はFeedActivityです。

ビューのスタイル設定

ビューのスタイル設定の例を次に示します。この例では、「ページが見つかりません」リダイレクトエラーが発生します。

<ImageView
           android:id="@+id/placeHolderAssetImageView"
           android:layout_width="100dp"
           android:layout_height="100dp"
           android:src="?attr/iconPlaceholder"
           android:layout_marginBottom="8dp" />

       <TextView
           android:id="@+id/placeHolderTitleTextView"
           android:text="Page not found."
           android:textSize="16dp"
           android:textColor="?attr/primaryTextColor"
           android:layout_margin="16dp" />

動的テーマ切り替えを有効にする方法

動的テーマ切り替えを有効にするための最良かつ最も効率的な方法は、シングルトンパターンを使用して設定をアプリケーションインスタンスに格納するために使用されるSharedPreference値をロードすることです。これは、各アクティビティの開始時にそれを行う必要がないことを意味します。

public class App extends Application {
 public static final String TAG = "App";

private boolean isNightModeEnabled = false;

@Override
 public void onCreate() {
 super.onCreate();

// We load the Night Mode state here
 SharedPreferences mPrefs =  PreferenceManager.getDefaultSharedPreferences(this);
 this.isNightModeEnabled = mPrefs.getBoolean(“NIGHT_MODE”, false);
 }

public boolean isNightModeEnabled() {
 return isNightModeEnabled;
 }

public void setIsNightModeEnabled(boolean isNightModeEnabled) {
 this.isNightModeEnabled = isNightModeEnabled;
 }
}

このインスタンスは何よりも先に起動されるため、 isNightModeEnabled（）を呼び出すことができます。 アプリを開いた後は、アプリに属する​​すべてのアクティビティで、いつでもブール値を使用できます。

public final class FeedActivity extends AppCompatActivity {
 private final static String TAG = “FeedActivity”;

@Override
 protected void onCreate(Bundle savedInstanceState) {
    if (MyApplication.getInstance().isNightModeEnabled()) {
       setTheme(R.style.FeedActivityThemeDark);
    }
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_feed);
 }
}

ただし、マニフェストファイルで指定されているテーマとは異なるテーマを適用する場合は、前に行う必要があります。 親のonCreate（）メソッドを呼び出します。

AppCompatを使用した状態の設定

AppCompatはさまざまな用途に非常に役立ちます。この場合は、AppCompatを使用してモード状態を設定します。これは、キャッシュされた状態を作成するためにアプリインスタンスを使用する必要がなくなったことを意味します。これにより、アプリのキャッシュの肥大化が削減されます（わずかなマージンですが 。

AppCompatDelegate
.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_YES);

ここでは、次のいずれかを使用できます：

• AppCompatDelegate.MODE_NIGHT_YES
  AppCompatDelegate.MODE_NIGHT_NO
  AppCompatDelegate.MODE_NIGHT_AUTO

状態の取得

AppCompatDelegate.getDefaultNightMode();

public final class FeedActivity extends AppCompatActivity {
 private final static String TAG = “FeedActivity”;

@Override
 protected void onCreate(Bundle savedInstanceState) {
    if (AppCompatDelegate.getDefaultNightMode()
    ==AppCompatDelegate.MODE_NIGHT_YES) {
       setTheme(R.style.FeedActivityThemeDark);
    }
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_feed);
 }
}

それはそれであるはずです-あなたはあなたの好みに合わせて値をカスタマイズして微調整し続けることができます、しかしこのガイドはあなたがネイティブを含めることを始めるための素晴らしい入門書です Androidアプリのダークテーマ。