Inicio Android Interfaz de usuario en Android: Controles básicos (I)

Interfaz de usuario en Android: Controles básicos (I)

por sgoliver

Actualizado: Mayo 2020

En el capítulo anterior del curso vimos los distintos tipos de layouts con los que contamos en Android para distribuir los controles de la interfaz por la pantalla del dispositivo. En los próximos capítulos vamos a hacer un repaso de los diferentes controles que pone a nuestra disposición la plataforma de desarrollo de este sistema operativo. Empezaremos con los controles más básicos y seguiremos posteriormente con algunos algo más elaborados.

En este primer post sobre el tema nos vamos a centrar en los diferentes tipos de botones y cómo podemos personalizarlos. El SDK de Android nos proporciona tres tipos de botones: los clásicos de texto (Button), los que pueden contener una imagen (ImageButton), y los de tipo on/off (ToggleButton y Switch).

No vamos a comentar mucho sobre ellos dado que son controles de sobra conocidos por todos, ni vamos a enumerar todas sus propiedades porque existen decenas. A modo de referencia, a medida que los vayamos comentando iré poniendo enlaces a su página de la documentación oficial de Android para poder consultar todas sus propiedades en caso de necesidad.

Control Button [API]

Un control de tipo Button es el botón más básico que podemos utilizar y normalmente contiene un simple texto. En el ejemplo siguiente definimos un botón con el texto «Click» asignando su propiedad android:text. Además de esta propiedad podríamos utilizar muchas otras como el color de fondo (android:background), estilo de fuente (android:typeface), color de fuente (android:textColor), tamaño de fuente (android:textSize), etc.

<Button android:id="@+id/btnBotonSimple"
        android:text="@string/click"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

Este botón quedaría como se muestra en la siguiente imagen:

Control ToggleButton [API]

Un control de tipo ToggleButton es un tipo de botón que puede permanecer en dos posibles estados, pulsado o no pulsado. En este caso, en vez de definir un sólo texto para el control definiremos dos, dependiendo de su estado. Así, podremos asignar las propiedades android:textOn y android:textoOff para definir ambos textos. Veamos un ejemplo a continuación.

<ToggleButton android:id="@+id/btnToggle"
        android:textOn="@string/on"
        android:textOff="@string/off"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

El botón se mostraría de alguna de las dos formas siguientes, dependiendo de su estado:

Control Switch [API]

Un control Switch es muy similar al ToggleButton anterior, donde tan sólo cambia su aspecto visual, que en vez de mostrar un estado u otro sobre el mismo espacio, se muestra en forma de deslizador o interruptor. Su uso sería completamente análogo al ya comentado:

<Switch android:id="@+id/btnSwitch"
        android:text="@string/seleccion"
        android:switchPadding="10dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/btnToggle" />

En este caso no hemos definido los textos de los estados On y Off (aunque podríamos hacerlo con las mismas propiedades android:textOn y android:textOff que ya conocemos) ya que la propia imagen del control debería ser suficientemente descriptiva. Lo que sí hemos asignado es la propiedad android:text para añadir un texto a la izquierda del control que sirve habitualmente para describir su función. También podemos asignar por ejemplo la propiedad android:switchPadding para definir el espacio entre el texto del control y su representación visual.

Su aspecto final quedaría de la siguiente forma:

Control ImageButton [API]

En un control de tipo ImageButton podremos definir una imagen a mostrar en vez de un texto, para lo que deberemos asignar la propiedad android:src. Normalmente asignaremos esta propiedad con el descriptor de algún recurso que hayamos incluido en las carpetas /res/drawable. Así, por ejemplo, en nuestro caso vamos a incluir una imagen llamada «ic_estrella» por lo que haremos referencia al recurso «@drawable/ic_estrella«Adicionalmente, al tratarse de un control de tipo imagen también deberíamos acostumbrarnos a asignar la propiedad android:contentDescription con una descripción textual de la imagen, de forma que nuestra aplicación sea lo más accesible posible. Otra propiedad que podemos asignar, también común a casi todos los tipos de botones, sería android:padding para definir el espacio entre el borde del botón y su contenido.

<ImageButton android:id="@+id/btnImagen"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/icono_estrella"
        android:src="@drawable/ic_estrella"
        android:padding="16dp" />

En una aplicación el botón anterior se mostraría de la siguiente forma:

Añadir imágenes a un proyecto de Android Studio

Android Studio incorpora una utilidad llamada Asset Studio con la que podemos añadir rápidamente a un proyecto algunas imágenes o iconos estándar de entre una lista bastante amplia de muestras disponibles, o utilizar nuestras propias imágenes personalizadas. Podemos acceder a esta utilidad haciendo por ejemplo click derecho sobre la carpeta /main/res del proyecto y seleccionando el menú New y después la opción Image Asset o Vector Asset (para añadir imágenes normales o vectoriales, respectivamente). En mi caso de ejemplo seleccionaré Vector Asset.

Esto nos da acceso a Asset Studio, donde podremos indicar el origen de la imagen (Clip Art = Colección de iconos estándar, Local File = Fichero externo), el nombre del recurso a incluir en el proyecto (en nuestro caso «ic_estrella»), el icono a utilizar que podremos elegir de una colección bastante extensa, el tamaño, y por último el color y la opacidad.

Al pulsar Next el asistente nos confirmará la carpeta donde colocará el recurso de imagen, habitualmente /main/drawable, y pulsaremos Finish para terminar.

Cabe decir además, que aunque existe este tipo específico de botón para imágenes, también es posible añadir una imagen a un botón normal de tipo Button, a modo de elemento suplementario al texto (compound drawable). Por ejemplo, si quisiéramos añadir un icono a la izquierda del texto de un botón utilizaríamos la propiedad android:drawableLeft indicando como valor el descriptor (ID) de la imagen que queremos mostrar, y si fuera necesario podríamos indicar también el espacio entre la imagen y el texto mediante la propiedad android:drawablePadding:

<Button android:id="@+id/btnBotonMasImagen"
        android:text="@string/click"
        android:drawableLeft="@drawable/ic_estrella"
        android:drawablePadding="5dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

El botón mostrado en este caso sería similar a éste:

Eventos de un botón

Como podéis imaginar, aunque estos controles pueden lanzar muchos otros eventos, el más común de todos ellos y el que querremos capturar en la mayoría de las ocasiones es el evento onClick, que se lanza cada vez que el usuario pulsa el botón. Para definir la lógica de este evento utilizaremos el método setOnClickListener(). La forma más habitual de hacer esto es la siguiente:

btnBotonSimple = findViewById(R.id.btnBotonSimple)
btnBotonSimple.setOnClickListener {
    lblMensaje.text = "Botón simple pulsado!"
}

En el caso de un botón de tipo ToggleButton o Switch suele ser de utilidad conocer en qué estado ha quedado el botón tras ser pulsado, para lo que implementaremos dicho evento llamando al método setOnCheckedChangeListener(). Este evento recibe dos parámetros, el primero de ellos una referencia al propio botón que se ha pulsado (en este caso no nos interesa y por ello usamos la notación «_«) y el segundo (isChecked) que indica el estado resultante del botón.

En el siguiente ejemplo se comprueba el estado del botón tras ser pulsado y se realizan acciones distintas según el resultado.

btnToggle = findViewById(R.id.btnToggle)
btnToggle.setOnCheckedChangeListener { _, isChecked ->
    if (isChecked) {
         lblMensaje.text = "Botón Toggle: On"
    } else {
         lblMensaje.text = "Botón Toggle: Off"
    }
 }

Personalizar el aspecto un botón (y otros controles)

En las imágenes mostradas durante este apartado hemos visto el aspecto que presentan por defecto los diferentes tipos de botones disponibles. Pero, ¿y si quisiéramos personalizar su aspecto más allá de cambiar un poco el tipo o el color de la letra o el fondo?

Para cambiar la forma de un botón podríamos simplemente asignar una imagen a la propiedad android:background, pero esta solución no nos serviría de mucho porque siempre se mostraría la misma imagen incluso con el botón pulsado, dando poca sensación de elemento “clickable“.

La solución perfecta pasaría por tanto por definir diferentes imágenes de fondo dependiendo del estado del botón. Pues bien, Android nos da total libertad para hacer esto mediante el uso de selectores. Un selector se define mediante un fichero XML localizado en la carpeta /res/drawable, y en él se pueden establecer los diferentes valores de una propiedad determinada de un control dependiendo de su estado.

Por ejemplo, si quisiéramos dar un aspecto diferente a nuestro botón ToggleButton, para que sea de color azul y con esquinas redondeadas, podríamos diseñar las imágenes necesarias para los estados “pulsado” (en el ejemplo toggle_on.9.png) y “no pulsado” (en el ejemplo toggle_off.9.png) y crear un selector como el siguiente:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false" android:drawable="@drawable/toggle_off" />
    <item android:state_checked="true" android:drawable="@drawable/toggle_on" />
</selector>

En el código anterior vemos cómo se asigna a cada posible estado del botón una imagen (un elemento drawable) determinada. Así, por ejemplo, para el estado “pulsado” (state_checked="true") se asigna la imagen toggle_on.

Este selector lo guardamos por ejemplo en un fichero llamado toggle_style.xml y lo colocamos como un recurso más en nuestra carpeta de recursos /res/drawable. Hecho esto, tan sólo bastaría hacer referencia a este nuevo recurso que hemos creado en la propiedad android:background del botón:

<ToggleButton android:id="@+id/btnPersonalizado"
        android:textOn="@string/on"
        android:textOff="@string/off"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/toggle_style" />

En la siguiente imagen vemos el aspecto por defecto de nuestro ToggleButton personalizado con los cambios indicados:

Botones sin borde

Otra forma de personalizar los controles en Android es utilizando estilos. Los estilos merecen un capítulo a parte, pero comentaremos aquí algunos muy utilizados en las últimas versiones de Android, concretamente en el tema que nos ocupa de los botones.

En determinadas ocasiones, como por ejemplo cuando se utilizan botones dentro de otros elementos como listas o tablas, es interesante contar con todas la funcionalidad de un botón pero prescindiendo sus bordes de forma que adquiera un aspecto plano y se integre mejor con el diseño de la interfaz. Para ello, podemos utilizar el estilo borderlessButtonStyle como estilo del botón (propiedad style), de forma que éste se mostrará sin bordes pero conservará otros detalles como el cambio de apariencia al ser pulsado. Veamos cómo se definiría por ejemplo un botón de texto sin borde (por supuesto podríamos hacer lo mismo con un ImageButton):

<Button android:id="@+id/btnSinBorde1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/click"
        android:textColor="@color/colorPrimary"
        style="?android:attr/borderlessButtonStyle" />

Vemos en el código anterior cómo además del texto hemos definido su color asignando la propiedad android:textColor con el color primario definido para la aplicación (definido en el fichero /app/res/values/colors.xml). En la siguiente imagen vemos cómo quedaría este botón:

Barras de botones (Button Bar)

Otro lugar muy habitual donde encontrar botones sin borde es en las llamadas barras de botones (button bar) que muestran muchas aplicaciones. Para definir una barra de botones, utilizaremos normalmente como contenedor un LinearLayout horizontal e incluiremos dentro de éste los botones (Button) necesarios, asignando a cada elemento su estilo correspondiente, en este caso buttonBarStyle para el contenedor, y buttonBarButtonStyle para los botones. En nuestro ejemplo crearemos una barra con dos botones, Aceptar y Cancelar, que quedaría así:

<LinearLayout
        android:id="@+id/barraBotones"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        style="?android:attr/buttonBarStyle">

        <Button android:id="@+id/btnAceptar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/Aceptar"
            style="?android:attr/buttonBarButtonStyle" />

        <Button android:id="@+id/btnCancelar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/Cancelar"
            style="?android:attr/buttonBarButtonStyle" />

    </LinearLayout>

Visualmente el resultado sería el siguiente:

Para terminar, en la imagen siguiente se muestra la aplicación de ejemplo completa, donde se puede comprobar el aspecto de cada uno de los tipos de botón comentados:

CÓDIGO DEL ARTÍCULO: Puedes consultar y/o descargar el código completo de los ejemplos desarrollados en este artículo accediendo a la pagina del curso en GitHub.

También te puede interesar

57 comentarios

pacowar 19/08/2010 - 23:03

Muchisimas gracias!

Llevo varios días intentando aprender a desarrollar aplicaciones en Android y tus tutoriales me están ayudando muchísimo, tanto en la parte teórica como práctica.

Seguiré visitando tu blog para más tutoriales. Gracias por el curro!

Responder
sgoliver 20/08/2010 - 9:22

Me alegro de que sea de utilidad, espero tener tiempo para escribir mucho más sobre el tema. Saludos.

Responder
Desarrollo en Android | sgoliver.net blog 20/08/2010 - 9:19

[…] Interfaz de usuario en Android: Controles básicos (I) […]

Responder
Interfaz de usuario en Android: Controles básicos (II) | sgoliver.net blog 26/08/2010 - 22:51

[…] de haber hablado en el artículo anterior de los controles de tipo botón, en esta nueva entrega nos vamos a centrar en otros tres […]

Responder
Interfaz de usuario en Android: Controles básicos (III) | sgoliver.net blog 27/08/2010 - 9:49

[…] hablar de varios de los controles indispensables en cualquier aplicación Android, como son los botones y los cuadros de texto, en este artículo vamos a ver cómo utilizar otros dos tipos de controles […]

Responder
Trainux 31/08/2010 - 14:06

Brutal, me encantan tus tutoriales, por fin una pagina decente cn tutoriales xDD

Responder
Interfaz de usuario en Android: Controles de selección (I) | sgoliver.net blog 07/09/2010 - 0:43

[…] vez repasados los controles básicos (I, II, III) que podemos utilizar en nuestras aplicaciones Android, vamos a dedicar los próximos […]

Responder
Cnd 13/02/2011 - 15:15

No sabes como te agradezco tu interés en enseñar a los demás.
La única web española que realmente tiene utilidad a la hora de aprender!

Responder
Raquel 18/03/2011 - 9:31

seguramente mucha gente ya se habrá dado cuenta pero te comento por si lo quieres cambiar que en los ejemplos de «Eventos de un botón» sería btnBoton1.setText(«Botón 1 pulsado!») en lugar de lblMensaje.setText… y lo mismo para el segundo.

Un saludo!

Responder
José Luis 01/04/2011 - 13:07

Felicidades. Gran tutorial.

Estoy deseando exprimirlo al máximo y ponerme manos a la obra con un proyecto que tengo en mente.

Responder
Shanty 24/04/2011 - 12:02

jeje, aquí estoy, tema 2. Emmm, tengo un problemilla con el último botón. Veamos, en la carpeta drawable (las 3 que me genera Eclipse) he metido un XML plano, o sea, la opción de New>Other>XML>XML File, y he metido el código tuyo.

Lo que me está pasando es que no se ve el botón, el último ToogleButton del manual.

Responder
Shanty 24/04/2011 - 12:14

Siento el coñazo que te estoy dando. Ya me funciona, pero… me he bajado el típico png de ON OFF, y me pone el texto encima. O sea, quitando el android:textOn y el Off, sigue apareciendo el texto encima del botón.

A lo que me surge la pregunta. Se puede usar un ToggleButton sin que Android meta el texto de ON OFF??

Responder
Dennis Mike 06/05/2011 - 22:48

Muy bueno el tutorial gracias. una duda nomas en caso de que yo quiera poner los buttons en una posicion especifica en px. como le ago? espero tu respuesta gracias

Responder
karagos 09/08/2011 - 19:52

hola santy:
muy sencillo para lo del texto.

en android:textOn=»» no pones nada y no aparece nada
o android:textColor=»#00F1″ el primer cero despues de la almohadilla es el alfa o trasparencia que va de 0 a 9 continuando con «A» hasta «F» siendo «F» opaco y 0 transparente…. osea que no se ve
ESPERO HABER AYUDADO

Responder
Carlos 29/09/2011 - 18:07

Que onda bro gracias por tus tutoriales, muy buenos, tnego una duda en este tutorial, al copiar tu codigo en un nuevo proyecto en eclipse me marca un error en id
este:

final TextView lblMensaje = (TextView)findViewById(R.id.LblMensaje);

en R.id.Lbl queria ver si puedes ayudarme, se necsita deskargar algun pakete extra? saludos.

pd estas clases tngo
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageButton;
import android.widget.TextView;
import android.widget.ToggleButton;

Responder
xextina 30/09/2011 - 3:58

Gracias por este tutotial, bastante instuctivo.

Quiero hacerles una consulta, cuando utilizo la funcion setOnClickListener, android muestra un error indicando que la aplicacion se ha detenido inesperadamente. «Force Close»

Este es el codigo que utilizo:

public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.interfaz);
texto = (EditText) findViewById(R.id.cajaTexto);
boton = (Button) findViewById(R.id.btnInvertir);

boton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
texto.setText(«Esto es un prueba»);
}
});
}

No entiendo porque no funciona este evento, espero me puedan ayudar a resolverlo.

Gracias.

Responder
William 14/03/2012 - 20:09

Muchas gracias por estos tutoriales tan bueno, apenas me estoy iniciando en el tema de Android y los encuentro de maravilla, no solamente por las demostraciones, sino por el concepto de fondo con que son explicados.

Muchas gracias.

Responder
Ariel 05/04/2012 - 1:44

Muy buen post sobre Android

Responder
Bernardo 13/08/2012 - 2:21

Una pregunta, el código de los eventos de los botones donde hay que colocarlo?? no me quedó claro.. intenté ponerlo en el Activiy así:

final Button boton1 = (Button)findViewById(R.id.button1);

pero la linea me da un Force Close. Gracias por sus respuestas :)

Responder
sgoliver 13/08/2012 - 13:23

Hola Bernardo, al final del artículo tienes el código fuente completo del ejemplo, que puedes descargar y consultar en caso de cualquier duda sobre dónde definir cada cosa. De cualquier forma, decirte que ese código debe ir dentro del método onCreate() de la actividad. Saludos.

Responder
Elizabeth 31/08/2012 - 20:47

Buenas tardes a todos

yo estoy necesitando tomar unas fotos por medio de una aplicación de Android (que ya se hizo) pero quiero que me guarde pro carpetas que yo seleccione pero no he podido como y no encuentro como, no se si me puedan ayudar, si conocen algún foro donde este esto. les agradezco mucho la colaboración

que estén muy bien

Responder
Ernesto Martin 23/01/2013 - 20:13

Tengo un pequeño problema, al ingresar las imagenes en las carpetas res/drawable no las ingresa automaticamente a la clase R, lo cual me genera un error en el tag android:src» en el xml a la hora de poner la imagen en el ImageButton, el error dice que no existe el recurso :/

Responder
Pablo Videla 11/03/2013 - 2:45

Gracias por compartir, estoy iniciandome en android y no sabía como interactuar con botones, esta información me iluminó bastante.

Saludos.

Responder
Andres Ramirez 17/05/2013 - 16:24

Muchas Gracias por este tutorial realmente. resulta de mucho ayuda.

Responder
Joel 30/05/2013 - 4:45

Estoy siguiendo los tutoriales ya realice la primera aplicación con éxito, estoy intentando hacer este tutorial y fijándome en el código publicado en gitHub veo que usa varios Import… como se cuales hay que usar???

Responder
Matin 13/07/2013 - 4:35

despues de crear el archivo XML toggle_style.xml me lanza el siguente error:

Gradle: Execution failed for task ‘:Botones:processDebugResources’.
> Running C:\Users\martin_pc\AppData\Local\Android\android-studio\sdk\build-tools\android-4.2.2\aapt.exe failed. See output

Alguien sabe a qué se deba, gracias

Responder
Gonzalo 17/12/2013 - 13:53

Donde dice «android:textoOff» debería decir «android:textOff».
Gracias por este excelente tutorial.

Responder
uxia 14/01/2014 - 22:11

En el codigo para descargar faltan carpet as, como la carpeta bin. Asi no se via a abrir el proyecto en eclipse , no ?

Responder
Carlos 28/01/2014 - 22:50

Hola primero que nada agradecerte el blog pues me parece una pasada lo bien que esta.
Estoy intentando aprender algo de android y me ha surgido una duda viendo esta entrada, te comento:
¿que diferencia existe entre sobre cargar el metodo onclick poniendo en la cabezera «implements onClickListener» y definir el onclick como lo haces en esta entrada?

Muchas gracias nuevo.

Responder
Andres 02/04/2014 - 0:37

Hola que tal amigo, muchas gracias por los tutoriales. tengo una pregunta. yo quiero exportar mis propios botones personalizados . como hago. gracias y saludos

Responder
Kevin 07/07/2014 - 1:05

Hola,
primero, te agradezco que tengas la voluntad de compartir tu conocimiento con los demas. Y segundo, quiero hacer una consulta, Probé el hacer el selector, y funciono perfectamente con un ToggleButton, pero mi duda es como hacer lo mismo para Button. Quiero saber como colocarle un fondo a un Button, pero que al momento de ser presionado, tenga ese color azul que un Button normal tiene. Por que si solo le coloco el fondo, no parece boton.

Responder
Ricardo 12/07/2014 - 22:06

Me encantan tus guías.

Responder
eragoon 18/12/2014 - 20:21

Muchas Gracias por tu blog Salvador

Responder
Interfaz de usuario en Android: Controles básicos (II) | sgoliver.net blog 05/02/2015 - 19:03

[…] de haber hablado en el artículo anterior de los controles de tipo botón, en esta nueva entrega nos vamos a centrar en otros tres […]

Responder
Interfaz de usuario en Android: Controles básicos (III) | sgoliver.net blog 07/02/2015 - 13:01

[…] hablar de varios de los controles indispensables en cualquier aplicación Android, como son los botones y los cuadros de texto, en este artículo vamos a ver cómo utilizar otros dos tipos de controles […]

Responder
Interfaz de usuario en Android: Controles de selección (I) | sgoliver.net blog 17/02/2015 - 19:02

[…] vez repasados los controles básicos (I, II, III) que podemos utilizar en nuestras aplicaciones Android, vamos a dedicar los próximos […]

Responder
Julian Falcionelli 20/03/2015 - 15:00

Gracias por tanto, perdón por tan poco :P

Responder
Michael 08/05/2015 - 23:52

Llevo ya varios dias con problemas con el boton flotante que no lo reconoce, y me genera error … que puedo hacer.

Responder
Actionbar / Appbar / Toolbar en Android (I) | sgoliver.net blog 18/05/2015 - 19:02

[…] Los iconos ic_buscar e ic_nuevo los he añadido al proyecto de igual forma que en artículos anteriores, por ejemplo como vimos en el artículo sobre botones. […]

Responder
JxDarkAngel 22/05/2015 - 21:38

Muchas gracias, no sabía como hacías uso del prefijo -> fab , pero revise tu proyecto y vi que agregaste una referencia al inicio del XML del diseño para poder acceder a las propiedades del boton flotante. A lo mejor faltaría que lo mencionaras como parte del tutorial de este apartado.

De nuevo, muchas gracias, excelente trabajo, muy bien explicado y aparte te mantienes actualizado. Gracias!

Responder
javisali 10/06/2015 - 16:57

Hola.

estoy intentando hacer el ejemplo del boton flotante, y mepasa varias cosas.
1) al insertar la imagen desde imagen assets me la pone en res/mipmap y no en drawable.
a que es devido esto?
funciona igual manera?

2) me muestra en el movil mi imagen pero pequeña y con fondo de otro color que no he definido.

que tamaño es el adecuado para generar los iconos, para insertarlos luego en el projecto y que image asset lo redimensione?

Responder
javisali 11/06/2015 - 12:52

estoy intentando hacer el ejemplo del boton flotante, y me pasa varias cosas.

1) al insertar la imagen desde imagen assets me la pone en res/mipmap y no en drawable.
a que es devido esto?
funciona igual manera?

2) me muestra en el movil mi imagen pero pequeña y con fondo de otro color que no he definido.
CORRECCION (el fondo ya esta solucionado, queda solo la imagen que me sale muy pequeña)

que tamaño es el adecuado para generar los iconos, para insertarlos luego en el projecto y que image asset lo redimensione?

Responder
javisali 12/06/2015 - 17:04

hola.

tengo otra consulta, me e encontrado un problemilla con la sombra, poniendo android:elevation, la sombra puedo hacerla mas grande omas pequeña, pero la sombra de cuando se presiona el boton como se controla el tamaño?

Saludos.
Javier,,

Responder
Francisco Javier Ramírez 18/06/2015 - 17:21

Excelente material, muy entretenido no aburre el leerlo. gracias.

Responder
Carlos 07/07/2015 - 4:25

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

inCel = (EditText) findViewById(R.id.editText);
resTxt = (TextView) findViewById(R.id.resultadoTxt);
btnRes = (Button) findViewById(R.id.button1);
btnRes.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (inCel.getText().length() != 0 && inCel.getText().toString() !=(«»)) {
new AsyncCall().execute(inCel.getText().toString());
} else {
resTxt.setText(«Favor de introducir Grados»);
}
}
});

web = new WebComunicacion();
db_conv = new ConversionHelper(getApplicationContext());

}

me marca error en el onCreate pero ya le busque y no tiene nada mal

Responder
Ely 07/07/2015 - 4:26

Mejorando dia a dia, me encanta la pagina

Responder
Rubén 13/07/2015 - 15:46

Hola, gracias por los tutoriales, son muy útiles, pero en este me he quedado atascado, y estoy teniendo un problema sumamente absurdo. No consigo que me funcionen los «onClick». Los estoy poniendo en activity_main.xml, y pese a que no me da ningún error, se me remarcan en beige. Creo que el problema, es que no los estoy poniendo en el sitio correcto. ¿Dónde iría exactamente el siguiente fragmento de código?

btnBotonSimple = (Button)findViewById(R.id.BtnBotonSimple);

btnBotonSimple.setOnClickListener(new View.OnClickListener() {
public void onClick(View arg0)
{
lblMensaje.setText(«Botón Simple pulsado!»);
}
});

btnToggle = (ToggleButton)findViewById(R.id.BtnToggle);

btnToggle.setOnClickListener(new View.OnClickListener() {
public void onClick(View arg0)
{
if(btnToggle.isChecked())
lblMensaje.setText(«Botón Toggle: ON»);
else
lblMensaje.setText(«Botón Toggle: OFF»);
}
});

Muchas gracias.

Responder
Hye 30/08/2015 - 22:10

Te amo! Muchas gracias por explicar también, eres un hermoso ser humano TT___TT Muchas Gracias!

Responder
Manuel 21/01/2016 - 12:44

Llevo un tiempo siguiendo los tutoriales, pero enter que Android Studio da constantemente errores de Renderizado y que en algunos momentos faltan explicaciones, se me está haciendo muy cuesta arriba seguir adelante.

Para el último botón de Material Design, primero hay que agregar la librería, pero ya no la versión que ahí aparece, si no la 23.1.1. Pero ni idea de si es por mi versión máxima de Android elegida para el proyecto por qué.

Luego, para poder usar el app:fabSize, hay que agregar la instrucción en el código de diseño, en el elemento (Layout) padre que contiene a todos los demás:

xmlns:app=»http://schemas.android.com/apk/res-auto»

Si no, tampoco funcionará.

Y otro error de renderizado… Es insufrible.

Responder
Alejandro Gomez 24/02/2016 - 19:59

Disculpa pero estoy perdido en la parte de FloatingActionButton, cuando llamas al metodo en el onCreate(), utilizas fabButton.
A mi me aparece error y no se por que sea

Responder
Marco Hernandez 30/04/2016 - 3:41

que tal que alguien me explique por que se me enciman o no respetan algunos controles el tamaño de su contenedor como me estoy dando de topes ya cambie propiedades he usado los distintos layouts pero no mas no se supone que deben respetar el ancho con la propiedad weigth pero no comprendo alguien me auxilie….soy principiante

Responder
Alex Navarro 06/01/2017 - 16:21

Excelente tutorial, muchas gracias por compartir tus conocimientos.

Responder
Controles básicos de Eclipse – Funcionando apps mòviles. 15/05/2018 - 23:20

[…] Controles básicos (I) […]

Responder
Interfaz de usuario en Android: Controles básicos (II) | sgoliver.net 03/05/2020 - 23:38

[…] de haber hablado en el artículo anterior  del curso de los controles de tipo botón, en esta nueva entrega nos vamos a centrar en otros […]

Responder
Interfaz de usuario en Android: Controles básicos (III) | sgoliver.net 14/05/2020 - 20:11

[…] hablar de varios de los controles indispensables en cualquier aplicación Android, como son los botones y los cuadros de texto, en este artículo vamos a ver cómo utilizar otros dos tipos de controles […]

Responder
Interfaz de usuario en Android: Controles de selección (I) | sgoliver.net 29/05/2020 - 19:01

[…] vez repasados los controles básicos (I, II, III) que podemos utilizar en nuestras aplicaciones Android, vamos a dedicar los próximos […]

Responder
Actionbar / Appbar / Toolbar en Android (I) | sgoliver.net 19/07/2020 - 23:14

[…] Los iconos ic_buscar e ic_nuevo los he añadido al proyecto de igual forma que en artículos anteriores, por ejemplo como vimos en el artículo sobre botones. […]

Responder

Dejar un comentario

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información. Aceptar Más Información

Política de Privacidad y Cookies