我们如何创建带有图像的单选按钮和选定的真实按钮

Question

请告诉我我们如何创建带有图像的单选按钮和选中的真实按钮？我在这里附上了我需要的屏幕截图？

Answer 1

我用textview制作了三个自定义单选按钮你可以用imageview

这是我的xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="@color/white"
     android:orientation="vertical">

<TextView
    android:id="@+id/tv_home"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="?attr/selectableItemBackgroundBorderless"
    android:gravity="center"
    android:paddingTop="@dimen/docs__bottom_icon_padding"
    android:paddingBottom="@dimen/docs__bottom_icon_padding"
    android:text="@string/home"
    android:drawablePadding="@dimen/padding_icon_text_top_bar_docs"
    app:drawableTopCompat="@drawable/ic_home"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toStartOf="@+id/tv_jpg"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="parent" />

<TextView
    android:id="@+id/tv_jpg"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="?attr/selectableItemBackgroundBorderless"
    android:gravity="center"
    android:paddingTop="@dimen/docs__bottom_icon_padding"
    android:paddingBottom="@dimen/docs__bottom_icon_padding"
    android:text="@string/files"
    android:drawablePadding="@dimen/padding_icon_text_top_bar_docs"
    app:drawableTopCompat="@drawable/ic_files"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toStartOf="@+id/tv_pdf"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/tv_home" />

<TextView
    android:id="@+id/tv_pdf"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="?attr/selectableItemBackgroundBorderless"
    android:gravity="center"
    android:paddingTop="@dimen/docs__bottom_icon_padding"
    android:paddingBottom="@dimen/docs__bottom_icon_padding"
    android:drawablePadding="@dimen/padding_icon_text_top_bar_docs"
    android:text="@string/pdf"
    app:drawableTopCompat="@drawable/ic_pdf"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/tv_jpg" />
</androidx.constraintlayout.widget.ConstraintLayout>

在activity的onCreate中写这段代码

       tv_home.setOnClickListener {
            setSelected(tv_home)
        }
        tv_jpg.setOnClickListener {
            setSelected(tv_jpg)
        }
        tv_pdf.setOnClickListener {
            setSelected(tv_pdf)
        }

并且oncreate的外侧make方法为

private fun setSelected(pTextViw: TextView) {
    if (tv_home == pTextViw) {
        tv_home.compoundDrawables[1].setTint(mSelectedColor)
        tv_home.setTextColor(mSelectedColor)
        tv_jpg.compoundDrawables[1].setTint(mUnSelectedColor)
        tv_jpg.setTextColor(mUnSelectedColor)
        tv_pdf.compoundDrawables[1].setTint(mUnSelectedColor)
        tv_pdf.setTextColor(mUnSelectedColor)
    } else if (tv_jpg == pTextViw) {
        tv_home.compoundDrawables[1].setTint(mUnSelectedColor)
        tv_home.setTextColor(mUnSelectedColor)
        tv_jpg.compoundDrawables[1].setTint(mSelectedColor)
        tv_jpg.setTextColor(mSelectedColor)
        tv_pdf.compoundDrawables[1].setTint(mUnSelectedColor)
        tv_pdf.setTextColor(mUnSelectedColor)
    } else if (tv_pdf == pTextViw) {
        tv_home.compoundDrawables[1].setTint(mUnSelectedColor)
        tv_home.setTextColor(mUnSelectedColor)
        tv_jpg.compoundDrawables[1].setTint(mUnSelectedColor)
        tv_jpg.setTextColor(mUnSelectedColor)
        tv_pdf.compoundDrawables[1].setTint(mSelectedColor)
        tv_pdf.setTextColor(mSelectedColor)
    }
}

我们如何创建带有图像的单选按钮和选定的真实按钮

How we can create radio button with image and selected true button

android

radio-group

radio-button

android-layout