如何在ImageButton上显示文本？

时间：2010-12-16 02:46:04

标签： android imagebutton

我有一个ImageButton我希望在其上显示文字和图片。但是当我尝试使用模拟器时：

<ImageButton 
    android:text="OK" 
    android:id="@+id/buttonok" 
    android:src="@drawable/buttonok"
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" />

我得到图片但没有文字。我该如何显示文字？请帮帮我！

11 个答案:

答案 0 :(得分：242)

由于您无法使用android:text我建议您使用普通按钮并使用其中一个复合绘图。例如：

<Button 
    android:id="@+id/buttonok" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"
    android:drawableLeft="@drawable/buttonok"
    android:text="OK"/>

您可以使用：drawableTop，drawableBottom，drawableLeft或drawableRight将drawable放在任何位置。

<强>更新

对于一个按钮，这也很好。放android:background就好了！

<Button
    android:id="@+id/fragment_left_menu_login"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/button_bg"
    android:text="@string/login_string" />

我刚遇到这个问题并且工作正常。

答案 1 :(得分：57)

技术上可以在ImageButton上添加标题，如果你真的想这样做的话。只需使用TextView将ImageButton放在FrameLayout上。请记住不要使Textview可点击。

示例：

<FrameLayout>
    <ImageButton
        android:id="@+id/button_x"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@null"
        android:scaleType="fitXY"
        android:src="@drawable/button_graphic" >
    </ImageButton>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:clickable="false"
        android:text="TEST TEST" >
    </TextView>
</FrameLayout>

答案 2 :(得分：4)

实际上，android:text不是ImageButton接受的参数 但是，如果你想获得一个具有指定背景的按钮（不是android默认值），请使用android:background xml属性，或者使用.setBackground();

从类中声明它

答案 3 :(得分：4)

您可以使用LinearLayout而不是Button这是我在我的应用中使用的安排

 <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        android:background="@color/mainColor"
        android:orientation="horizontal"
        android:padding="10dp">

        <ImageView
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="@drawable/ic_cv"
            android:textColor="@color/offBack"
            android:textSize="20dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="@string/cartyCv"
            android:textColor="@color/offBack"
            android:textSize="25dp" />

    </LinearLayout>

答案 4 :(得分：3)

伙计我需要开发设置和注销按钮，我使用下面的代码。 enter image description here 

    <Button
        android:id="@+id/imageViewLogout"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/size_30dp"
        android:layout_alignParentLeft="true"
        android:text="Settings"
        android:drawablePadding="10dp"
        android:background="@android:color/transparent"
        android:layout_alignParentBottom="true"
        android:drawableTop="@drawable/logout" />

答案 5 :(得分：2)

您可以使用常规Button和android：drawableTop属性（或左，右，下）。

答案 6 :(得分：2)

最佳方式：

<Button 
android:text="OK" 
android:id="@+id/buttonok" 
android:background="@drawable/buttonok"
android:layout_width="match_parent" 
android:layout_height="wrap_content"/>

答案 7 :(得分：1)

这是一个很好的圈子示例：

drawable/circle.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">

    <solid
        android:color="#ff87cefa"/>

    <size
        android:width="60dp"
        android:height="60dp"/>
</shape>

然后是xml文件中的按钮：

<Button
    android:id="@+id/btn_send"
    android:layout_width="60dp"
    android:layout_height="60dp"
    android:background="@drawable/circle"
    android:text="OK"/>

答案 8 :(得分：1)

Here is the solution 

<LinearLayout
    android:id="@+id/buttons_line1"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <ImageButton
        android:id="@+id/btn_mute"
        android:src="@drawable/btn_mute"
        android:background="@drawable/circle_gray"
        android:layout_width="60dp"
        android:layout_height="60dp"/>
    <ImageButton
        android:id="@+id/btn_keypad"
        android:layout_marginLeft="50dp"
        android:src="@drawable/btn_dialpad"
        android:background="@drawable/circle_gray"
        android:layout_width="60dp"
        android:layout_height="60dp"/>
    <ImageButton
        android:id="@+id/btn_speaker"
        android:layout_marginLeft="50dp"
        android:src="@drawable/btn_speaker"
        android:background="@drawable/circle_gray"
        android:layout_width="60dp"
        android:layout_height="60dp"/>
</LinearLayout>
<LinearLayout
    android:layout_below="@+id/buttons_line1"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:layout_marginTop="10dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <TextView
        android:text="mute"
        android:clickable="false"
        android:textAlignment="center"
        android:textColor="@color/Grey"
        android:layout_width="60dp"
        android:layout_height="wrap_content"/>
    <TextView
        android:text="keypad"
        android:clickable="false"
        android:layout_marginLeft="50dp"
        android:textAlignment="center"
        android:textColor="@color/Grey"
        android:layout_width="60dp"
        android:layout_height="wrap_content"/>
    <TextView
        android:text="speaker"
        android:clickable="false"
        android:layout_marginLeft="50dp"
        android:textAlignment="center"
        android:textColor="@color/Grey"
        android:layout_width="60dp"
        android:layout_height="wrap_content"/>
</LinearLayout>

答案 9 :(得分：1)

在Text（带有图片）上显示button的最佳方法

example of text on button with image background

您的问题：如何在text上显示imagebutton？

答案：您无法将text与imageButton一起显示。在接受的答案中说出的方法也不起作用。

因为

如果您使用android:drawableLeft="@drawable/buttonok"，则无法在drawable的{​​{1}}中设置center。

如果您使用button，那么android:background="@drawable/button_bg"中的color将被更改。

在android world中，有成千上万的选项可以执行此操作。但是在这里，我根据我的观点提供了最好的选择。 （请参见下文）

解决方案：将drawable与cardView一起使用

您的LinearLayout用在drawable/image中，因为它显示在中间。借助LinearLayout，您可以为此设置textView。我们以text为背景cardView。

transparent

在这里我解释一些术语：

<androidx.cardview.widget.CardView android:layout_width="match_parent" android:layout_height="99dp" android:layout_margin="16dp" app:cardBackgroundColor="@android:color/transparent" app:cardElevation="0dp" app:cardUseCompatPadding="true"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/your_selected_image" > <TextView android:layout_width="match_parent" android:layout_height="match_parent" android:text="Happy Coding" android:textSize="33sp" android:gravity="center" > </TextView> </LinearLayout> </androidx.cardview.widget.CardView> 用于使app:cardBackgroundColor="@android:color/transparent"的背景透明

cardView用于隐藏app:cardElevation="0dp"周围的消失线

cardView提供的实际大小为app:cardUseCompatPadding="true"。使用cardView

时请始终使用

将cardView中的image/drawable设置为背景。

对不起，我的英语不好。

快乐编码：）

答案 10 :(得分：0)

ImageButton不能text（或者至少android:text未在其属性中列出）。

诡计是：

您似乎需要使用Button（并查看drawableTop或setCompoundDrawablesWithIntrinsicBounds(int,int,int,int))。

相关问题
最新问题