【问题标题】:Change Spinner dropdown icon更改微调器下拉图标
【发布时间】:2022-03-31 21:06:28
【问题描述】:

我发现的解决方案可以更改所有的微调器下拉图标:

1.创建自定义可绘制对象

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/vector_drawable_ic_dropdown_black" android:state_focused="true" android:state_pressed="false" />
    <item android:drawable="@drawable/vector_drawable_ic_dropdown_black" android:state_focused="true" android:state_pressed="true" />
    <item android:drawable="@drawable/vector_drawable_ic_dropdown_black" android:state_focused="false" android:state_pressed="true" />
    <item android:drawable="@drawable/vector_drawable_ic_dropdown_black" />
</selector>

2。将 drawable 设置为微调器背景:

<Spinner
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="16dp"
    android:background="@drawable/custom_spinner_icon"
    android:gravity="center"
    android:paddingBottom="8dp"
    android:paddingTop="8dp"
    android:textColor="@color/textcolorprimary" />

结果是:

正如您所见,这不是一个可接受的解决方案,因为图标需要右对齐而不是拉伸。

如何使图标不拉伸并正确对齐?

编辑

由于没有可行的解决方案,但我想我必须指定我的问题。 这是我的 Spinner 使用标准主题的外观:

<Spinner
    android:id="@+id/products_download_spinner_language"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="16dp"
    android:gravity="center"
    android:paddingBottom="8dp"
    android:paddingTop="8dp"
    android:textColor="@color/textcolorprimary"
    android:theme="@android:style/Theme.Holo.Light.DarkActionBar" />

而我想要的一切(我猜这真的不多)正在改变箭头。我不希望显示右下角的那个箭头,我希望这个箭头垂直居中显示在右边:

到目前为止我尝试过的每个解决方案:

Spinner Dropdown Arrow

How to set dropdown arrow in spinner?

只是没有工作。他们有拉伸图标或底线丢失或其他完全错误的东西。我只是想要另一个箭头。

【问题讨论】:

  • 太可笑了,这还没有解决:/
  • @Mulgard 你能弄清楚如何使用矢量绘图来做到这一点吗?接受的答案似乎是使用 bitmap (使用 .png 或其他东西),您的问题似乎有矢量可绘制对象。

标签: android android-spinner


【解决方案1】:

尝试将以下样式应用于您的微调器

style="@style/SpinnerTheme"

//微调器样式

<style name="SpinnerTheme" parent="android:Widget.Spinner">
    <item name="android:background">@drawable/bg_spinner</item>
</style>

//bg_spinner.xml 用你的箭头替换 arrow_down_gray

<?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="#ffffff" android:startColor="#ffffff" android:type="linear" />

                    <stroke android:width="0.33dp" android:color="#0fb1fa" />

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

                    <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
                </shape>
            </item>

            <item android:right="5dp">

                <bitmap android:gravity="center_vertical|right" android:src="@drawable/arrow_down_gray" />

            </item>

        </layer-list>

    </item>

</selector>

【讨论】:

  • 如何去掉右上角和左上边框?只需要底部边框。
  • 如果@drawable/arrow_down_gray 是矢量呢?
  • @Lester 我无法在此处添加矢量。相反,当我尝试直接将矢量用作项目 &lt;item android:drawable="@drawable/arrow_down_greay" android:gravity="center_vertical|right" /&gt; 时,它仍然会在某些设备上延伸。你能想出一个解决方案吗?
  • @Lester 不要在 item 标签内使用 Bitmap 标签,直接使用 item 属性:&lt;item android:width="24dp" android:height="24dp" android:gravity="end|center_vertical" android:drawable="@drawable/ic_vector" /&gt;
  • @milosmms,适用于 API>=23,您不必在 API>24 中添加 android:width="24dp" android:height="24dp",但适用于 API
【解决方案2】:

将主题添加到微调器

<Spinner style="@style/SpinnerTheme"
      android:layout_width="match_parent"
      android:layout_height="match_parent"/>

将 spinnerTheme 添加到 styles.xml

<style name="SpinnerTheme" parent="android:Widget.Spinner">
    <item name="android:background">@drawable/spinner_background</item>
</style>

Add New -> "Vector Asset" to drawable 例如“ic_keyboard_arrow_down_24dp”

将 spinner_background.xml 添加到可绘制对象中

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <layer-list>
            <item android:drawable="@drawable/ic_keyboard_arrow_down_24dp" android:gravity="center_vertical|right" android:right="5dp"/>
        </layer-list>
    </item>
</selector>

【讨论】:

  • 在 android OS 5.0 上看起来很拉伸。有什么线索吗?
【解决方案3】:

为此,您可以使用 .9 补丁图像,只需将其设置为背景即可。

android:background="@drawable/spin"

这里我会给你.9patch 图像。试试这个。

右击图片并点击图片另存为

像这样设置图像名称:anyname.9.png并点击保存。

享受..快乐的编码。 :)

【讨论】:

  • 我正在使用 svg。比 0.9 补丁图像好得多。
  • 我认为在这种情况下 .9patch 图像比 svg 更好。使用 9patch 您只能从左边框拉伸一个透明像素,并将图像的其余部分保持在原始大小。我不知道这是否可以使用 svg,但我肯定会尝试这个答案。
  • @Mulgard,你应该看看原始实现和使用的图标格式。如果我没记错的话,默认实现使用的是 9patch
  • 我认为这是最好的解决方案,无需玩神秘的android主题
【解决方案4】:

我们可以像我一样通过隐藏图标来管理它:

<FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    <Spinner android:id="@+id/fragment_filter_sp_users"
             android:layout_width="match_parent"
             android:background="@color/colorTransparent"
             android:layout_height="wrap_content"/>

    <ImageView
            android:layout_gravity="end|bottom"
            android:contentDescription="@null"
            android:layout_marginBottom="@dimen/_5sdp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_arrow_bottom"
    />
</FrameLayout>

【讨论】:

  • 这很简单,并且可以完成工作。显然也适用于 SVG。
【解决方案5】:

您需要像这样创建自定义背景:

<?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="#ffffff" android:startColor="#ffffff" android:type="linear"/>

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

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

                    <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp"/>
                </shape>
            </item>
            <item>
                <bitmap android:gravity="bottom|right" android:src="@drawable/drop_down"/> // you can place your dropdown image
            </item>
        </layer-list>
    </item>

</selector>

然后像这样为微调器创建 style

<style name="spinner_style">
        <item name="android:background">@drawable/YOURCUSTOMBACKGROUND</item>
        <item name="android:layout_marginLeft">5dp</item>
        <item name="android:layout_marginRight">5dp</item>
        <item name="android:layout_marginBottom">5dp</item>
</style>

然后将此样式应用于您的微调器

【讨论】:

  • 这个解决方案不起作用。在您单击微调器之前,不会显示任何图标。之后,下拉菜单中会出现一个巨大的下拉图标。
  • 如何在drawable中添加paddingEnd?可绘制对象粘在微调器的末端。我需要为drawable添加一些填充。
  • 如果使用矢量绘图,您需要使用item 而不是bitmap
  • 为填充添加这行代码
【解决方案6】:

dummy.xml(记住图像大小应该更小)

<?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <layer-list android:opacity="transparent">
                <item android:width="60dp" android:gravity="left" android:start="20dp">
                    <bitmap  android:src="@drawable/down_button_dummy_dummy" android:gravity="left"/>
                </item>
            </layer-list>
        </item>
    </selector>

布局文件sn-p就像

<android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardUseCompatPadding="true"
        app:cardElevation="5dp"
        >
     <Spinner
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:background="@drawable/dummy">

     </Spinner>
    </android.support.v7.widget.CardView>

click to see result layout image

【讨论】:

    【解决方案7】:

    您是否尝试过在 xml 中定义自定义背景?减少正在做箭头的 Spinner 背景宽度看起来像这样。

    定义一个带有矩形背景和自定义箭头图标的图层列表:

        <?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="@color/color_white" />
                <corners android:radius="2.5dp" />
            </shape>
        </item>
        <item android:right="64dp">
             <bitmap android:gravity="right|center_vertical"  
                 android:src="@drawable/custom_spinner_icon">
             </bitmap>
        </item>
    </layer-list>
    

    【讨论】:

      【解决方案8】:

      不使用任何下拉菜单使用您的下拉图标

      <?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="#ffffff" android:startColor="#ffffff" android:type="linear" /><!--For gradient background-->
      
                      <stroke android:width="1dp" android:color="#FFF" /><!--For Border background-->
      
                      <corners android:radius="0dp" /><!--For background corner-->
      
                      <padding android:bottom="3dp" android:left="3dp" android:right="6dp" android:top="3dp" /><!--For padding for all sides-->
                  </shape>
              </item>
              <item>
                  <bitmap android:gravity="center|right" android:src="@drawable/ic_down_arrow" /> // Replace with your Icon
      
              </item>
          </layer-list>
      </item>
      

      【讨论】:

        【解决方案9】:

        我遇到了很多困难,因为我有一个自定义微调器,如果我设置背景,那么 Drawable 会拉伸。我对此的解决方案是在 Spinner TextView 的右侧添加一个可绘制对象。这是来自我的自定义微调器的代码 sn-p。 诀窍是重写 getView 并根据需要自定义 Textview。

        public class NoTextSpinnerArrayAdapter extends ArrayAdapter<String> {
        
            private String text = "0";
        
            public NoTextSpinnerArrayAdapter(Context context, int textViewResourceId, List<String> objects) {
                super(context, textViewResourceId, objects);
            }
        
            public void updateText(String text){
                this.text = text;
                notifyDataSetChanged();
            }
        
            public String getText(){
                return text;
            }
        
            @NonNull
            public View getView(int position, View convertView, @NonNull ViewGroup parent) {
                View view = super.getView(position, convertView, parent);
                TextView textView = view.findViewById(android.R.id.text1);
                textView.setCompoundDrawablePadding(16);
                textView.setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.ic_menu_white_24dp, 0);
        
                textView.setGravity(Gravity.END);
                textView.setText(text);
                return view;
            }
        }
        

        您还需要将 Spinner 背景设置为透明:

        <lifeunlocked.valueinvestingcheatsheet.views.SelectAgainSpinner
                    android:id="@+id/saved_tickers_spinner"
                    android:background="@android:color/transparent"
                    android:layout_width="60dp"
                    android:layout_height="match_parent"
                    tools:layout_editor_absoluteX="248dp"
                    tools:layout_editor_absoluteY="16dp" />
        

        如果你想要的话,还有我的自定义微调器......

        public class SelectAgainSpinner extends android.support.v7.widget.AppCompatSpinner {
            public SelectAgainSpinner(Context context) {
                super(context);
            }
        
            public SelectAgainSpinner(Context context, AttributeSet attrs) {
                super(context, attrs);
            }
        
            public SelectAgainSpinner(Context context, AttributeSet attrs, int defStyle) {
                super(context, attrs, defStyle);
            }
        
            @Override
            public void setPopupBackgroundDrawable(Drawable background) {
                super.setPopupBackgroundDrawable(background);
            }
        
            @Override
            public void setSelection(int position, boolean animate) {
                boolean sameSelected = position == getSelectedItemPosition();
                super.setSelection(position, animate);
                if (sameSelected) {
                    // Spinner does not call the OnItemSelectedListener if the same item is selected, so do it manually now
                    if (getOnItemSelectedListener() != null) {
                        getOnItemSelectedListener().onItemSelected(this, getSelectedView(), position, getSelectedItemId());
                    }
                }
            }
        
            @Override
            public void setSelection(int position) {
                boolean sameSelected = position == getSelectedItemPosition();
                super.setSelection(position);
                if (sameSelected) {
                    // Spinner does not call the OnItemSelectedListener if the same item is selected, so do it manually now
                    if (getOnItemSelectedListener() != null) {
                        getOnItemSelectedListener().onItemSelected(this, getSelectedView(), position, getSelectedItemId());
                    }
                }
            }
        }
        

        【讨论】:

          【解决方案10】:

          有一个技巧可以将微调器背景设置为透明颜色以隐藏默认微调器箭头:

          <Spinner
              ....
              android:background="@android:color/transparent"/>
          

          然后创建自定义微调器资源项(用于关闭状态);将您的可绘制箭头设置为 android:drawableEnd TextView:

          spinner_item.xml

          <?xml version="1.0" encoding="utf-8"?>
          <CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:app="http://schemas.android.com/apk/res-auto"
              android:id="@android:id/text1"
              style="?android:attr/spinnerDropDownItemStyle"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:paddingVertical="4dp"
              app:drawableEndCompat="@drawable/chevron_down"
              app:drawableRightCompat="@drawable/chevron_down"
              android:ellipsize="marquee"
              android:singleLine="true"/>
          

          将其设置为适配器:

          ArrayAdapter<String> spinnerAdapter = new ArrayAdapter<>(context,
                   R.layout.spinner_item, myItems);
          

          【讨论】:

            【解决方案11】:

            我已经设法做到了以下几点:

            使用此名称创建此可绘制文件 radio_button_background_drawable

            <selector xmlns:android="http://schemas.android.com/apk/res/android">
                <item>
                    <layer-list>
                        <item android:drawable="@drawable/vector_down_arrow" android:gravity="end" android:right="5dp" />
                    </layer-list>
                </item>
            </selector>
            
            

            将其添加到微调器背景中:

                    <Spinner
                        android:id="@+id/id_type_SP"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:background="@drawable/radio_button_background_drawable"
                        android:inputType="number"
                        tools:ignore="MissingConstraints" />
            

            【讨论】:

              猜你喜欢
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 2013-08-16
              • 2016-06-29
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              相关资源
              最近更新 更多