web-dev-qa-db-ja.com

リストビューの各セルに影を設定するにはどうすればよいですか？

Android ListViewのカスタムセルがあります。このカスタムセルは、内部にいくつかのビューがある相対レイアウトです。各セルの間にスペースがあるため、セルの下部に追加します影。

私はぐるぐる探していましたが、何も見つかりませんでしたか？これに似たものを達成したい：

enter image description here

ありがとう！

androidxmlandroid-ui
19
Andres

以下の2つの方法で実行できます。

  1. 9パッチ画像-9パッチを理解するには link をクリック

  2. Layer-listの使用-「res/drawable」に新しいファイルを作成します。

     <?xml version="1.0" encoding="utf-8"?>
   <layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
     <item >
        <shape 
          Android:shape="rectangle">
              <solid Android:color="@Android:color/darker_gray" />
              <corners Android:radius="5dp"/>
        </shape>
     </item>
     <item Android:right="1dp" Android:left="1dp" Android:bottom="2dp">
        <shape 
          Android:shape="rectangle">
              <solid Android:color="@Android:color/white"/>
              <corners Android:radius="5dp"/>
        </shape>
     </item>
   </layer-list>

次に、このレイヤーリストファイルをリストアイテムレイアウト（つまり、Linearlayoutなど）の背景として追加します。

43
Vidyadhar

このレイヤーリストをリストアイテムのレイアウトの背景として適用すると、選択した色が無効になります。

    <?xml version="1.0" encoding="utf-8"?>
   <layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
     <item >
        <shape 
          Android:shape="rectangle">
              <solid Android:color="@Android:color/darker_gray" />
              <corners Android:radius="5dp"/>
        </shape>
     </item>
     <item Android:right="1dp" Android:left="1dp" Android:bottom="2dp">
        <shape 
          Android:shape="rectangle">
              <solid Android:color="@Android:color/white"/>
              <corners Android:radius="5dp"/>
        </shape>
     </item>
   </layer-list>
2
user2520217

最も簡単な方法は、シャドウを9パッチに組み込むことです。このような例は次のとおりです。

Box 9-Patch

これは9パッチのように必要以上に大きくなりますが、たとえば、私はそれを大きくしたかったのです。

2
kcoppock

正確なシナリオはまだテストしていませんが、これはリストビューに透明な仕切りを追加する方法です。

<LinearLayout
  xmlns:Android="http://schemas.Android.com/apk/res/Android"
  Android:layout_width="wrap_content"
  Android:layout_height="wrap_content">

  <ListView 
    Android:id="@+id/Android:list"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:divider="@Android:color/transparent"
    Android:dividerHeight="4dip"/>

</LinearLayout>

これは、プログラムでシャドウラインを追加する場合に必要です。

<?xml version="1.0" encoding="utf-8"?>  
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"  
    Android:shape="rectangle">  
    <solid Android:color="@Android:color/transparent" />  
    <stroke   
        Android:layout_marginLeft="10dip"
        Android:layout_marginRight="10dip"
        Android:width="match_content"   
        Android:color="@color/black"  />  
    <size Android:height="1dp" />
</shape>

ストロークはアルファレイヤーの上に描画されるため、ストロークの色が黒く表示されない場合があります。さらに、これは現在、底面だけでなく、長方形の4つの側面を描画します。 （私はこれら2つの問題についてさらに調査を行う必要があります）。

すべてをまとめる方法を理解するのに助けが必要な場合は、これを参照してください チュートリアル 。

1
Stephan Branczyk

下からピークになるレイヤーリストの長方形を作成し、セルビューの独自のメイン背景色をxmlに設定します。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >
    <!--shadow to bottom and right-->
    <!--by pushing offset from top and left-->
    <!--then set foreground-color in Android:background in xml-->
    <item
        Android:left="2dp"
        Android:right="0dp"
        Android:top="2dp"
        Android:bottom="0dp">
        <shape
            Android:shape="rectangle">
            <solid Android:color="@Android:color/darker_gray" />
        </shape>
    </item>
</layer-list>

in your cell.xml:

<RelativeLayout
    Android:layout_width="match_content"
    Android:layout_height="wrap_content"
    Android:background="@drawable/shadow">

    <RelativeLayout 
        Android:id="@+id/cell_stuff"
        Android:layout_width="match_content"
        Android:layout_height="match_content"
        Android:background="@Android:color/holo_orange_light">

        <!--cell stuff-->

    </RelativeLayout>

</RelativeLayout>

またはオールインワン

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >
    <!--shadow to bottom and right-->
    <!--by pushing offset from top and left-->
    <item
        Android:left="2dp"
        Android:right="0dp"
        Android:top="2dp"
        Android:bottom="0dp">
        <shape
            Android:shape="rectangle">
            <solid Android:color="@Android:color/darker_gray" />
        </shape>
    </item>
    <!--foreground-color to cover over non-shadow-->
    <!--need to also offset in opposite direction-->
    <item
        Android:left="0dp"
        Android:right="2dp"
        Android:top="0dp"
        Android:bottom="2dp">
        <shape
            Android:shape="rectangle">
            <solid Android:color="@Android:color/holo_orange_light"/>
        </shape>
    </item>
</layer-list>

in your cell.xml:

<RelativeLayout
    Android:layout_width="match_content"
    Android:layout_height="wrap_content"
    Android:background="@drawable/shadow_allinone">

    <!--cell stuff-->

</RelativeLayout>

enter image description here

1
TWL