将图像与 AppCompatTextView 分开

Question

我有一个线性布局，列中有六个水平按钮的列表。每个 Button 都定义为 AppCompactTextView，因为我需要在其上放置两个图像，如下图所示：

我需要做的是将 drawableStartCompat 图像（左边的那个）从 AppCompactTextView 中分离出来，而不改变它的位置。我想让它与按钮分开。怎么办？我想用视图中的按钮包装它，但我不知道如何管理它。这是列表的六个元素之一的代码：

<androidx.appcompat.widget.AppCompatTextView
     android:id="@+id/view_top_up_button"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="@android:color/transparent"
     android:text="@string/placeholder"
     android:textColor="@color/black"
     app:drawableEndCompat="@drawable/ic_arrow_right_small_black"
     app:drawableStartCompat="@drawable/ic_menu_charge" />

Answer 1

在水平 LinearLayout 之外创建自定义按钮，其中包含 ImageView、Button 以及右侧图像的另一个 ImageView。

Answer 2

您可以将 Imageview 和 TextView 包装到您喜欢的任何视图组中并创建一个这样的视图，这使您可以灵活地为您的视图保持边距位置等：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/leftImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:src="@drawable/ic_android" />

        <TextView
            android:id="@+id/tvTitle"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="32dp"
            android:layout_weight="1"
            android:padding="8dp"
            android:text="Boost"
            android:textSize="16sp"
            android:textStyle="bold" />

        <ImageView
            android:id="@+id/rightImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="8dp"
            android:src="@drawable/ic_arrow_right" />
    </LinearLayout>


</LinearLayout>

输出：

您甚至可以继续并在您的布局之外创建一个 custom/compound 视图。

将图像与 AppCompatTextView 分开

Separate image from AppCompatTextView

android

xml

android-layout

view

android-drawable