2011-07-22 21 views
8

Quiero crear un botón de Android con una imagen y texto, pero el texto se centra automáticamente. ¿Cómo coloco el texto en la parte inferior del botón?Botón con texto Y una imagen (Android)

Sé que puedo usar el diseño relativo para colocar un segundo botón de texto debajo de la imagen, pero prefiero minimizar el código.

+1

posible duplicado de [Android: la combinación de texto e imagen en un botón o ImageButton] (http: // stackoverflow. com/questions/1532876/android-combining-text-image-on-a-button-or-imagebutton) –

Respuesta

4

Si fuera usted, simplemente no usaría un botón. Use LinearLayout o RelativeLayout y simplemente dele el botón de fondo (Sugerencia: use un selector si desea que tenga diferentes imágenes para cada estado) y coloque su TextView dentro del mismo, luego puede usar los atributos drawableLeft, DrawableTop, etc. para poner la imagen en cualquier lado que desee. Si desea un mayor nivel de control en cuanto a dónde va la imagen en relación con el texto, utilice un TextView y un ImageView. Luego, en su java simplemente obtenga una referencia a su diseño y trátela como lo haría con un botón, con setOnClickListener().

+0

¡Excelente idea! De esta manera (una vista de texto y una vista de imagen dentro de una distribución lineal) uno podría controlar las posiciones y los tamaños exactos del texto y el icono. – Leeeeeeelo

+0

O vea [respuesta de Adam Storm] (http://stackoverflow.com/a/6793454/199364), para una forma simple de combinar texto e imagen, con imagen en el borde especificado del botón. – ToolmakerSteve

42

Se puede declarar en qué parte del botón que desea asignar la imagen (Im suponiendo que ya tiene la imagen en el botón):

<Button 
    android:id="@+id/button" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="- I'm a Button -" 
    android:drawableTop="@drawable/icon" 
    /> 

también se puede establecer el relleno entre el texto y la imagen con el androide : drawablePadding (int)

El atributo drawableTop puede cambiarse a drawable Right, Left, Bottom, etc. ¡buena suerte!

+0

Esto debería funcionar, estoy usando el mismo código – erdomester

+2

@ Adam's debería haber sido probablemente la respuesta aceptada. Creo que acaba de comenzar a aceptar aumentar su porcentaje. – FoamyGuy

+0

Esto funcionó para mí y más limpio que una vista personalizada. Pero quería agregar que el atributo drawablePadding le permitirá colocar relleno entre su texto e ícono. – Henry

0

Usted puede intentar algo como esto

<Button 
    android:id="@+id/ButtonTest" 
    android:text="this is text" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@drawable/icon" 
    **android:gravity="bottom"**/> 
0

Creo que la forma más sencilla de lograr esto (con XML puro) es:

<LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:onClick="onClickMethod" 
     android:orientation="vertical" 
     android:clickable="true"> 
    <ImageView 
     android:src="@drawable/YOUR_DRAWABLE" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:clickable="false"/> 
    <TextView 
     android:text="@string/YOUR_TEXT" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"   
     android:clickable="false"/> 
</LinearLayout> 
4

También puede hacer como esto

enter image description here

<LinearLayout 
android:id="@+id/image_button_2" 
style="@android:style/Widget.Button" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:layout_marginTop="15dp" 
android:gravity="center"> 

<ImageView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_marginRight="5dp" 
    android:src="@drawable/ic_gear" /> 

<TextView 
    android:id="@+id/image_button_2_text" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:textColor="@android:color/black" 
    android:text="Button 2" /> 

    </LinearLayout> 

En su actividad

final View button2 = findViewById(R.id.image_button_2); 
button2.setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 
1

enter image description here

<Button 
     android:layout_width="0dp" 
     android:layout_weight="1" 
     android:background="@drawable/home_button" 
     android:drawableLeft="@android:drawable/ic_menu_edit" 
     android:drawablePadding="6dp" 
     android:gravity="left|center" 
     android:height="60dp" 
     android:padding="6dp" 
     android:text="AndroidDhina" 
     android:textColor="#000" 
     android:textStyle="bold" /> 

para obtener más información http://androiddhina.blogspot.in/2015/09/how-to-add-image-inside-button.html