web-dev-qa-db-ja.com

背景として描画可能な図形、下部に線

TextViewの背景としてドロアブルを使用して、テキストの下に分割線を配置しています。このdrawable-xmlでそれを達成しました：

<?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="#FFDDDDDD" />
            <gradient 
                Android:angle="0"
                Android:startColor="#FFAAAAAA"
                Android:endColor="#FFEEEEEE"
                />
        </shape>
    </item>

    <item Android:bottom="2dp">
        <shape 
        Android:shape="rectangle">
            <solid Android:color="#FF000000" />
        </shape>
    </item>

</layer-list>

ただし、このメソッドは、黒い長方形の上に色付きの長方形を描画します。黒は透明ではないため、図形の下部に黒い四角形のない線のみを作成したいと思います。どうすればそれを達成できますか？

androiddrawableshape
56
ZoolWay

一般的に、フォーカス、プレスなどの状態を持つデフォルトの背景色をオーバーライドするため、絶対に必要でない限り、背景をできるだけ混乱させないようにします。必要なだけ厚い。例えば：

 <View 
       Android:background="#FF000000" 
       Android:layout_height="2dp" 
       Android:layout_width="fill_parent"/>
31
dmon

これは私が私の一番下に行を取得した方法です。ストロークを描画しますが、アイテムを上下に移動して、上下にストロークが表示されないようにします。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:top="-8dp" Android:left="-8dp" Android:right="-8dp">
        <shape> 
            <solid Android:color="#2b7996"/>
            <stroke Android:color="#33b5e5" Android:width="6dp"/>
        </shape>
    </item>
</layer-list>
191
Go Rose-Hulman

私はそれがより良い解決策だと思う：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >
    <item Android:gravity="bottom">
        <shape>
            <size Android:height="1dp" />
            <solid Android:color="#000000" />
        </shape>
    </item>
</layer-list>
28
Dmitry Velychko

通常、同様のタスクのために-私はこのようなレイヤーリストドローアブルを作成しました：

<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
    <shape Android:shape="rectangle">
        <solid Android:color="@color/underlineColor"/>
    </shape>
</item>
<item Android:bottom="3dp">
    <shape Android:shape="rectangle">
        <solid Android:color="@color/buttonColor"/>
    </shape>
</item>

最初にunderlineColorで四角形を描画し、次にこの上に実際のbuttonColorでbottomPaddingを適用して別の四角形を描画するという考え方です。常に機能します。

ただし、buttonColorを透明にする必要がある場合は、上記のドロアブルを使用できません。もう一つ解決策を見つけました

<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
    <shape Android:shape="rectangle">
        <solid Android:color="@Android:color/transparent"/>
    </shape>
</item>

<item Android:drawable="@drawable/white_box" Android:gravity="bottom" Android:height="2dp"/>
</layer-list>

（ここでわかるように、mainButtonColorは透明で、white_boxは白いソリッドで描画可能な単純な長方形です）

6
Lanitka

このソリューションを使用すると、別の回線が必要になる場合があります。私の要件は下線のみでした。レイアウトに異なる色を付けることもできます。下の写真の白い線で見ることができます enter image description here

    <?xml version="1.0" encoding="UTF-8"?>
    <layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">

    <item Android:top="-5dp" Android:left="-5dp" Android:right="-5dp">
        <shape>
            <solid Android:color="@Android:color/transparent"/>
            <stroke Android:color="@color/white" Android:width="5dp"/>
        </shape>
    </item>

    <item Android:top="-5dp" Android:bottom="-5dp" Android:right="-5dp">
        <shape>
            <solid Android:color="@Android:color/transparent"/>
            <stroke Android:color="@color/colorPrimaryDark" Android:width="5dp"/>
        </shape>
    </item>

    <item Android:bottom="-5dp" Android:left="-5dp" Android:right="-5dp">
        <shape>
            <solid Android:color="@Android:color/transparent"/>
            <stroke Android:color="@color/colorPrimaryDark" Android:width="5dp"/>
        </shape>
    </item>

    <item Android:top="-5dp" Android:left="-5dp" Android:bottom="-5dp">
        <shape>
            <solid Android:color="@Android:color/transparent"/>
            <stroke Android:color="@color/colorPrimaryDark" Android:width="5dp"/>
        </shape>
    </item>

    <item Android:bottom="2dp" Android:left="5dp" Android:right="5dp" Android:top="5dp">
        <shape>
            <solid Android:color="@color/colorPrimary"/>

            <corners Android:bottomRightRadius="0dp"
                Android:bottomLeftRadius="0dp"
                Android:topLeftRadius="0dp"
                Android:topRightRadius="0dp" />
        </shape>
    </item>
</layer-list>
3
Tara

簡単な解決策は、TextViewを拡張してから、onDrawをオーバーライドすることです。

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    Paint paint = new Paint();
    Paint.setColor(ContextCompat.getColor(getContext(),R.color.colorTextUnderLine));
    Paint.setStrokeWidth(10);
    canvas.drawLine(0.0f,canvas.getHeight(),canvas.getWidth(),canvas.getHeight(),
            Paint);
}
0
Freddie