如何使项目角夹在微调器弹出窗口内？

Question

我制作了一个角半径为 16dp 的自定义 popupBackground。问题是，该弹出窗口中的项目可能有一个背景颜色，它不会跟随其父弹出窗口出现，我不知道该怎么做，因为我没有看到任何“ClipToBounds”类型的属性.点击一个项目时，涟漪效应也会发生同样的情况。代表我现在拥有的图像以及用于生成它的代码：

微调器定义：

<androidx.appcompat.widget.AppCompatSpinner
    android:id="@+id/ItemOptionsSpinner"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:dropDownWidth="wrap_content"
    android:popupBackground="@drawable/spinner_background"
    android:paddingRight="0dp"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintHorizontal_bias="1"
    android:spinnerMode="dropdown"
    android:visibility="invisible" />

spinner_background.xml 可绘制文件夹内：

<?xml version="1.0" encoding="utf-8"?>
<shape 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="16dp" />
    <solid android:color="?android:colorBackground" />
</shape>

SpinnerItemLineDropLayout.xml，用于显示每一项的视图：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    android:id="@+id/MainLayout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:paddingHorizontal="@dimen/activityHorizontalPadding"
    android:paddingVertical="@dimen/activityVerticalPadding"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView
        android:id="@+id/ItemText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/CheckImage"
        style="@style/DefaultTextAppearance.Medium.Big" />
    <ImageView
        android:id="@+id/CheckImage"
        android:paddingLeft="12dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintBottom_toTopOf="@+id/HelpText"
        app:layout_constraintRight_toRightOf="parent"
        android:src="@drawable/ic_check_black_18dp"
        android:tint="@color/colorPrimaryDark"
        tools:ignore="ContentDescription" />
</androidx.constraintlayout.widget.ConstraintLayout>

我在适配器内部使用的代码来填充项目，只是为了展示我如何设置项目本身的背景颜色，具体取决于微调器是否选择了项目：

public override View GetDropDownView(Int32 position, View convertView, ViewGroup parent)
{
    var view = convertView ?? (parent?.Context == null ? null : LayoutInflater.FromContext(parent.Context)?.Inflate(Resource.Layout.SpinnerItemLineDropLayout, null));

    var mainLayout = view.FindViewById<ConstraintLayout>(Resource.Id.MainLayout);
    var itemTextView = view.FindViewById<TextView>(Resource.Id.ItemText);
    var checkImageView = view.FindViewById<ImageView>(Resource.Id.CheckImage);

    itemTextView.Text = this._items[position].Text.GetText();

    checkImageView.SetImageResource(this.SelectedPosition == position ? Resource.Drawable.ic_check_black_18dp : 0);

    if (this.SelectedPosition == position)
        mainLayout.SetBackgroundColor(Color.ParseColor(view.Context.GetString(Resource.Color.colorControlHighlight)));

    return view;
}

Answer 1

原因是 SelectedItem 的 BackgroundColor 会影响 spinner DropDownView 的样式。如果你没有为item设置selected color，就不会出现这种现象。

如果您需要为 SelectedItem 设置 BackgroundColor，有一种方法可以降低 DropDownView 的效果。但这不是解决方法，因为它不能完全解决这种现象。

示例代码如下：

if (this.SelectedPosition == position)
        
GradientDrawable gradientDrawable = new GradientDrawable();
gradientDrawable.SetShape(ShapeType.Rectangle);//shape
gradientDrawable.SetCornerRadius(16f);//set circle Radius
gradientDrawable.SetColor(Resource.Color.ripple_material_dark);//background color

mainLayout.SetBackgroundDrawable(gradientDrawable);//set backgroundcolor

这里我们使用SetBackgroundDrawable来设置颜色，因为这样可以设置形状

此外，您可以修改 spinner_background.xml 代码以减少它们的差异：

<?xml version="1.0" encoding="utf-8" ?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
  <corners android:radius="8dp" />
  <solid android:color="?android:colorBackground" />
</shape>

效果：

============================更新================ ==================

作为dbalboa的评论，还有另一种可能的解决方案，也可以使用SetBackgroundColor方法来设置color.That是将<padding android:top="15dip" android:bottom="15dip" />放在[=16的形状标签内=].

完整代码如下：

<?xml version="1.0" encoding="utf-8" ?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
  <corners android:radius="8dp" />
  <padding android:top="5dip" android:bottom="5dip"/>
  <solid android:color="?android:colorBackground" />
</shape>

则效果如下：

如何使项目角夹在微调器弹出窗口内？

How to make items corners clip inside spinner popup?

android

xamarin

spinner

clip