ImageButtonにテキストを表示する方法は?


127

私が持っているImageButtonと私はそれにテキストや画像を表示したいです。しかし、エミュレータを試してみると:

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

画像は表示されますが、テキストは表示されません。どうすればテキストを表示できますか?私を助けてください!

回答:


271

使用できないためandroid:text、通常のボタンを使用し、複合ドローアブルの1つを使用することをお勧めします。例えば:

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

あなたが好きな場所で使用して描画可能に置くことができます:drawableTopdrawableBottomdrawableLeftまたはdrawableRight

更新

ボタンの場合、これもかなりうまく機能します。パッティング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" />

私はこの問題を抱えていて、完全に機能しています。


2
このオプションは、2つのテキストビューでサンドされた画像のような、見栄えのするボタンレイアウトが必要でない限り、最適に機能します。私はもともとwidget.buttonとして定義されたレイアウトオブジェクトを試し、それにimageviewとtextviewを配置しましたが、それと上記のButtonレイアウトをプロファイリングした後、測定時間を30%近く、レイアウト時間を50%節約し、15 FramLayoutの描画時間は-20%で、38個のオブジェクトから26個に減少しました。これはかなりの節約になります。
エヴァンR.

3
@shim drawableTop等、ボタンの上部に下部にdrawableRightを引き出し可能に配置されます
クリスティアン

1
@RenanBandeiraはい、uset setCompoundDrawables*()メソッド
Cristian

6
ボタンに合わせて画像を拡大縮小するにはどうすればよいですか?または、ボタンに合わせて画像を自動的に調整します。
Alston 2014

3
@Stallmanと同じ質問です。画像をボタンに合わせて左に設定するにはどうすればよいですか。
Khuong 2015

63

ImageButton本当にやりたい場合は、技術的にキャプションを付けることが可能です。ただ置くTextView上でImageButton使用FrameLayoutTextviewクリック可能にしないことを忘れないでください。

例:

<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>

これはLollipopでは機能しないようですが、他のものでは完全に機能します。
香港

2
この方法の問題は、テキストがボタンの状態(無効など)の影響を受けないことです...手動で変更しない限り。
TheOperator 2016

9

設定とログアウトボタンを開発する必要がある皆さん、以下のコードを使用しました。 ここに画像の説明を入力してください

    <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" />

4

実際にandroid:textは、これは受け入れられる引数ではありませんImageButton が、指定された背景(androidのデフォルトではない)でボタンを取得しようとしている場合は、android:backgroundxml属性を使用するか、次のようにクラスから宣言します.setBackground();


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>

素晴らしい解決策!onClickは、LinearLayoutでも完全に機能します。ボタンまたはImageButtonを使用する理由がわからない
Sam


2

最良の方法:

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

2
これは、OPが最初に試みたものと何ら変わらないようです。
PhonicUK

コードを間違えました。ImageButtonではなく、単なるButtonでした。
eloytxo 2012年

2

ImageButtonとをTextView内側に配置することでこれを解決しましたLinearLayout。よく働く!

<LinearLayout
    android:id="@+id/linLayout"
    android:layout_width="80dp"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <ImageButton
        android:id="@+id/camera_ibtn"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_gravity="center"
        android:background="@drawable/camera" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="@string/take_pic"
        android:textColor="#FFFFFF"
        android:textStyle="bold" />

</LinearLayout>

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"/>

0

ImageButton持つことはできませんtext(または、少なくともandroid:textその属性にリストされていません)。

トリックは:

を使用する必要があるようですButtondrawableTopまたはを見てくださいsetCompoundDrawablesWithIntrinsicBounds(int,int,int,int))

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.