如何为android中的按钮添加文本背景？答案

【问题标题】：How do I add a text background to a button in android?如何为android中的按钮添加文本背景？
【发布时间】：2017-06-01 06:14:52
【问题描述】：

我设计了如上图所示的按钮。但我无法将文本背景（已圈出）添加到按钮。如何实现？

这是我目前所取得的成就：

<View
    android:id="@+id/centerVertical"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_centerVertical="true"
    android:visibility="invisible" />

<View
    android:id="@+id/centerHorizontal"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_centerHorizontal="true"
    android:visibility="invisible" />

<Button
    android:id="@+id/today_btn"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/centerVertical"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_toLeftOf="@+id/centerHorizontal"
    android:layout_marginTop="20px"
    android:layout_marginBottom="10px"
    android:layout_marginLeft="20px"
    android:layout_marginRight="10px"
    android:background="@drawable/button1"
    android:gravity="center"
    android:text="Today"
    android:textColor="#FFFFFF" >
</Button>

<Button
    android:id="@+id/nextweek_btn"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/centerVertical"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:layout_toRightOf="@+id/centerHorizontal"
    android:layout_marginTop="20px"
    android:layout_marginBottom="10px"
    android:layout_marginLeft="10px"
    android:layout_marginRight="20px"
    android:background="#EF5350"
    android:gravity="center"
    android:text="Next Week"
    android:textColor="#FFFFFF" >
</Button>

<Button
    android:id="@+id/later_btn"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/centerVertical"
    android:layout_toLeftOf="@+id/centerHorizontal"
    android:layout_marginTop="10px"
    android:layout_marginBottom="20px"
    android:layout_marginLeft="20px"
    android:layout_marginRight="10px"
    android:background="#66BB6A"
    android:gravity="center"
    android:text="Later"
    android:textColor="#FFFFFF" >
</Button>

<Button
    android:id="@+id/range_btn"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/centerVertical"
    android:layout_toRightOf="@+id/centerHorizontal"
    android:layout_marginTop="10px"
    android:layout_marginBottom="20px"
    android:layout_marginLeft="10px"
    android:layout_marginRight="20px"
    android:background="#5C6BC0"
    android:gravity="center"
    android:text="Range"
    android:textColor="#FFFFFF" >
</Button>

XML Layout

【问题讨论】：

显示你的布局文件
你想要什么背景到文字？让我们说一下排行榜文本的背景？
显示 XML 并在此处提及您想做什么，您的问题有点混乱
@Abhishek 是的。会是这样。具有背景作为图像的按钮。在图像的底部，将有一个文本。从上图中，右侧有一个称为排行榜的按钮。其中在底部，有一个文本，它也有不同的背景颜色。如何做到这一点？
您将为此任务使用自定义布局

标签： android xml android-layout android-studio android-activity

【解决方案1】：

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/centerVertical"
    android:layout_marginBottom="20px"
    android:layout_marginLeft="10px"
    android:layout_marginRight="20px"
    android:layout_marginTop="10px"
    android:layout_toRightOf="@+id/centerHorizontal">

    <Button
        android:id="@+id/range_btn"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#5C6BC0"
        android:gravity="center"
        android:text="Range"
        android:textColor="#FFFFFF" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="#061FAF"
        android:drawableRight="@drawable/mail_icon"
        android:text="range text"
        android:textColor="#FFFFFF" />

</RelativeLayout>

【讨论】：

我已经为一个按钮完成了此操作。如果有帮助，您可以对其他按钮进行相应的更改

【解决方案2】：

您可以通过添加 RelativeLayout 而不是 Button 轻松做到这一点。

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:layout_alignParentBottom="true">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:layout_centerVertical="true"
            android:layout_marginLeft="20dp"/>

        <Button
            android:layout_width="40dp"
            android:layout_height="40dp" 
            android:layout_centerVertical="true"
            android:layout_alignParentEnd="true"
            android:layout_marginRight="20dp"/>

</RelativeLayout>

只需将文本设置为TextView 并将源添加到Button。

【讨论】：

@ImAtWar 但这并不能满足所有的按钮。假设我有 4 个在活动中。
@Abhishek 你能解释一下你的问题吗？什么意思？
我想实现一个网格类型的 2x2 按钮。完全如描述中的图像所示。我该怎么做？
只是认为你的RelativeLayout是按钮，给onClick到RelativeLayouts而不是按钮。
但是如何获取图片中圈出的文字和不同的背景？

【解决方案3】：

你需要这样做。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="match_parent"
android:orientation="vertical">

<ImageView
    android:layout_width="match_parent"
    android:layout_height="250dp" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:oreantation="horizontal">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="12dp"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
</LinearLayout>

【讨论】：

【解决方案4】：

https://stackoverflow.com/a/8823469/5898862

这是使用布局创建自定义按钮的最佳解决方案。您可以使用android:background 属性轻松设置背景颜色

【讨论】：

【解决方案5】：

根据我的理解，你想要的是 - 你需要一个按钮背景颜色，它与上面的图像相似/接近。？

在 Android 5.0 版本中，添加了一个类，可帮助您从位图中提取颜色。 Palette

下面是示例代码，您将从图像中获取相应的背景，稍后您可以将其设置为按钮。

Palette.generateAsync(bitmap, new Palette.PaletteAsyncListener() {
    public void onGenerated(Palette palette) {
        // You will get color here
    }
});

可能的颜色组合有：

充满活力
充满活力的黑暗
充满活力的灯光
静音
柔和的黑暗
柔和的灯光

要使用上述类，请在您的项目中添加以下依赖项：

dependencies {
    ...
    compile 'com.android.support:palette-v7:21.0.+'
}

=======================或======================== =

另一种方法是您可以通过图像位图获得相应的颜色：

public static int getRespectiveColor(Bitmap bitmap) {
    Bitmap newBitmap = Bitmap.createScaledBitmap(bitmap, 1, 1, true);
    final int color = newBitmap.getPixel(0, 0);
    newBitmap.recycle();
    return color;
}

希望以上两者都能解决您的问题。 :) 干杯！！！

【讨论】：