java - 将 "2 backgrounds"设置为按钮

Question

我正在尝试为按钮设置“2 个背景”，第一个是一个 xml 文件，用于使按钮的角变圆，第二个是我想要的 png 图像。

我尝试使用 android:background 作为我的 xml 文件，使用 android:drawableTop 作为我的图像，它可以工作，但我的图像没有在按钮中调用。

我知道我们可以使用带有 android:scaleType="centerInside"的图像按钮来缩放图片，但就我而言，我想为按钮执行此操作，因为我需要在其中添加文本...

你能帮我吗？

我的 xml 文件(用于圆形):

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="#FF008AB8"/>
        <stroke android:color="#0299D0"/>
        <corners android:radius="15dp"/>
    </shape>
</item>
android:radius = "150dp"</selector>

谢谢
路酷M

Answer 1

您可以在 xml 可绘制对象中使用图层列表，这样您就可以根据需要设置 xml 背景和图像，然后只需设置一次背景。

这是一个例子

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <corners android:radius="@dimen/quarter_margin" />
        <stroke
            android:width="1dp"
            android:color="@color/ash_gray" />
        <solid android:color="@color/white" />
    </shape>
</item>

<item android:drawable="@drawable/blue_back">

</item>
</layer-list>

另一个解决方案: 为了能够仅使用一种布局并控制图像，您可以制作自己的自定义控件，这里是一个示例

public class RecordButton extends LinearLayout {
@BindView(R.id.record_switch)
SwitchCompat recordSwitch;
@BindView(R.id.record_toggle_button)
ToggleButton recordButton;
private boolean checkable = true;

public RecordButton(Context context) {
    super(context);
    init(context, null);
}

public RecordButton(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(context, attrs);
}

public RecordButton(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init(context, attrs);
}

private void init(@NonNull Context context, @Nullable AttributeSet attrs) {
    LayoutInflater inflater = LayoutInflater.from(context);
    inflater.inflate(R.layout.record_button, this);
    ButterKnife.bind(this);
    setGravity(Gravity.CENTER_HORIZONTAL);
    applyAttr(attrs);
    setChecked(false);
}

private void applyAttr(@Nullable AttributeSet attrs) {
    if (attrs != null) {
        TypedArray a = getContext().getTheme().obtainStyledAttributes(attrs,
                R.styleable.RecordButton, 0, 0);

        // Set Image
        int drawableResource = a.getResourceId(R.styleable.RecordButton_drawable, -1);
        if (drawableResource > -1) {
            int color = a.getColor(R.styleable.RecordButton_tint, -1);
            if (color > -1) {
                Drawable drawable = ContextCompat.getDrawable(getContext(), drawableResource);
                Drawable wrapDrawable = DrawableCompat.wrap(drawable);
                DrawableCompat.setTint(wrapDrawable, Color.RED);
                recordSwitch.setBackground(wrapDrawable);
            } else {
                recordSwitch.setBackgroundResource(drawableResource);
            }
        }

        // Set Orientation
        boolean isVertical = a.getBoolean(R.styleable.RecordButton_isVertical, false);
        if (isVertical) {
            setOrientation(VERTICAL);
        }
        a.recycle();
    }
}
}

这里我膨胀了一个布局并添加到继承自 LinearLayout 的此类中 这是膨胀的布局

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

<android.support.v7.widget.SwitchCompat
    android:id="@+id/record_switch"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:clickable="false"
    android:thumb="@android:color/transparent" />

<ToggleButton
    android:id="@+id/record_toggle_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@android:color/transparent"
    android:clickable="false"
    android:minHeight="0dp"
    android:minWidth="0dp"
    android:padding="@dimen/standard_margin"
    android:textAllCaps="false"
    android:textColor="@color/colorPrimary" />

</merge>

现在主要问题来了，我怎样才能改变图像。在 Java 类中，您会发现一个名为 applyAttr 的方法，该方法采用您添加到自定义控件的自定义属性

这是一个 attr 示例 将此代码添加到 attrs.xml 文件

 <declare-styleable name="RecordButton">
    <attr name="drawable" format="reference" />
</declare-styleable>