在工具栏中的android微调器上翻转箭头

时间:2016-01-18 19:49:04

标签: android android-spinner

我在屏幕底部的工具栏中有一个微调器,但是微调器旁边的箭头指向下方,这是违反直觉的。是否有任何快速方法可以将箭头翻转为指向上方?

enter image description here

如果有帮助,微调器的定义如下:

android.R.layout.simple_spinner_dropdown_item

行布局只是<Spinner android:id="@+id/spinner_floors" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_arrow_drop_up_white_24dp" />

另一方面,有什么方法可以在调整器展开时将字体颜色更改为白色而不影响字体颜色?

更新

我设法使用this answer切换文字的颜色。我还切换了this image的背景,现在代码是

{{1}}

现在看起来像这样:

enter image description here

如何将按钮移到右侧?

注意:我使用Android Marshmallow,API级别23

3 个答案:

答案 0 :(得分:4)

微调器的默认背景是9-patch drawable,因此它可以相应缩放。如果要反转箭头,则必须复制drawable并手动反转。

在这里,我采用了Lollipop 1 上发现的旋转器的背景并垂直翻转:

  

flipped spinner background

您可以将其复制并作为9补丁保存到drawable-xxxhdpi文件夹中,即扩展名为.9.png(不仅仅是.png)。

1 [android-sdk]/platforms/android-22/data/res/drawable-xxxhdpi/spinner_mtrl_am_alpha.9.png

自Marshmallow以来,默认背景是XML drawable(选择器和矢量drawable)。如果你只想支持Android 6.0及更新版本,你可以从Ansroid SDK中复制它并修改它,使其垂直翻转。

您可以在 [android-sdk] / platforms / android-23 / data / res / drawable / 目录中找到drawable。它的名称为spinner_background_material.xml,取决于control_background_40dp_material.xmlic_spinner_caret.xml

答案 1 :(得分:3)

试试这个

<Spinner
    android:id="@+id/spinner_floors"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" 
    android:background="@android:drawable/btn_dropdown" <!-- You can use your own drawable -->
     />

答案 2 :(得分:2)

将此项与您自己的图标一起使用,例如:https://design.google.com/icons/#ic_arrow_drop_up

<强> toolbar_spinner.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <Spinner
        android:id="@+id/toolbar_spinner"
        style="@style/Widget.MyApp.HeaderBar.Spinner"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"/>

</LinearLayout>

<强> toolbar_spinner_item_actionbar.xml:

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="200dp"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@android:id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableEnd="@drawable/ic_arrow_drop_up_black_24dp"
        android:drawablePadding="8dp"
        android:fontFamily="sans-serif"
        android:paddingEnd="4dp"
        android:paddingStart="16dp"
        android:textColor="#ffffffff"
        android:textSize="18sp"
        android:textStyle="bold" />

</LinearLayout>

<强> toolbar_spinner_item_dropdown.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="200dp"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@android:id/text1"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:drawablePadding="8dp"
        android:gravity="center_vertical|start"
        android:paddingLeft="16dp"
        android:paddingRight="16dp"
        android:textColor="#ff333333"
        android:textSize="16sp"/>

</LinearLayout>

并将其添加到您的Styles

<style name="Widget.MyApp.HeaderBar.Spinner" parent="Widget.AppCompat.Light.Spinner.DropDown.ActionBar">
        <item name="android:background">?android:selectableItemBackground</item>
        <item name="android:dropDownSelector">?android:selectableItemBackground</item>
        <item name="android:divider">@null</item>
        <item name="android:overlapAnchor">true</item>
</style>

然后将其添加到OnCreate

Toolbar toolbar = getActionBarToolbar();

View spinnerContainer = LayoutInflater.from(this).inflate(R.layout.toolbar_spinner,
        toolbar, false);
ActionBar.LayoutParams lp = new ActionBar.LayoutParams(
        ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
toolbar.addView(spinnerContainer, lp);

YourObjectSpinnerAdapter spinnerAdapter = new YourObjectSpinnerAdapter();
spinnerAdapter.addItems(getMyObjectSpinnerData());

Spinner spinner = (Spinner) spinnerContainer.findViewById(R.id.toolbar_spinner);
spinner.setAdapter(spinnerAdapter);

取自: https://dabx.io/2015/01/02/material-design-spinner-toolbar-style-fix/

进行一些更改和更新。

这是改变图标的​​另一种方法,感谢Floern建议:

您必须创建两个名为的drawable文件:

1。control_background_40dp_material.xml

2。spinner_background_material.xml

并且,第一个内容:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@android:color/darker_gray"
    android:radius="20dp" />

第二个:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:paddingEnd="24dp"
    android:paddingLeft="0dp"
    android:paddingMode="stack"
    android:paddingRight="0dp"
    android:paddingStart="0dp">
    <item
        android:width="24dp"
        android:height="24dp"
        android:drawable="@drawable/control_background_40dp_material"
        android:gravity="end|center_vertical" />

    <item
        android:width="24dp"
        android:height="24dp"
        android:drawable="@drawable/ic_arrow_drop_up_black_24dp"
        android:gravity="end|center_vertical" />
</layer-list>

就是这样,只需使用Spinner就像这样:

<Spinner
        android:id="@+id/spinner_floors"
        android:background="@drawable/spinner_background_material"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

你去,玩得开心。