Lección 2: Creando Botones en una aplicación Android


Bienvenidos al 2do post de este tutorial que sale  semanalmente, en esta parte aprenderemos a hacer alguno de los botones en Android y manejar los Text Edit (Textos sobre la pantalla de Android). Si aún no han visto la primera parte pueden verla aquí y así ponerse al día con los cursos.

Instrucciones

  •  Creamos un proyecto Android, como lo hicimos en el 1er post.
  • Dentro del proyecto hay una carpeta llamada “res” dentro de esa carpeta esta otra carpeta llamada “Layout” y dentro de esa carpeta un archivo llamado activity_main.xml (depende de la versión de eclipse, en otras versiones sale como “main.xml”), como lo vemos en esta imagen:


  • A la derecha vemos una pantalla blanca que dice Hello world!, eso que vemos ahí es la Activity (o pantalla) que andamos configurando o programando, Esas pantallas poseen diferentes tipos de alineación en las cuales son:
  • Linear Layout (Vertical, Horizontal): Eso quiere decir que todos los objetos que están dentro de esa pantalla estarán ordenadas de forma lineal y de manera vertical u horizontal.
  • Relative Layout: Quiere decir que todos los objetos estarán de forma relativa al eje (0,0,0) de la pantalla, dicho de mejor manera, en este layout podemos poner todo donde queramos (Existen otros layouts pero no los usaremos por ahora).
  • En esa pantalla podemos usar un Drag and Drop (Agarrar y poner) para poner y hacer la pantalla a nuestros gustos, hay varias carpetas que contienen diferente herramientas para poner lo que queramos (Form widget, Text Field, etc).
  • Proseguimos a quitar el “Hello World” dándole clic derecho y delete (eliminar), lo hacemos de esta manera por que si le damos al botón suprimir puede ocasionar errores con el layout.
  • Para seguir leyendo esta segunda lección del Curso de Desarrollo en Android, dale click en 
  • Proseguimos a ingresar un botón y un texto, en la carpeta form widget elegimos un botón que dice “button” y lo ponemos en la pantalla (en otras versiones de eclipse el layout que sale por defecto es el relative, y en otros es el lineal, si tienen el lineal no podrán poner donde quieran las cosas pero no se preocupen eso por ahora), después en esa misma carpeta hay un texto que dice “Large” y lo ponemos donde queramos, nos quedara algo así:

Ya ahí tenemos una pantalla con un texto y un botón, para cambiar lo que dice el botón y lo que dice el texto ingresaremos en la pestaña que esta debajo que dice activity_main.xml:


Ahí entraremos al codigo xml de la pantalla en donde podemos hacer todo lo que hacemos con Drag and Drop, en código (eso es para los que le encanta echar códigos), en esa pantalla veremos 2 tags uno que dice <Button y otro que dice <TextView (No importa el orden), todo lo que este dentro de esos 2 tags (Tag significa etiqueta, es usado en los lenguajes basados en etiquetas como xml,html, etc). Configura todo, dentro de los 2 tags hay una función llamada android:text=”Button” y android:text=”Large Text”, si queremos cambiamos lo que está dentro de las comillas y automáticamente se cambiara el nombre del botón a lo que le pongamos, por ejemplo yo le pondré “Hola a todos” al botón y el texto “Presiona aquí para saludar”, (Cada vez que hagamos un cambio presionen crtl + s para guardar los cambios y se hagan efectivo) y nos quedara algo así:

  • Listo, ahora ya tenemos un botón y un texto que podemos programarlo por el archivo MainActivity.java que usamos en el 1er post, entramos a ese archivo y tenemos que hacer varias cosas, primero declarar las variables que vamos  a usar en este caso TextView y Button y también lo que haremos con ellas, nos quedara algo así: 
  • En ese caso solo tenemos los objetos Button y TextView, pero no sabemos dónde están ni que son, entonces tenemos que hacer una función que encuentre al botón en el xml y al texto en el xml esa función se llamada findViewById(), esa función encuentra cualquier objeto que tenga que ver con la vista con respecto a su ID (El ID está en el xml, le pueden cambiar el nombre si quieren para tener orden en su programa), tenemos que usar esa función por cada objeto que queramos buscarlo en la vista (o xml), y nos quedara algo así:
  •  Ya con esa función podemos interactuar con el botón y con el texto de la vista, existen 2 maneras de darle una funcion a los objetos de la vista:
  • 1era: Todo por el codigo java.
  • 2da: Por el codigo XML.

1era Forma:

En esta forma lo haremos todo por el código Java, (personalmente me gusta más), usaremos la función setonclicklistener(), que recibe lo que queremos programar que sería el view, y le decimos que será con click que funcionara y quedara algo así setonclicklistener(new View.onclicklistener(), eso lo aplicamos a todo lo que queramos que tenga el evento click, (Imágenes, texto, etc), y nos quedara algo así:

Dentro del método onclick(View arg0) podemos hacer todo lo que queramos que haga cuando se presione el botón, en este caso pondremos una nube de texto que dirá “Hola a todos” y ya, y nos quedara algo así: ya con eso, al presionar el botón hará una nube de texto diciendo “Hola a todos”, lo pueden probar como mostramos en el 1er post.

 

2da Forma:

En esta forma lo haremos con el código XML, la función se hará en Java (Lo que hará el botón cuando se presione) y el evento onclick se hará por el XML.

Primeros haremos lo que hará el botón cuando sea presionado en este caso una nube de texto que diga “Hola a todos”, en este caso no necesitamos los objetos de botón ni texto ya que trabajaremos en el código XML, y el los reconocerá directamente y nos queda algo así:


Después, entramos al XML de nuevo, en la sección de Drag & Drop, apretamos click derecho al botón–>Other Properties (Otras Propiedades) –>Inherited from view (Heredado por vista) –> Onclick… (Al presionar), algo así será:

 

 

Dentro del texto que dice onclick Value, ingresaremos el nombre de la función que queremos que haga cuando se presione el botón en mi casa serio “Hola” que fue el nombre de la función que le di los valores View, y queda algo así:

 

 

Probemos en cualquiera de los 2 casos y nos dará este resultado:

 

 

Bueno ya sabemos hacer botones, pónganse a programar e inventar sus ideas para hacer una buena aplicación, suerte a todos.

Síganme los buenos en @AnteroOfficial

Programar se aprende programando

 

Like
Like Love Haha Wow Sad Angry

José Rojas

Geek. Full Stack Web Developer. Android Developer.
Ingeniero en Informática. Msc. en Ingeniería de Software.
Trabajo con Linux, Android, Python, Ruby on Rails, Angular e Ionic.
Experto en Wordpress. Creador de Android Venezuela

Síguenos

Mantente al día. Opina. Pide ayuda.
Saluda. Queremos escucharte

Leer entrada anterior
Plan B, tu última esperanza en caso de robo o extravío de tu celular con Android

En Android hay muchas aplicaciones para recuperar celulares extraviados, pero todos requieren de instalación previa (antes que te lo roben...

Cerrar