Android 内部带有数字的自定义复选框（或 ToggleButton）

Question

我正在编写一个有 60 个复选框的应用程序，编号为 1-60。我的目标是实现这样的目标：

有没有办法不用绘制 60 个带有数字的 .png 文件就可以做到这一点？我可以只绘制边缘并将数字添加为按钮的文本属性吗？

我尝试自定义 ToggleButton（从 here 获得灵感）

<ToggleButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:button="@drawable/toggle_selector"
    android:background="@null"
    android:paddingLeft="10dp"
    android:layout_centerHorizontal="true"
    android:gravity="center"
    android:textOn="60"
    android:textOff="60" />

toogle_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_checked="true"
        android:drawable="@drawable/checked" />
    <item
        android:drawable="@drawable/not_checked" />
</selector>

但结果，文本被放置在按钮的右侧。是否可以将文字放在图片上方？

Answer 1

您可以像这样在切换按钮顶部使用带有文本视图的相对布局来完成此操作。根据您的需要替换边距和尺寸

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/background_floating_material_dark"
    tools:context="com.contag.app.fragment.NavDrawerFragment">
    <ToggleButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@drawable/toggle_selector"
        android:background="@android:color/transparent"
        android:gravity="center"
        android:textOn="@null"
        android:textOff="@null"
        android:minHeight="0dp"
        android:minWidth="0dp"
        android:id="@+id/toggleButton"
        android:layout_marginTop="26dp"
        android:layout_marginStart="156dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="60"
        android:textColor="@android:color/holo_green_dark"
        android:textSize="15sp"
        android:id="@+id/textView"
        android:layout_alignLeft="@+id/toggleButton"
        android:layout_alignTop="@+id/toggleButton"
        android:layout_alignRight="@+id/toggleButton"
        android:layout_alignBottom="@+id/toggleButton"
        android:gravity="center" />
</RelativeLayout>

Android 内部带有数字的自定义复选框（或 ToggleButton）

Android custom checkbox (or ToggleButton) with numbers inside

checkbox

android

togglebutton