68

右下隅に三角形があるスピナーの周りのラインのようなカスタム スピナーを開発したいと考えています。
次の画像のように

ここに画像の説明を入力

上記の図では、カスタムスピナーを次のように書きました

スピナー.xml

 <Spinner android:background="@drawable/spinner_background"/>

spinner_background.xml

<?xml version="1.0" encoding="UTF-8"?>


<item android:state_pressed="true"
      android:drawable="@drawable/spinner_ab_pressed_new_theme_bs">
    <shape>

        <solid 
            android:color="@color/White" />

        <corners android:radius="3dp" />

        <padding 
            android:bottom="10dp" 
            android:left="10dp" 
            android:right="10dp" 
            android:top="10dp" />

         <stroke 
            android:width="2dp" 
            android:color="@color/skyblue" />
    </shape>
 </item>
 <!-- spinner_ab_default_new_theme_bs -> this image for corner triangle -->
<item

    android:drawable="@drawable/spinner_ab_default_new_theme_bs" >
    <shape>
        <solid
            android:color="@color/White">
        </solid>

        <corners android:radius="3dp" />

        <padding
            android:bottom="10dp" 
            android:left="10dp" 
            android:right="10dp" 
            android:top="10dp" />
         <stroke 
            android:width="2dp" 
            android:color="@color/gray"/>
    </shape>
</item>

そして、次の画像のような出力が得られました
ここに画像の説明を入力

私は多くのことを試みましたが、目標を達成できませんでした。誰もがスピナーを開発するための解決策を持っています.
上の最初の画像のように。

4

8 に答える 8

138

スピナー 

<Spinner
    android:id="@+id/To_Units"
    style="@style/spinner_style" />

style.xml

    <style name="spinner_style">
          <item name="android:layout_width">match_parent</item>
          <item name="android:layout_height">wrap_content</item>
          <item name="android:background">@drawable/gradient_spinner</item>
          <item name="android:layout_margin">10dp</item>
          <item name="android:paddingLeft">8dp</item>
          <item name="android:paddingRight">20dp</item>
          <item name="android:paddingTop">5dp</item>
          <item name="android:paddingBottom">5dp</item>
          <item name="android:popupBackground">#DFFFFFFF</item>
     </style>

gradient_spinner.xml (drawable フォルダー内)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item><layer-list>
            <item><shape>
                    <gradient android:angle="90" android:endColor="#B3BBCC" android:startColor="#E8EBEF" android:type="linear" />

                    <stroke android:width="1dp" android:color="#000000" />

                    <corners android:radius="4dp" />

                    <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
                </shape></item>
            <item ><bitmap android:gravity="bottom|right" android:src="@drawable/spinner_arrow" />
            </item>
        </layer-list></item>

</selector>

@drawable/spinner_arrowあなたの右下隅の画像です

于 2013-06-21T09:31:48.993 に答える
1

複数の XML ファイルを作成したくない場合は、次の方法を試してください。

<com.google.android.material.card.MaterialCardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:strokeWidth="1dp"
        app:strokeColor="@color/black"
        app:cardCornerRadius="4dp">

        <androidx.appcompat.widget.AppCompatSpinner
            android:id="@+id/spinner"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="20dp"/>

    </com.google.android.material.card.MaterialCardView>

境界線の色を変更するには:

app:strokeColor="YOUR_COLOR_HERE"

境界線の幅を変更するには:

app:strokeWidth="YOUR_DP_WIDTH_HERE"
于 2021-06-11T14:18:54.467 に答える
1

「背景」のみを変更するには (角を追加する、色を変更するなど)、必要な背景ドローアブルを使用して FrameLayout に配置できます。それ以外の場合は、スピナー矢印を失わないように 9 つのパッチ背景を作成する必要があります。スピナーの背景は透明です。

于 2017-05-23T19:30:12.417 に答える
0

シンプルな9 パッチのpng 画像を設計して、それをスピナーの背景として使用できます。GIMP を使用すると、境界線と直角三角形の両方を画像に入れることができます。

于 2013-06-21T09:27:23.183 に答える