アダプティブ アイコン
AdaptiveIconDrawable
個々のデバイスの機能やユーザーに応じて表示方法が異なる場合があります。
テーマ設定です。アダプティブ アイコンは、主にホーム画面のランチャーで使用されます。
ショートカット、設定アプリ、共有ダイアログ、
概要画面が表示されますアダプティブ アイコンは、すべての Android フォーム ファクタで使用されます。
bitmap とは対照的に、 画像、アダプティブ アイコンを さまざまなユースケースに対応できます
さまざまな形状: さまざまな形状をアダプティブ アイコンに表示できます。 デバイスモデルに応じて異なります。たとえば、円の形状、 スクワークル(正方形と正方形の中間の形状)を クリックします。各デバイスの OEM はマスクを提供する必要があります。マスクは すべてのアダプティブ アイコンを同じ形状でレンダリングするために使用されます。
視覚効果: アダプティブ アイコンは、さまざまな魅力的な視覚効果をサポートします。 ユーザーが家の中でアイコンを配置または移動したときに表示されるエフェクト 表示されます。
ユーザーテーマ設定: Android 13(API レベル 33)以降、ユーザーはテーマ設定が可能 アダプティブアイコンを使用しますユーザーがテーマ別アプリアイコンを有効にした場合は、 システム設定でテーマアイコンを切り替える(ランチャーはこれをサポートする) ユーザーが選択した壁紙と同じ色が使用されます。 色合いを決定します。
以下のシナリオでは、ホーム画面にテーマ 代わりにアダプティブまたは標準のアプリアイコンを表示します。
- ユーザーがテーマ別アプリアイコンを有効にしていない場合。
- アプリでモノクロのアプリアイコンを提供していない場合。
- ランチャーがテーマ別アプリアイコンをサポートしていない場合。
アダプティブ アイコンをデザインする
アダプティブ アイコンで、さまざまな形状、視覚効果、スタイルをサポートするには、 設計する場合は、次の要件を満たす必要があります。
アイコンのカラー バージョン用に、2 つのレイヤを用意する必要があります。 フォアグラウンドで 1 つはバックグラウンド用です。レイヤはベクトルかレイヤのいずれかにできます。 推奨されますが、ベクターが推奨されます。
<ph type="x-smartling-placeholder">アプリアイコンのユーザーテーマ設定をサポートする場合は、 アイコンのモノクロ バージョンにします。
<ph type="x-smartling-placeholder">すべてのレイヤのサイズを 108x108 dp にします。
端がきれいなアイコンを使用する。レイヤにマスクや背景を含めることはできません アイコンの枠線の周りに影が付きます。
48x48 dp 以上のロゴを使用してください。66x66 dp 以下にする。 アイコンの内側の 66x66 dp は、マスクされた 表示されなくなります。
レイヤの 4 つの辺のそれぞれの外側の 18 dp は、 視差や点滅などの視覚効果を作成することもできます。
Android Studio を使用してアダプティブ アイコンを作成する方法については、Android アプリ Figma アイコン テンプレート または、Android Studio のドキュメントでランチャーを作成します。 できます。また、 詳しくは、ブログ投稿「アダプティブ バナーの アイコン をタップします。
アプリにアダプティブ アイコンを追加する
アダプティブ アイコンは、非アダプティブ アイコンと同様に、
アプリの android:icon
属性
マニフェストをご覧ください。
オプションの属性 android:roundIcon
は、ランチャーによって使用されます。
円形のアイコンが付いたアプリです。アイコンに丸いアイコンが
円形の背景をデザインの中心に据えています。このようなランチャーは、
android:roundIcon
に円形マスクを適用してアプリアイコンを生成します。
を保証することで、アプリアイコンの外観を最適化できます。
たとえば、ロゴを少し大きくして、切り抜かれたときに
円形の背景は余白なしになります。
次のコード スニペットは、これらの両方の属性を示していますが、ほとんどのアプリでは
android:icon
のみを指定します。
<application ... android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" ...> </application>
次に、アダプティブ アイコンを res/mipmap-anydpi-v26/ic_launcher.xml
に保存します。使用
<adaptive-icon>
要素を使用して、フォアグラウンド、バックグラウンド、
アイコン用のモノクロレイヤのリソース<foreground>
、
<background>
と <monochrome>
の内部要素は両方をサポートします。
作成できます
次の例は、<foreground>
、<background>
、
<adaptive-icon>
内の <monochrome>
要素:
<?xml version="1.0" encoding="utf-8"?> ... <adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android"> <background android:drawable="@drawable/ic_launcher_background" /> <foreground android:drawable="@drawable/ic_launcher_foreground" /> // Starting with Android 13 (API level 33), you can opt-in to providing a // <monochrome> drawable. <monochrome android:drawable="@drawable/ic_launcher_monochrome" /> </adaptive-icon> ...
ドローアブルを要素にインライン化することで、ドローアブルを要素として定義することもできます。
<foreground>
、<background>
、<monochrome>
要素。次の
スニペットは、フォアグラウンド ドローアブルを使用してこれを行う例を示しています。
<?xml version="1.0" encoding="utf-8"?> ... <foreground> <inset android:insetBottom="18dp" android:insetLeft="18dp" android:insetRight="18dp" android:insetTop="18dp"> <shape android:shape="oval"> <solid android:color="#0000FF" /> </shape> </inset> </foreground> ...
標準モードと同じマスクと視覚効果をショートカットに適用するには、 通常のアダプティブ アイコンを使用するには、次のいずれかの方法を使用します。
- 静的ショートカットの場合は、
<adaptive-icon>
要素を使用します。 - 動的ショートカットの場合は、
createWithAdaptiveBitmap()
メソッドを定義します。
アダプティブ アイコンの実装について詳しくは、実装 アダプティブ アイコン。 ショートカットの詳細については、アプリのショートカットをご覧ください 概要をご覧ください。
参考情報
設計とデプロイに関する詳細については、次のリソースをご覧ください。 アダプティブ アイコンの実装
- Figma コミュニティ ページのテンプレート
- Android のアダプティブ アイコンについて
- アダプティブ アイコンのデザイン
- アダプティブ アイコンの実装
- Android Studio でアプリアイコンを作成する
- Google Play アイコンのデザイン仕様