Android: Módulo 02: Introducción a la Programación

Presentación:

https://drive.google.com/open?id=0B7Ct7K_LTJvSRkFPdEkwRUgzV00

Android: Módulo 01: Instalación y Configuración

Presentación:

https://drive.google.com/open?id=0B7Ct7K_LTJvSQi15RE51VEhVdHc

Android: Laboratorio 1

Acceso a Web API de Github que retorna datos en Formato JSON.

https://api.github.com/search/repositories?q=android&sort=stars

1. Iniciar el Emulador e intentar accesar el URL anterior.
2. Crear un nuevo Proyecto de Android siguiendo los pasos:

Modificar el Layout activiy_demo_json.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_demo_json"
    android:orientation="vertical"
    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"
    tools:context="com.example.android.demojson.DemoJSONActivity">

    <EditText
        android:id="@+id/et_buscar"
        android:textSize="22sp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/tv_url"
        android:textSize="22sp"
        android:layout_marginTop="8dp"
        android:text="Muestra el URL a Consultar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ScrollView
        android:layout_marginTop="16dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">


        <TextView
            android:id="@+id/tv_github_resultados"
            android:textSize="18sp"
            android:text="Muestra Los Datos"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </ScrollView>
</LinearLayout>

Agregar un nuevo String en los Recursos

1. Ir a la carpeta res/values/ archivo strings.xml
2. Agregar la línea siguiente:

<string name="search">Buscar</string>

Agregar un directorio y un nuevo archivo en los Recursos para el menú

Seguir los pasos siguientes:

Modificar el menú principal.xml

<?xml version="1.0" encoding="utf-8"?>

<!-- TODO (04) Agregar el item al menú -->

<menu xmlns:android="http://schemas.android.com/apk/res/android"

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

    <item

        android:title="@string/search"

        android:id="@+id/action_search"

        android:orderInCategory="1"

        app:showAsAction="ifRoom"

        />

</menu>

Modificar la Clase DemoJSONActivity.java

package com.example.android.demojson;



import android.content.Context;

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.view.Menu;

import android.view.MenuItem;

import android.widget.EditText;

import android.widget.TextView;

import android.widget.Toast;



public class DemoJSONActivity extends AppCompatActivity {



    // TODO (01) Variables para asociar los Views o Widgets del Layout

    EditText mBuscarET;

    TextView mUrlTV;

    TextView mGithubResultadosTV;



    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_demo_json);



        // TODO (02) findViewById para asociar elementos

        mBuscarET = (EditText) findViewById(R.id.et_buscar);

        mUrlTV = (TextView) findViewById(R.id.tv_url);

        mGithubResultadosTV = (TextView) findViewById(R.id.tv_github_resultados);



    }



    // TODO (05) Desplegar la Barra de Menú

    @Override

    public boolean onCreateOptionsMenu(Menu menu) {

        getMenuInflater().inflate(R.menu.principal, menu);

        return true;

    }



    // TODO (06) Evento Cuando se selecciona el Menú

    @Override

    public boolean onOptionsItemSelected(MenuItem item) {

        int itemId = 0;

        //Id del Elemento Seleccionado

        itemId = item.getItemId();

        //Si es igual al Elemento Buscar

        if (itemId == R.id.action_search)   {

            //Contexto de la Aplicación

            Context contexto = DemoJSONActivity.this;

            String texto = "Buscar Seleccionado";

            //Muestra un mensaje utilizando Toast

            Toast.makeText(contexto, texto,

                    Toast.LENGTH_LONG).show();

            return true;

        }

        return super.onOptionsItemSelected(item);

    }

    

}

Agregar la Clase RedUtils.java en el mismo paquete de DemoJSONActivity

package com.example.android.demojson;

import android.net.Uri;

import java.io.IOException;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import java.util.Scanner;

/**
 * Created by Daniel Santizo Saldaña on 1/03/2017.
 */

// TODO (07) Clase que agrega funciones de Internet
public class RedUtils {
    //URL Base
    final static String GITHUB_BASE_URL =
            "https://api.github.com/search/repositories";
    //Parámetro que indica la palabra a buscar
    final static String PARAM_QUERY = "q";

    /*
     * Parámetro y valor para Ordenar los Resultados.
     * Default: resultados son ordenados por la palabra a
     * buscar más parecida a la solicitud.
     */
    final static String PARAM_SORT = "sort";
    final static String sortBy = "stars";

    /**
     * Construye el URL para hacer la consulta en Github.
     *
     * @param githubSearchQuery Palabra Clave a Buscar.
     * @return El URL a enviar como Request al Servidor por los resultados.
     */
    public static URL buildUrl(String githubSearchQuery) {
        //Clase del Framework de Android Uri
        Uri xUri;
        //Construye el Uri, utilizando el URL Base
        //y los Parámetros de Busqueda y Orden
        xUri = Uri.parse(GITHUB_BASE_URL).buildUpon()
                .appendQueryParameter(PARAM_QUERY, githubSearchQuery)
                .appendQueryParameter(PARAM_SORT,sortBy)
                .build();

        //URL a Retornar
        URL url = null;

        try {
            //Construye URL utilizando el String que
            //Corresponde al Uri
            url = new URL(xUri.toString());
        }
        catch (MalformedURLException ex)    {
            //Exception por URI incorrecto
            ex.printStackTrace();
        }
        return url;
    }

    /**
     * Este método retorna la respuesta completa del HTTP Respuesta.
     *
     * @param url El URL para realizar el HTTP Request.
     * @return El contenido del HTTP Response.
     * @throws IOException Exception relacionada con la red y el Scanner.
     */
    public static String getResponseFromHttpUrl(URL url) throws IOException {
        HttpURLConnection urlConnection = (HttpURLConnection) url.openConnection();
        try {
            InputStream in = urlConnection.getInputStream();

            Scanner scanner = new Scanner(in);
            scanner.useDelimiter("\\A");

            boolean hasInput = scanner.hasNext();
            if (hasInput) {
                return scanner.next();
            } else {
                return null;
            }
        } finally {
            urlConnection.disconnect();
        }
    }

}

Modificar la Clase DemoJSONActivity.java   ( TODO 08 y 09 )

package com.example.android.demojson;



import android.content.Context;

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.view.Menu;

import android.view.MenuItem;

import android.widget.EditText;

import android.widget.TextView;

import android.widget.Toast;



import java.io.IOException;

import java.net.URL;



public class DemoJSONActivity extends AppCompatActivity {



    // TODO (01) Variables para asociar los Views o Widgets del Layout

    EditText mBuscarET;

    TextView mUrlTV;

    TextView mGithubResultadosTV;



    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_demo_json);



        // TODO (02) findViewById para asociar elementos

        mBuscarET = (EditText) findViewById(R.id.et_buscar);

        mUrlTV = (TextView) findViewById(R.id.tv_url);

        mGithubResultadosTV =(TextView) findViewById(R.id.tv_github_resultados);



    }



    // TODO (08) Método de Consultas

    void realizarBusqueda() {

        //Recupera la Palabra a buscar

        String Consulta = mBuscarET.getText().toString();

        //Construye el URL combinado la Base y los parámetros

        URL buscarUrl = RedUtils.buildUrl(Consulta);

        //Muestra el TextView el URL

        mUrlTV.setText(buscarUrl.toString());





    }



    // TODO (05) Desplegar la Barra de Menú

    @Override

    public boolean onCreateOptionsMenu(Menu menu) {

        getMenuInflater().inflate(R.menu.principal, menu);

        return true;

    }



    // TODO (06) Evento Cuando se selecciona el Menú

    @Override

    public boolean onOptionsItemSelected(MenuItem item) {

        int itemId = 0;

        //Id del Elemento Seleccionado

        itemId = item.getItemId();

        //Si es igual al Elemento Buscar

        if (itemId == R.id.action_search)   {

            //Contexto de la Aplicación

            Context contexto = DemoJSONActivity.this;

            String texto = "Buscar Seleccionado";

            //Muestra un mensaje utilizando Toast

            Toast.makeText(contexto, texto,

                    Toast.LENGTH_LONG).show();



            // TODO (09) Consultar

            realizarBusqueda();



            return true;

        }

        return super.onOptionsItemSelected(item);

    }



}

Agregar un icono a la aplicación para ser visualizado en el Launcher de Android.

Agregar el permiso al archivo app/manifests/AndroidManifest.xml para acceso a Internet

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.android.demojson">

    <!-- TODO (10) Agregar Permiso Internet -->
    <uses-permission android:name="android.permission.INTERNET"></uses-permission>

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".DemoJSONActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

Modificar el método realizarBusqueda() la clase DemoJSONActivity.java ( TODO 11 )

// TODO (08) Método de Consultas
void realizarBusqueda() {
    //Recupera la Palabra a buscar
    String Consulta = mBuscarET.getText().toString();
    //Construye el URL combinado la Base y los parámetros
    URL buscarUrl = RedUtils.buildUrl(Consulta);
    //Muestra el TextView el URL
    mUrlTV.setText(buscarUrl.toString());


    // TODO (11) Llamar al Método para Obtener Resultados
    String gitResults = null;
    try {
        gitResults = RedUtils.getResponseFromHttpUrl(buscarUrl);
        //Muestra resultados en pantalla
        mGithubResultadosTV.setText(gitResults);
    }
    catch (IOException ex)  {
        ex.printStackTrace();;
    }
}

Agregar la clase interna GithubTask y modificar el método realizarBusqueda(…)     (TODO 12-15)

    // TODO (12) Crear una inner Class
    public class GithubTask extends AsyncTask<URL, Void, String> {
        //Método que ejecuta una tarea en Thread independiente
        @Override
        protected String doInBackground(URL... urls) {
            // Recibe urls como un Arreglo de URL

            //Obtiene el primer elemento de la colección
            URL urlBusqueda = urls[0];

            String resultados = null;

            //Realiza la operación de Acceso a Internet
            //En un Thread independiente del UI Thread
            try {
                resultados=RedUtils.getResponseFromHttpUrl(urlBusqueda);
            }
            catch (IOException ex)  {
                ex.printStackTrace();
            }
            return resultados;
        }

        //Método que se ejecuta al terminar el método
        //doInBackground(...)
        @Override
        protected void onPostExecute(String s) {
            if ( s != null &&  !s.equals("")  ) {
                mGithubResultadosTV.setText(s);
            }
        }

    }

    // TODO (08) Método de Consultas
    void realizarBusqueda() {
        //Recupera la Palabra a buscar
        String Consulta = mBuscarET.getText().toString();
        //Construye el URL combinado la Base y los parámetros
        URL buscarUrl = RedUtils.buildUrl(Consulta);
        //Muestra el TextView el URL
        mUrlTV.setText(buscarUrl.toString());


        // TODO (11) Llamar al Método para Obtener Resultados
        String gitResults = null;
        try {
            // TODO (13) Colocar Comentarios
//            gitResults = RedUtils.getResponseFromHttpUrl(buscarUrl);
//            //Muestra resultados en pantalla
//            mGithubResultadosTV.setText(gitResults);
            // TODO (14) Instanciar la Clase Interna
            new GithubTask().execute(buscarUrl);
        }
        // TODO (15) Modificar la Clase del catch
        catch (Exception ex) {
            ex.printStackTrace();
        }
    }

Modificar el método onPostExecute de la Clase GithubTask

//Método que se ejecuta al terminar el método
//doInBackground(...)
@Override
protected void onPostExecute(String s) {
    if ( s != null &&  !s.equals("")  ) {
        //Declaración de la Clase
        JSONObject resultadosJSON;
        String sConteoTotal=null, sMostrar=null;
        try{
            //Instancia de la Clase
            resultadosJSON = new JSONObject(s);
            //Accesa en base al nombre de la propiedad
            sConteoTotal = resultadosJSON.getString("total_count");
            //Concatena los resultados
            sMostrar = "Conteo Total: " + sConteoTotal + " "+ s;
            //Asigna la Respuesta al TextView
            mGithubResultadosTV.setText(sMostrar);
        }
        catch (JSONException ex)    {
            ex.printStackTrace();
        }

    }
}

Android: Resumen

Presentación

Módulo 01: Introducción
https://drive.google.com/open?id=0B7Ct7K_LTJvSdnBGN2pLdXZpU2M

Referencias

http://galileotalentodigital.blogspot.com/2017/02/android-referencias.html

Android: Referencias

Referencias

Install Android Studio
https://developer.android.com/studio/install.html


Common Android Views
https://drive.google.com/file/d/0B5XIkMkayHgRMVljUVIyZzNmQUU/view


Style - Color (Lectura Obligatoria)
https://material.io/guidelines/style/color.html#


Style - Typography (Lectura Obligatoria)
https://material.io/guidelines/style/typography.html#typography-styles


Layout - Units & measurements (Lectura Obligatoria)
https://material.io/guidelines/layout/units-measurements.html


Platform Versions
https://developer.android.com/about/dashboards/index.html#Platform