翻转工具栏中 android 微调器上的箭头
Flip arrow on android spinner in toolbar
我在屏幕底部的工具栏中有一个微调器,但微调器旁边的箭头指向下方,这有悖常理。有没有什么快速的方法可以让箭头向上翻转?
如果有帮助,微调器定义如下:
<Spinner
android:id="@+id/spinner_floors"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
并且行布局只是 android.R.layout.simple_spinner_dropdown_item
。
另外,有没有什么方法可以在微调器展开时将字体颜色更改为白色而不影响字体颜色?
更新
我设法使用 this answer. I also switched the background for this image 切换了文本的颜色,所以现在代码是
<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" />
现在看起来像这样:
如何将按钮向右移动?
注意:我正在使用 Android Marshmallow,API 级别 23
试试这个
<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 -->
/>
例如将其与您自己的图标一起使用: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" />
好了,玩得开心。
微调器的默认背景是 9-patch drawable,因此它可以相应地缩放。如果你想反转箭头,你必须复制可绘制对象并手动反转它。
这里我把在 Lollipop1 上找到的旋转器的背景拿来垂直翻转:
您可以将其复制并作为 9-patch 保存到 drawable-xxxhdpi
文件夹中,即扩展名为 .9.png
(不仅仅是 .png
)。
1 [android-sdk]/platforms/android-22/data/res/drawable-xxxhdpi/spinner_mtrl_am_alpha.9.png
自棉花糖以来,默认背景是 XML 可绘制对象(选择器和矢量可绘制对象)。如果您只想支持 Android 6.0 和更新版本,您可以从 Ansroid SDK 复制它并修改它,使其垂直翻转。
您可以在 [android-sdk]/platforms/android-23/data/res/drawable/ 目录中找到可绘制对象。它被命名为 spinner_background_material.xml
并依赖于 control_background_40dp_material.xml
和 ic_spinner_caret.xml
.
我在屏幕底部的工具栏中有一个微调器,但微调器旁边的箭头指向下方,这有悖常理。有没有什么快速的方法可以让箭头向上翻转?
如果有帮助,微调器定义如下:
<Spinner
android:id="@+id/spinner_floors"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
并且行布局只是 android.R.layout.simple_spinner_dropdown_item
。
另外,有没有什么方法可以在微调器展开时将字体颜色更改为白色而不影响字体颜色?
更新
我设法使用 this answer. I also switched the background for this image 切换了文本的颜色,所以现在代码是
<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" />
现在看起来像这样:
如何将按钮向右移动?
注意:我正在使用 Android Marshmallow,API 级别 23
试试这个
<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 -->
/>
例如将其与您自己的图标一起使用: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" />
好了,玩得开心。
微调器的默认背景是 9-patch drawable,因此它可以相应地缩放。如果你想反转箭头,你必须复制可绘制对象并手动反转它。
这里我把在 Lollipop1 上找到的旋转器的背景拿来垂直翻转:
您可以将其复制并作为 9-patch 保存到 drawable-xxxhdpi
文件夹中,即扩展名为 .9.png
(不仅仅是 .png
)。
1 [android-sdk]/platforms/android-22/data/res/drawable-xxxhdpi/spinner_mtrl_am_alpha.9.png
自棉花糖以来,默认背景是 XML 可绘制对象(选择器和矢量可绘制对象)。如果您只想支持 Android 6.0 和更新版本,您可以从 Ansroid SDK 复制它并修改它,使其垂直翻转。
您可以在 [android-sdk]/platforms/android-23/data/res/drawable/ 目录中找到可绘制对象。它被命名为 spinner_background_material.xml
并依赖于 control_background_40dp_material.xml
和 ic_spinner_caret.xml
.