Skip to content

Most visited

Recently visited

navigation

スタイルとテーマ

スタイルはView やウィンドウの外観や書式を指定するプロパティの集合です。スタイルでは、高さやパディング、フォントの色とサイズ、背景の色など、さまざまプロパティが指定できます。 スタイルは、レイアウトを指定する XML とは別の XML リソースで定義されます。

Android のスタイルは、ウェブデザインにおける CSS と同じ原理を基にしています。これらを使うと、コンテンツとデザインを切り離すことが可能になります。

例として、次のレイアウト XML にスタイルを使用します。

<TextView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textColor="#00FF00"
    android:typeface="monospace"
    android:text="@string/hello" />

すると、次のように書くことができます。

<TextView
    style="@style/CodeFont"
    android:text="@string/hello" />

スタイル関連の属性はすべて、レイアウト XML から取り去られて、CodeFont と呼ばれるスタイル定義に入れられ、style 属性によって適用されています。 このスタイルの定義については、次のセクションで説明します。

テーマは、(上の例のように)個々の View ではなく、Activity またはアプリケーション全体に適用されるスタイルのことです。 スタイルがテーマとして適用される場合、アクティビティやアプリケーション内のあらゆる View に、サポートしている個別のスタイル プロパティが適用されます。 たとえば、上と同じ CodeFont スタイルを、あるアクティビティのテーマとして適用することができます。そうすると、そのアクティビティ内のテキストはすべて、緑色の monospace フォントになります。

スタイルを定義する

一連のスタイルを作成するには、プロジェクトの res/values/ ディレクトリ内に XML ファイルを保存します。 XML ファイルの名前は任意ですが、.xml 拡張子を使用し、res/values/ フォルダ内に保存する必要があります。

この XML ファイルのルートノードは、<resources> でなければなりません。

作成したい各スタイルについて、そのファイルに、スタイルを一意に特定する name(この属性は必須)がついた <style> 要素を追加します。そして、スタイルの各プロパティについて、スタイル プロパティとそれに対応する値を宣言する name(この属性は必須)がついた <item> 要素を追加します。 <item> の値には、キーワード文字列、16 進数の色、別のリソース タイプへの参照、あるいはスタイル プロパティに応じた他の値を使用できます。以下は 1 つのスタイルがあるファイルの例です。

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="CodeFont" parent="@android:style/TextAppearance.Medium">
        <item name="android:layout_width">fill_parent</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:textColor">#00FF00</item>
        <item name="android:typeface">monospace</item>
    </style>
</resources>

<resources> 要素のそれぞれの子要素は、コンパイル時にアプリケーション リソース オブジェクトに変換されます。これは <style> 要素の name 属性の値によって参照できます。 この例のスタイルは、XML レイアウトから @style/CodeFont として参照することができます(上のイントロダクションで示したとおりです)。

<style> 要素内の parent 属性は任意です。これは、このスタイルがプロパティを継承する、別のスタイルのリソース ID を指定します。 そのうえで、希望する場合には、継承したスタイル プロパティをオーバーライドできます。

なお、アクティビティやアプリケーション テーマとして使用したいスタイルは、View のスタイルとまったく同じように XML で定義します。 上で定義したようなスタイルは、1 つの View のスタイルとして、あるいはアクティビティやアプリケーション全体のテーマとして適用することができます。 スタイルを 1 つの View に適用する、あるいはアプリケーション テーマとして適用する方法は、後で説明します。

継承

<style> 要素の parent 属性では、スタイル プロパティを継承するスタイルを指定します。これを使って、既存のスタイルからプロパティを継承し、さらに変更や追加を行いたいプロパティのみを定義することが可能です。 以前作成したスタイルや、プラットフォームに組み込まれたスタイルから継承することもできます。 (Android プラットフォームによって定義されたスタイルからの継承についての情報は、下のプラットフォームのスタイルとテーマを使用するをご覧ください) たとえば、Android プラットフォームにデフォルトで含まれるテキストの外観を継承し、それを変更することができます。

    <style name="GreenText" parent="@android:style/TextAppearance">
        <item name="android:textColor">#00FF00</item>
    </style>

以前作成したスタイルを継承したい場合、parent 属性を使う必要はありません。 代わりに、継承したいスタイルの名前を、新しいスタイルの名前の前に付け、間をピリオドで区切ります。 たとえば、新たに作成するスタイルで、上で定義した CodeFont スタイルを継承しつつ、色を赤にするときは、新しいスタイルをこのように記述します。

    <style name="CodeFont.Red">
        <item name="android:textColor">#FF0000</item>
    </style>

<style> タグには parent 属性がありませんが、name 属性が CodeFont スタイルの名前(以前作成したスタイル)で始まっているので、このスタイルはそのスタイルからすべてのスタイル プロパティを継承します。 次にこのスタイルは、android:textColor プロパティをオーバーライドして、テキストを赤色にしています。 この新しいスタイルは、@style/CodeFont.Red として参照することが可能です。

名前をピリオドによって連結させることによって、このようにいくらでも継承を続けることができます。 たとえば以下のように、CodeFont.Red を継承し、テキストを大きくすることもできます。

    <style name="CodeFont.Red.Big">
        <item name="android:textSize">30sp</item>
    </style>

これは CodeFontCodeFont.Red の両方のスタイルを継承したうえで android:textSize プロパティを追加しています。

注: 名前を連結させて継承する方法は、自身のリソースで定義したスタイルに対してのみ有効です。 Android のビルトインのスタイルをこの方法で継承することはできません。 TextAppearance のようなビルトインのスタイルを継承するには、parent 属性を使う必要があります。

スタイル プロパティ

スタイルを定義する方法を理解したところで、今度はどのような種類のスタイル プロパティ(<item> 要素によって定義されるプロパティ)が利用できるのかを知る必要があります。おそらく layout_widthtextColor のようなプロパティには既になじみがあるでしょう。 もちろん、使用できるスタイル プロパティはもっとたくさんあります。

特定の View に適用するプロパティを見つけるには、対応するクラスのリファレンスを参照することをお勧めします。そちらに、サポートされている XML 属性すべての一覧があります。 たとえば、TextView XML 属性の表にある属性はすべて、TextView 要素(またはそのサブクラスの 1 つ)のスタイル定義で使用可能です。 このリファレンスにある属性の 1 つが android:inputType です。android:inputType 属性は通常、以下のように、<EditText> 要素内に入れます。

<EditText
    android:inputType="number"
    ... />

または、このプロパティを含む EditText 要素のスタイルを作成することもできます。

<style name="Numbers">
  <item name="android:inputType">number</item>
  ...
</style>

するとレイアウトの XML でこのスタイルを実装できるようになります。

<EditText
    style="@style/Numbers"
    ... />

この簡単な例は手間がかかるように見えますが、さらに多くのスタイル プロパティを追加したり、さまざまな場所にあるスタイルを再利用したい場合には、大きなメリットがあります。

利用できるスタイル プロパティすべてのリファレンスが必要な場合は、R.attr リファレンス をご覧ください。 View オブジェクトがすべて同じスタイル属性を受け入れるわけではないので、通常は、サポートされているスタイル プロパティの特定の View クラスを参照しなければなりません。 ただし、サポートしていないスタイル プロパティがある View にスタイルを適用する場合には、その View には、サポートしているプロパティのみが適用され、それ以外は無視されます。

しかし一部のスタイル プロパティは、どの View 要素でもサポートされていないので、テーマとしての適用しかできません。 こうしたスタイル プロパティは、ウィンドウ全体に適用され、View には一切適用されません。たとえば、アプリケーションのタイトルやステータス バーを隠したり、ウィンドウの背景を変更したりするテーマのスタイル プロパティが、これに相当します。 こうした種類のスタイル プロパティは、いずれの View オブジェクトにも属しません。このようなテーマ限定のスタイル プロパティを探すには、window で始まる属性の R.attr リファレンスを調べてください。 たとえば、windowNoTitlewindowBackground は、スタイルがテーマとしてアクティビティかアプリケーションに適用される場合にのみ効果があるスタイル プロパティです。 スタイルをテーマとして適用する方法の詳細は、次のセクションをご覧ください。

注: それぞれの <item> 要素でプロパティの名前の前に、android: 名前空間を付けるのを忘れないようにしてください。 たとえば <item name="android:inputType"> のようにします。

UI にスタイルとテーマを適用する

スタイルを設定する方法は 2 つあります。

レイアウト内の 1 つの View にスタイルを適用すると、そのスタイルにより定義されたプロパティはその View にのみ適用されます。 ViewGroup にスタイルが適用された場合、子要素 View はそのスタイル プロパティを継承しません。つまり、そのスタイルを直接適用した要素だけに、プロパティが適用されます。 ただし、スタイルがあらゆる View 要素に適用されるようにすることは可能です。そのためには、スタイルをテーマとして適用します。

スタイル定義をテーマとして適用するには、そのスタイルを Android マニフェスト内の Activity またはアプリケーションに適用する必要があります。 その場合には、アクティビティやアプリケーション内のあらゆる View が、サポートする各プロパティを適用します。 たとえば、先ほどの例にあった CodeFont スタイルをアクティビティに適用すると、テキストのスタイル プロパティをサポートしているすべての View 要素がそれを適用します。 そのプロパティをサポートしない View はそれらを無視します。 View がそのプロパティの一部しかサポートしていない場合は、サポートするプロパティのみが適用されます。

View にスタイルを適用する

以下は、XML レイアウトで View にスタイルを設定する方法です。

<TextView
    style="@style/CodeFont"
    android:text="@string/hello" />

この TextView は、CodeFont という名前のスタイルで定義されたスタイルに設定されます(スタイルを定義するのサンプルをご覧ください)。

注: style 属性の先頭には、android: 名前空間を付けません。

アクティビティやアプリケーションにテーマを適用する

アプリケーションのすべてのアクティビティにテーマを設定するには、AndroidManifest.xml ファイルを開き、<application> タグを編集して、スタイルの名前を指定した android:theme 属性を含めます。 次に例を示します。

<application android:theme="@style/CustomTheme">

あるテーマをアプリケーション内の 1つ のアクティビティだけに適用したい場合には、代わりに <activity> タグに android:theme 属性を追加します。

Android には他のビルトイン リソースと同様に、使用可能な事前定義テーマがたくさん用意されているため、自分でテーマを作成する必要がありません。 たとえば、Dialog テーマを使うと、アクティビティをダイアログ ボックスのようにすることができます。

<activity android:theme="@android:style/Theme.Dialog">

また、背景を透明にしたい場合は、Translucent というテーマを使います。

<activity android:theme="@android:style/Theme.Translucent">

既存のテーマを微調整して使いたいときには、そのテーマをカスタム テーマの parent として追加します。 たとえば、既存の Light テーマを変更して、以下のように、独自の色を使うことができます。

<color name="custom_theme_color">#b0b0ff</color>
<style name="CustomTheme" parent="android:Theme.Light">
    <item name="android:windowBackground">@color/custom_theme_color</item>
    <item name="android:colorBackground">@color/custom_theme_color</item>
</style>

(この場合、android:windowBackground 属性は別のリソースへの参照しかサポートしていないため、色は個別のリソースとして指定する必要があることに注意してください。android:colorBackground とは異なり、それに色のリテラルを付与することはできません)

以下では、Android マニフェスト内で Theme.Light の代わりに CustomTheme を使用しています。

<activity android:theme="@style/CustomTheme">

プラットフォームのバージョンに基づいてテーマを選択する

Android の新しいバージョンでは、アプリケーションで利用できるテーマが増えているので、こうしたプラットフォーム上でアプリケーションを実行しながら、同時に古いバージョンとの互換性を保ちたい場合もあります。 これは、カスタム テーマでリソース選択を使用して、リソース プラットフォームのバージョンによって複数の親テーマを切り替えることで実現できます。

たとえば、以下のカスタム テーマの宣言文は、標準的なプラットフォームでデフォルトになっている Light テーマのものです。 これは res/values の配下の XML ファイル内にあります(一般的には res/values/styles.xml)。

<style name="LightThemeSelector" parent="android:Theme.Light">
    ...
</style>

アプリケーションが Android 3.0(API レベル 11)以降での端末で実行されているとき、このテーマで新しいホログラフのテーマを使うには、res/values-v11 にある XML ファイルでこのテーマ用の代替の宣言を記述つつ、親テーマをホログラフのテーマにします。

<style name="LightThemeSelector" parent="android:Theme.Holo.Light">
    ...
</style>

このテーマを他のテーマと同じように使用すると、アプリケーションが Android 3.0 以降で実行されていれば、自動的にホログラフテーマに切り替わります。

テーマで使用できる標準的な属性の一覧は、R.styleable.Theme で確認できます。

プラットフォームのバージョンや他の端末設定に基づいた、テーマやレイアウトなどの代替リソースの提供については、リソースの提供で詳細をご覧ください。

プラットフォームのスタイルとテーマを使用する

Android プラットフォームでは、アプリケーションで使用可能なスタイルやテーマが多数提供されています。 利用可能なすべてのスタイルは、R.style クラスのリファレンスに載っています。 それらのスタイルを使うには、スタイルの名前のアンダースコアをすべてピリオドに変えます。 たとえば、"@android:style/Theme.NoTitleBar" を使って Theme_NoTitleBar テーマを適用できます。

ただし、R.style リファレンスの説明は十分ではなく、スタイルに関する詳しい記載がありません。そのため、こうしたスタイルやテーマのソースコードを実際に見るほうが、それぞれが提供するスタイル プロパティについてよく理解できるはずです。Android のスタイルとテーマについて詳しく知るには、以下のソースコードをご覧ください。

スタイルやテーマについて学ぶ際は、これらのファイルの例を参考にしてください。たとえば、Android のテーマのソースコードには、<style name="Theme.Dialog"> の宣言があります。 この定義には、Android フレームワークのスタイル ダイアログに使用されているすべてのプロパティが含まれています。

XML でのスタイルやテーマの構文については、スタイル リソースのドキュメントで詳細をご覧ください。

スタイルやテーマを定義するために使用できるスタイル属性(windowBackground や textAppearance)のリファレンスは、R.attr か、作成しようとしているスタイルの各 View クラスをご覧ください。

This site uses cookies to store your preferences for site-specific language and display options.

Get the latest Android developer news and tips that will help you find success on Google Play.

* Required Fields

Hooray!

Browse this site in ?

You requested a page in , but your language preference for this site is .

Would you like to change your language preference and browse this site in ? If you want to change your language preference later, use the language menu at the bottom of each page.

This class requires API level or higher

This doc is hidden because your selected API level for the documentation is . You can change the documentation API level with the selector above the left navigation.

For more information about specifying the API level your app requires, read Supporting Different Platform Versions.

Take a one-minute survey?
Help us improve Android tools and documentation.