Android按钮带有图标和文本

Question

我的应用程序中有一些这样的按钮:

    <Button
        android:id="@+id/bSearch"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:text="Search"
        android:textSize="24sp" />

我正在尝试使用文本和图标创建相同的按钮.android:drawableLeft对我不起作用(也许会,但我不知道如何设置图标的最大高度).

所以我创建了一个带有ImageView和TextView的LinearLayout,并使其像一个按钮:

    <LinearLayout
        android:id="@+id/bSearch2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@android:drawable/btn_default"
        android:clickable="true"
        android:padding="16dp"
        android:orientation="horizontal" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="5dp"
            android:adjustViewBounds="true"
            android:maxHeight="30dp"
            android:maxWidth="30dp"
            android:scaleType="fitCenter"
            android:src="@drawable/search_icon" />

        <TextView
            android:id="@+id/tvSearchCaption"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:textSize="24sp"
            android:paddingRight="30dp"
            android:gravity="center"
            android:text="Search" />
    </LinearLayout>

我的新按钮正是我想要的(字体大小,图标和文本放置).但它看起来不像我的默认按钮:

所以我试着改变我的新Button的背景和文字颜色:

Button Search = (Button) findViewById(R.id.bSearch);
LinearLayout bSearch2 = (LinearLayout) findViewById(R.id.bSearch2);
bSearch2.setBackground(bSearch.getBackground());
TextView tvSearchCaption = (TextView)findViewById(R.id.tvSearchCaption);
tvSearchCaption.setTextColor(bSearch.getTextColors().getDefaultColor());

这给了一个奇怪的结果,我的旧按钮搞砸了:

当我改变XML中这两个按钮的顺序时,所以"新按钮"首先出现,它会产生另一个奇怪的结果:

现在我注意到,当我尝试按下旧按钮时,新按钮会被按下.

有任何想法吗？

Answer 1

试试这个吧.

<Button
    android:id="@+id/bSearch"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:padding="16dp"
    android:text="Search"
    android:drawableLeft="@android:drawable/ic_menu_search"
    android:textSize="24sp"/>

Answer 2

要向左,右,上或下添加图像,您可以使用以下属性:

android:drawableLeft
android:drawableRight
android:drawableTop
android:drawableBottom

上面给出了示例代码.您也可以使用相对布局来实现此目的.

Answer 3

对于任何想要动态执行此操作的人来说setCompoundDrawables(Drawable left, Drawable top, Drawable right, Drawable bottom),按钮对象都会有所帮助.

样品

Button search = (Button) findViewById(R.id.yoursearchbutton);
search.setCompoundDrawables('your_drawable',null,null,null);

Answer 4

您可以使用材料组件库和MaterialButton组件。
使用app:icon和app:iconGravity="start"属性。

就像是：

  <com.google.android.material.button.MaterialButton
        style="@style/Widget.MaterialComponents.Button.Icon"
        app:icon="@drawable/..."
        app:iconGravity="start"
        ../>

Answer 5

这才是你真正想要的。

<Button
       android:id="@+id/settings"
       android:layout_width="190dp"
       android:layout_height="wrap_content"
       android:layout_gravity="center_horizontal"
       android:background="@color/colorAccent"
       android:drawableStart="@drawable/ic_settings_black_24dp"
       android:paddingStart="40dp"
       android:paddingEnd="40dp"
       android:text="settings"
       android:textColor="#FFF" />