Androidスタイルの開発：layer-list実例詳細

上図Tabの背景効果と影のある角の長方形は、どうやって実現されますか？ほとんどの人はアメリカ人に絵を切らせて、背景を9つの図で作ります。しかし、一枚の絵だけを提供したら、どうなりますか？例えば、中間のTabの背景の赤いラインのピクセルの高さは4 pxで、mdpiの設備には予想通りに表示されます。hdpiの設備には少し細く表示されます。xhdpiの設備にはもう少し細かく表示されます。xhdpiには時又が細く表示されます。xxxxhdpiにはもっと細かい表示がされます。xxhdpi上では、1 dp=4 pxなので、4 pxの図は、xxhdpiデバイス上で表示されると、1 dpだけが残ります。したがって、様々な解像度を適応させるために、対応する複数の画像を提供しなければならない。androidのソース資源を調べても、このようなTabの背景点9図のように、解像度の大きさによって異なるサイズのスポット9の画像が提供されていることが分かります。
しかし、このデモには、実際の画像資源は一切使われておらず、shop、selector、本編で説明するlayer-listで行われています。
layer-listを使って複数のdrawableを順番に重ねて表示することができます。上図のTabのように、赤い層に白い層を重ねて表示した結果、陰影の角の長方形は灰色の角の長方形に白い円角の長方形を重ねて表示します。まずコードを見てください。以下はTab背景のコードです。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <!--         -->
  <!--<item android:drawable="@drawable/bg_tab_selected" android:state_checked="true" />-->
  <!--         -->
  <item android:state_checked="true">
    <layer-list>
      <!--      -->
      <item>
        <color android:color="#E4007F" />
      </item>
      <!--      -->
      <item android:bottom="4dp" android:drawable="@android:color/white" />
    </layer-list>
  </item>
  <item>
    <layer-list>
      <!--      -->
      <item>
        <color android:color="#E4007F" />
      </item>
      <!--      -->
      <item android:bottom="1dp" android:drawable="@android:color/white" />
    </layer-list>
  </item>
</selector>

影付きの丸い長方形は以下の通りです。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <!--      -->
  <item
    android:left="2dp"
    android:top="4dp">
    <shape>
      <solid android:color="@android:color/darker_gray" />
      <corners android:radius="10dp" />
    </shape>
  </item>
  <!--      -->
  <item
    android:bottom="4dp"
    android:right="2dp">
    <shape>
      <solid android:color="#FFFFFF" />
      <corners android:radius="10dp" />
    </shape>
  </item>
</layer-list>

上記の例示的なコードから、Layer-listはルートノードとしてもよく、selector中itemのサブノードとしてもよいことがわかる。layer-listは、複数のitemサブノードを追加することができ、各itemサブノードは、1つのdrawableリソースに対応して、itemの上から下の順に重ね合わせて、各itemのオフセット量を設定することによって、影などの効果が見られます。layer-listのitemは、以下の4つの属性によってオフセット量を設定することができます。

android：topトップのオフセット量

android：bottom底部のオフセット量

android：left左のオフセット

android：right右側のオフセット量

この4つのオフセット量とコントロールのmargin設定はほぼ同じで、外間隔の効果があります。どのようにオフセット量を設定しないと、前のレイヤーは後ろのレイヤーを完全に遮ってしまい、後ろのレイヤーの効果も見えなくなります。例えば上記の例では、Tab背景の白い背景にアンディ：bottomを設置してから、赤い背景が少し見えます。オフセット量をマイナスにするとどうなりますか？検証した結果、オフセットオーバーの部分はカットされて見えなくなります。信じないなら自分で試してみてもいいです。時々これはとても役に立ちます。例えば半円を表示したい時。
また、アイテムの使い方についても、まとめてみます。
1.ルートノードが異なる場合、設定可能な属性は異なる。例えば、selectorの下で、いくつかの状態属性を設定することができ、layer-listの下で、オフセット量を設定することができる。
2.親ノードが同じselectorであっても、drawableディレクトリとカラーディレクトリの下に置くと利用できる属性が異なります。例えば、drawableディレクトリの下で使用できる属性はandroid：drawableであり、カラーディレクトリの下で利用できる属性はandroidであります。
3.itemのサブノードは、任意のタイプのdrawableのラベルであってもいいです。上記の例のshape、カラー、layer-listを除いて、selectorであってもいいです。他にも言ったことのないbitmap、clip、scale、inset、transition、rotate、animed-rotate、lever-listなどがあります。
締めくくりをつける
layer-list編はここまでです。コード例もgithubにアップデートされました。アドレス：
https://github.com/keeganlee/kstyle.git
以上はAndroid Layer-listスタイルの例を整理しました。引き続き関連資料を補充します。ありがとうございます。