viernes, 16 de enero de 2015

(clase #2)Android Studio: Aprendiendo a Utilizar Button, TexView .

En este apartado del blog aprenderemos a utilizar como primer aplicación en Android studio las herramientas button y Texview, crearemos una aplicación que tenga un texto en la pantalla (Texview) y al presionar  un botón (Button) este texto se cambiara por un saludo.
·         Antes de colocar las herramientas recordarles sobre los layout y mencionarles que utilizaremos el layout: RelativeLayout.
·         De la tabla de palettes de Android studio jalemos la herramienta Button y la herramienta Plain TexView

·         En cada herramienta démosle doble clic izquierdo y en la casilla de id pongámosle: para el button(id: btn_Saludar) y en TexView(id: tv_texto)


Para que nuestro texto(TexView) se vea mas grande podemos cambiar el tamaño en la propiedad texSize resalto de rojo en la imagen.

Ahora veremos la programación del botón saludar (Button) y como cambiaremos el texto inicial que es “New Tex” por un saludo como: “hola a todo el mundo”
·         Primero nos ubicaremos en el MainActivity, haciendo doble clic izquierdo.
·         Luego declararemos atributos que nos ayudaran a programar las herramientas colocadas en la imagen anterior. (Paso 2 – imagen)
·         Una vez declarado los atributos inicializaremos las variables declaradas vinculándolas a las herramientas colocadas en el layout o conocido también como el (xml).
·         Como siguiente paso programaremos el btn_saludar(Button), creando un método llamado clicbtnsaludar(View view) con los parámetros indicados estos parámetros nos servirán para poder  referenciar al evento clic del button.



Una vez declarado las variables y programado el botón, debemos vincular el método a al evento clic de la herramienta btn_saludar, este evento lo encontraremos en el cuadro de herramientas  con el nombre de Onclic (debemos ir al la interfaz “xml
“). Cabe resaltar que este evento solo funcionara si el método tiene como parámetro los objetos de tipo View.



En la parte seleccionada de rojo vemos el evento Onclic, y ahí elegimos el método que creamos en el MainActivity (clicbtnsaludar).
Para probar la aplicación nosotros utilizare un emulador de Android fuera del emulador de Android Studio, el emulador que utilizaremos será youwave. Esto será mejor enseñado en el video de nuestro canal: https://www.youtube.com/channel/UCkwxiqWcosxJ6fr4EQ7a0jQ
El resultado quedaría de eta forma:


Luego de darle cilc en el Button saludar veremos como cambia el texto:


Ahora dejaremos el código de la aplicación:
Primero el XML: ahí podemos notar la propiedades que cambiamos.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Text"
        android:id="@+id/tv_texto"
        android:textSize="30dp"
        android:layout_gravity="center_horizontal"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Saludar"
        android:id="@+id/btn_saludar"
        android:onClick="Clicbtnsaludar"
        android:layout_gravity="center_horizontal"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true" />
</RelativeLayout>

Ahora el código java del MainiActivity:

package com.dgafz.clase1;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;


public class MainActivity extends ActionBarActivity {

    //declaramos atributos
    private TextView m_tv_texto;
    private Button m_btn_saludar;
    //fin atributos
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //INICIALIZAMOS LOS ATRIBUTOS CON ESTA SENTENCIA DE CODIGO PARA ELLO NOS SERVIRA LOS ID QUE
        //CAMBIAMOS.

        m_tv_texto=(TextView) findViewById(R.id.tv_texto);
        m_btn_saludar=(Button) findViewById(R.id.btn_saludar);
    }
    //***********METODO QUE CAMBIARA EL TEXTO POR UN SALUDO************
    public void Clicbtnsaludar(View view)
    {
        //utilizaremos el metodo settex del texview para cambiar el texto

        m_tv_texto.setText("HOLA A TODO EL MUNDO");
    }
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}



No hay comentarios.:

Publicar un comentario