Bienvenidos sean a este post, hoy volveremos a ver gestos pero esta vez lo implementaremos en Asteroides, esto nos dara la posibilidad de poder de tener una forma alternativa para poder ingresar a nuestras opciones, dejemos la chachara y pongamos manos a la obra.
Abramos Android Studio, y entremos en nuestra app llamada Asteroides, una vez dentro vamos a hacer algunas modificaciones, nuestra primera modificacion sera agregar el archivo de gestos (gestures) a nuestra app, si no lo borraron debera estar donde lo dejaron de lo contrario vayan a este post para ver como crearlo nuevamente y descargarlo pero antes debemos crear nuestro directorio de recurso, sobre el recurso res haremos click con el boton derecho y seleccionaremos New -> Android Resource Directory, en el cuadro que aparece modificaremos el campo Directory name por raw, en Resource type setearemos raw y por ultimo en Source set ira main (en caso de no quedar asi deben elegirlo), pulsen Ok para cerrar el cuadro y generar el nuevo recurso, cuando tengamos el recurso creado debemos ir a la carpeta donde esta el archivo gestures, una vez ahi debemos copiarlo con Ctrl+C o con el boton derecho y la opcion Copiar, ahora seleccionaremos el nuevo recurso (raw) y haremos Ctrl+V o click con el boton derecho y la opcion Paste, nos aparecera un nuevo cuadro, lo dejan como aparece y pulsen Ok, con esto agregaremos un nuevo recurso en el directorio quedandonos de la siguiente forma

android95

Con este recurso agregado ahora pasaremos a modificar el archivo activity_main.xml, donde agregaremos el siguiente codigo al principio del archivo:

< android.gesture.GestureOverlayView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/gestos"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gestureStrokeType="multiple"
    android:fadeOffset="800" >

Y cerrandolo como ultima linea, es decir debera quedar asi:

< ?xml version="1.0" encoding="utf-8"? >
< android.gesture.GestureOverlayView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/gestos"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gestureStrokeType="multiple"
    android:fadeOffset="800" >

    < LinearLayout
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    android:padding="30dp"
    android:background="@drawable/fondo"
    android:id="@+id/principio"
    tools:context=".MainActivity" >
    ...
    < /LinearLayout >
< /android.gesture.GestureOverlayView >

Donde ahora nuestro nuevo elemento cubrira totalmente a nuestro layout anterior, lo unico que debemos modificar adicionalmente es mover la siguiente linea del LinearLayout:

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

Al elemento controlador de gestos (GestureOverlayView), el resto de los elementos deben quedar exactamente como estaban antes.

Nota: Esto mismo deben hacerlo para la vista apaisada (landscape) sino cuando giren el dispositivo no funcionaran los gestos.

Con estas modificaciones realizadas procedamos a modificar a la clase MainActivity, primero implementaremos la posibilidad de poder interpretar los gestos, para ello modificaremos la linea de la clase de la siguiente forma:

public class MainActivity extends AppCompatActivity
        implements GestureOverlayView.OnGesturePerformedListener{

Luego agregaremos la siguiente linea dentro de la clase:

private GestureLibrary librearia;

Despues modificaremos al metodo onCreate() agregando las siguientes lineal al final del mismo:

librearia = GestureLibraries.fromRawResource(this,R.raw.gestures);
if (!librearia.load())
    finish();

GestureOverlayView gestosView = (GestureOverlayView) 
        findViewById(R.id.gestos);
gestosView.addOnGesturePerformedListener(this);

Estas se encargaran de obtener los gestos de la libreria gestures, en caso de no poder cargarlo cierra la aplicacion con un metodo finish(), despues crearemos un enlace entre el elemento del layout y nuestro codigo java, y por ultimo a este enlace le daremos la habilidad de poder leer los gestos interpretados sobre nuestra app para nuestra siguiente modificacion agregaremos el siguiente metodo dentro de la clase MainActivity:

public void onGesturePerformed(GestureOverlayView ov, Gesture gesto){
    ArrayList< Prediction > predicciones = librearia.recognize(gesto);
    if (predicciones.size() > 0){
        String comando = predicciones.get(0).name;
        if (comando.equals("play")){
            lanzarJuego(null);
        } else if(comando.equals("configurar")){
            lanzarPreferencias(null);
        } else if(comando.equals("acerca_de")){
            lanzarAcercaDe(null);
        } else if(comando.equals("cancelar")){
            finish();
        }
    }
}

Este se encargara de crear una sobrecarga del metodo onGesturePerformed() y esta se encargara de interpretar los gestos, por medio de un ArrayList el cual utilizara el objeto libreria para interpretarlos y donde si el metodo size() es mayor a cero compara las predicciones y en donde considere que sean iguales a las de la libreria llamara al metodo asociado a cada uno de los gestos. Una vez agregado el nuevo metodo en MainActivity la clase nos quedara de la siguiente manera:

package com.tinchicus.asteroides;

import android.content.Intent;
import android.content.SharedPreferences;
import android.gesture.Gesture;
import android.gesture.GestureLibraries;
import android.gesture.GestureLibrary;
import android.gesture.GestureOverlayView;
import android.gesture.Prediction;
import android.graphics.drawable.Animatable;
import android.preference.PreferenceManager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.Toast;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity
        implements GestureOverlayView.OnGesturePerformedListener{

    private GestureLibrary librearia;

    public static AlmacenPuntuaciones almacen =
            new AlmacenPuntuacionesArray();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        LinearLayout jugar = (LinearLayout) findViewById(R.id.principio);
        Animation animacion = AnimationUtils.loadAnimation(this,
                R.anim.aparecer);
        jugar.startAnimation(animacion);
        librearia = GestureLibraries.fromRawResource(this,R.raw.gestures);
        if (!librearia.load())
            finish();

        GestureOverlayView gestosView = (GestureOverlayView)
                findViewById(R.id.gestos);
        gestosView.addOnGesturePerformedListener(this);

    }
    public void lanzarJuego(View view){
        Intent i = new Intent(this, Juego.class);
        startActivity(i);
    }
    public void lanzarAcercaDe(View view){
        Intent i = new Intent(this, AcercaDe.class);
        startActivity(i);
    }
    public void lanzarPreferencias(View view){
        Intent i = new Intent(this, Preferencias.class);
        startActivity(i);
    }

    public void lanzarPuntuaciones(View view){
        Intent i = new Intent(this, Puntuaciones.class);
        startActivity(i);
    }

    public void mostrarPreferencias(View view){
        SharedPreferences pref =
                PreferenceManager.getDefaultSharedPreferences(this);
        String s = "música: " + pref.getBoolean("musica",true)
                + ", graficos: " + pref.getString("graficos","?");
        Toast.makeText(this,s,Toast.LENGTH_SHORT).show();
    }

    public void onGesturePerformed(GestureOverlayView ov, Gesture gesto){
        ArrayList< Prediction > predicciones = librearia.recognize(gesto);
        if (predicciones.size() > 0){
            String comando = predicciones.get(0).name;
            if (comando.equals("play")){
                lanzarJuego(null);
            } else if(comando.equals("configurar")){
                lanzarPreferencias(null);
            } else if(comando.equals("acerca_de")){
                lanzarAcercaDe(null);
            } else if(comando.equals("cancelar")){
                finish();
            }
        }
    }
}

Con todas estas modificaciones realizadas podemos probar nuestra app, veamoslo a traves del siguiente video

En este caso podemos ver con dos gestos dibujados sobre nuestro equipo virtual como este llama a la funcion relacionada esto es ideal, como dijimos en el post anterior, para equipos con poca pantalla.
En resumen, hoy hemos implementado de forma mas practica los gestos, lo hemos agregado a nuestra app para tener una alternativa a los botones que hacen las mismas acciones, espero les haya sido util sigueme en Twitter, Facebook o Google+ para recibir una notificacion cada vez que subo un nuevo post en este blog, nos vemos en el proximo post.

Anuncios