lunes, 20 de junio de 2016

001 Android studio. Crear app

Practica001: Desarrollo de App Android para dispositivos móviles  
Ing. Honoria Reyes Macedo
Herramientas:
IDE: Android Studio  
Lenguaje de Programación: Java
Sistema Operativo para instalación: Android
Sistema Operativo para desarrollo: Windows

INTRODUCCION
Programar en Android involucra utilizar componentes como:
Activity(Interfaz de la aplicación),
Intents(Invocar actividades y servicios, paso de  mensajes para realizar acciones), 
Services(Ejecutados en segundo plano, operaciones de larga duración o procesos remotos), 
Content Providers(Gestionar datos para compartir ), 
Broadcast receivers(Para responder a anuncios broadcast de sistema), 
Notifications(eventos de o para el usuario).

Nota: Crear un Activity es crear una Interfaz(un archivo .xml)
     - ¿QUE PASA AL CREAR UN Activity activity_main.xml?:
     a) Al crear un Activity activity_main.xml, debe ser en la carpeta del proyecto res/layout/
     b) Se genera automáticamente un archivo MainActivity.class en la carpeta java/
                       (Esta clase hereda de la clase Activity)
     c) Se genera automáticamente un archivo content_main.xml en la carpeta res/layout/


     d) Se genera automáticamente su archivo menu_main.xml en la carpeta res/menu/

    - CONFIRMAR el uso de las clases nuevas en el archivo AndroidManifest.xml

                a) Duplicar el bloque de <Activity>

                b) Cambiar el nombre de la clase por la nueva clase generada

                c) En category en lugar de LAUNCHER (indica clase principal), 
                       poner Default

    - Nota: *Algunos IDE van agregando la confirmación en forma automática en                                      AndroidManifest.xml,

     * No siempre los archivos .class tendrán su archivo .xml



                * El Paquete Instalador al final del desarrollo, contendrá:

          la compilación generada + datos + recursos: los guarda en un APK
 

SECCION DE INSTALACION DE ANDROID STUDIO
1.- Instalar JDK de java
     - Ejecutar el instalador
     - Dar de alta la variable de ambiente JAVA_HOME (Desde System de Panel de                       Control)
                 poner en el valor la ruta donde se instaló, Ejemplo:    
                    “C:\Program Files\Java\jdk1.7.0_79\bin”

2.- Instalar el IDE(Integrated Developer Environment) de Android
- Instalar Android Studio
           - Dar de alta la variable de ambiente JDK_HOME (Desde System de Panel de                       Control)
    poner en el valor la ruta donde se instaló: 
         “C:\Program Files\Java\jdk1.7.0_79\bin”

 3.- Instalar los emuladores (La instalacion de estos puede durar mas de dos horas )
verifica el punto 7.1 para instalarlos

CREAR PROYECTO

1.- Crear un nuevo proyecto “_________________”   (Elegir un nombre)
                a) File + New Project

- Capturar el nombre del proyecto, datos del dominio y la ubicación
                (Escoge una ubicacion a la que puedas tener acceso para respaldar)
- Presionar <Next>
- Seleccionar la API 15  en Minimum SDK  de la opcion Phone and Tablet
- Presionar <Next>
- Selecciona Blank Activity   y presiona <Next>

  Observar que por default va a crear:
  1) Una clase MainActivity.java    //Aquí se pondra la ejecución de los eventos
  2) Una interfaz activity_main.xml    //Aqui diseñamos la interfaz. En versiones nuevas se utililiza el archivo content_main.xml  para diseñar la interfaz.
  3) Le pone un titulo “MainActivity”
  4) Y crea un menú menu_main.xml      //Aquí se pondra el menu de la pantalla
           
  Para terminar seleccionar finish

Los archivo los dejara organizados de la siguiente manera: (Checar en el proyecto que se acaba de crear)
Observar la carpeta values y sus archivos de recursos para la aplicación: colors.xml, dimens.xml, strings.xml, styles.xml


Nota: Observa en la siguiente imagen que el archivo activity_main.xml y content_main.xml hace referencia al contexto del archivo MainActivity.java.    (Verificar en el proyecto que se acaba de crear)




Nota: Observa en la siguiente imagen que el archivo  MainActivity.java en su método onCreate()  enlaza a la interfaz activity_main.xml. (Verificar en el proyecto que se acaba de crear)




2.- Crear el siguiente archivo strings.xml  como RECURSO DE TEXTO(si es que no existe) y captura tus etiquetas
           - en la carpeta  app/res/values/

       


Nota: Por cada elemento que se agrega al strings.xml se crea automáticamente su 
identificador en el archivo R.java
 
 
 
  
 
 Compilar cada vez que se  agregan cambios


3.- Crear el siguiente archivo colors.xml  (si es que no existe)  como RECURSO DE COLOR 
      y captura tus colores

         - en la carpeta  app/res/values/

New  + XML + Values XML File  + <Enter>
Nota: Los colores que se van a ocupar en las interfaces los definimos en hexadecimales.
Para buscar el equivalente de los colores que vas a usar buscar en esta pagina.
 
        http://html-color-codes.info/codigos-de-colores-hexadecimales/



4.- Crear el siguiente archivo styles.xml
y captura los estilos que se proponen
 
     - en la carpeta  app/res/values/
     Nota: deberas cambiar los colores que tu vas a trabajar y el tamaño de letra que usaras

<resources>
 <!--Tema para el formulario-->
    <style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="android:textColorPrimary">@color/azmarin</item>
    <item name="colorPrimary">@color/naranj</item>
    <item name="colorPrimaryDark">@color/amarillopastel</item>
    <item name="colorAccent">@color/naranjclar2</item>
    <item name="android:windowFullscreen">true</item>
    </style>
 
<!--Estilos personalizados para los componentes del formulario-->
    <style name="labels">
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:textAppearance">?android:attr/textAppearanceMedium</item>
        <item name="android:background">@color/azulito</item>
        <item name="android:textColor">@color/naranj</item>
        <item name="android:textSize">18dp</item>
        <item name="android:layout_marginTop">10dp</item>
    </style>
 
    <style name="edits">
        <item name="android:layout_width">fill_parent</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:textAppearance">?android:attr/textAppearanceMedium</item>
        <item name="android:textColor">@color/azmarin</item>
        <item name="android:textSize">18dp</item>
        <item name="android:layout_marginTop">10dp</item>
    </style>
 
    <style name="Message">
        <item name="android:textStyle">italic</item>
        <item name="android:textColor">@color/grisosc</item>
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">wrap_content</item>
    </style>
 
    <style name="Separator">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">1dp</item>
        <item name="android:background">@color/azulrey</item>
        <item name="android:layout_marginBottom">@dimen/activity_vertical_margin</item>
    </style>
 
    <style name="styBoton">
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:background">@color/azpizarfu</item>
        <item name="android:textColor">@color/amarillopastel</item>
        <item name="android:textSize">18dp</item>
        <item name="android:paddingTop">4dp </item>
        <item name="android:paddingBottom">4dp </item>
        <item name="android:paddingLeft">8dp </item>
        <item name="android:paddingRight">8dp </item>
    </style>
</resources>
 
 
 
5.- Hacer el diseño de la pantalla principal. en la carpeta  app/res/layout/
(en activity_main.xml y content_main.xml)   -
 
Agregar en la pantalla content_main.xml: Componentes para pedir el usuario y 
el password para accesar al sistema:
   Nota: En versiones anteriores a la 4 se debera trabajar en activity_main.xml  
                 
               Usar los siguientes componentes: 
                    (Arrastrar los Widgets y TextFields desde  Palette)      
 
               Un <TextView>  con el id: textVUsuario              
               Un <TextView>  con el id: textVPassw  ; con inputType="textPassword"               
               Un <EditText>  con el id: editTUsuario                
               Un <EditText>  con el id: editTPasw                
               Un <Button>  con el id: btnAceptar

           



 
 
Observar las partes de trabajo dentro del IDE. En este caso use la API 23 para interpretar el diseño 
 

          




 
  
Nota:

  






Para utilizar los recursos con doble click sobre cada componente:Nos enviara la lista a escoger 

de etiquetas que se capturo en el archivo strings.xml y poner los id respectivos.  Ejemplo:




 

Su arbol de componentes quedara asi:

                            Su codigo quedara asi:

                 Observa la linea  en donde text se cambia por hint, para facilitar la escritura      
                         android:hint="@string/editTUsuario"
















  5.1   Utilizar el siguiente dispositivo virtual y version para interpretar el layout, y 
observar que en Designer(parte derecha) se pueden ver los componentes que 
contendrá content_main.xml que a su vez esta contenido en activity_main.xml



 
 
 

 6.- Hacer un menu principal: 
           
- Agregar los items  en el archivo  menu_main.xml   en la carpeta  app/res/menu/ 


  <item android:id="@+id/action_Set" android:title="@string/action_settings "   
           android:orderInCategory="100" app:showAsAction="never" />   
 <item android:id="@+id/action_Sale" android:title="@string/action_Salir"     
           android:orderInCategory="101" app:showAsAction="never" />



  



 7.- Cargar el emulador  (Primero verifica que el punto 7.1 se haya realizado)


 




  
            Crear un emulador y ejecutarlo. (Dejar 

            corriendo, mientras continuar con los pasos siguientes)




            Nota:Se podran crear varios emuladores, para probar




  En este ejemplo te recomendamos
  usar el emulador Nexuz 4 API 22 (version Lollipop Android 5.1.1)

 







7.1 Instalar los emuladores: La siguiente es la pantalla que aparece cuando seleccionas Tools + Android + SDK Manager,  


 






 


Seleccionar Launch Standalone  SDK Manager, en el que podras descargar las diferentes versiones de android para desarrollo, y
acelerar el hardware. 



Para estas pruebas instala primero los extras, la API 15 y la API 23 como se muestra en la siguiente pantalla, e intenta trabajar con ellas 


 


 






 


 - Para estar verificando si el proyecto tiene errores



             a)
Se visualiza con el compilador Gradle




 


 


 






 


 


 





CONECTAR
EL CELULAR ANDROID AL ORDENADOR:

          (En caso de que no se quiera usar emuladores)



En caso de utilizar un celular
conectado a la computadora en lugar de un emulador










 a) En el celular
seleccionar en Ajustes: 



"Acerca
de"  + "Informacion del Software" + "Número de compilación" 



--> Al dar doble click en "Número de compilación"  aparece “Ya eres un Desarrollador”



Nota: Es de acuerdo al celular:  en el menu "Acerca de" aparece "Numero de compilacion", o "version de software" entre otros y directamente se dan los dos clicks

  



 b)  Activar: en "Ajustes" +
"Opciones del desarrollador" + "Depuración de USB"  (Seleccionar o activar)





 - Listo, ya se puede ejecutar
la aplicacion desde el ordenador.




 


 



8.- ENLAZAR CON UNA NUEVA ACTIVITY:




a)   Crear una nueva activity:  InicioActivity










 

b)   Capturar el código siguiente en la clase MainActivity.java:








* Implementar la clase a la interfaz OnClickListener 


           * Declaración de variables privadas de tipo EditText y Button


* Dentro del método onCreate indicar que componente corresponde a cada variable declarada



* Crear el método onClick()





         EL CODIGO QUEDARA ASI:  (Observar que el arreglo se



           declara al inicio de la clase )






Compilar:  (Notaras que no muestra error al compilar, pero al ejecutarlo no corre


                   porque no identifica la declaración del arreglo)






El compildor que se utiliza es el Gradle, los resultados se veran en la ventana Gradle Console 


En la ventana de Messages (parte inferior) Se pueden ver los errores de compilación      


En la ventana de AndroidMonitor + logcat puedes ver los errores al ejecutar la aplicación


 


Corregir en la declaración del arreglo:










 


 


 


Validar el usuario que se captura:  (Agregar las lineas en rojo)


 


@Override


 public void onClick(View v) {
    switch(v.getId()){
        case R.id.btnAceptar:
            try {
                Toast.makeText(this, "Validar Usuario", Toast.LENGTH_LONG).show();
                String varNombre=usuarioLocal.getText().toString();
                String varPwd=paswLocal.getText().toString();
                int pos =Arrays.binarySearch(nomArray, varNombre);

                if (varPwd.equals(pwdArray[pos])){
                    Toast.makeText(this, "Bienvenido", Toast.LENGTH_LONG).show();
                    Intent ir = new Intent(this, InicioActivity.class);
                    startActivity(ir);
                }

            }catch (Exception e ){
                Toast.makeText(this, "Error de Usuario: " + e, Toast.LENGTH_LONG).show();
            }
            break;
        default:
            // return super.onOptionsItemSelected(item);    }
} 


 


ooooooooooooooooooooooooooooooooooooooooooooooooo 







CUESTIONARIO




Como se organiza el proyecto android en el explorador de windows



a)      ¿Cual es la carpeta que contiene las interfaces?




b)     ¿Que extensión tienen las interfaces?




c)      ¿Que archivos se crean cuando generas una interfaz?




d)     ¿Cual es el archivo quecontiene las leyendas para 



           cada etiqueta que se genera en la interfaz?




e)     Esta etiqueta de tip EditText se genera en la interfaz activity_main.xml


         <EditText
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:id="@+id/editTUsuario"
         android:layout_gravity="center_horizontal"
         android:ems="20"
         android:hint="@string/editTUsuario" /> 



e.1) ¿Para que se utiliza? 







e.2) ¿En que archivo declaramos una variable de tipo EditText




para rescatar el valor de la etiqueta EditText de la interfaz?



 




e.3)¿Como declaramos la variable de tipo EditText?








e.4) ¿Como le indicamos que dicha variable va a contener la etiqueta




que esta en la interfaz



e.5) ¿Como asigno el valor de dicha variable a otra variable?








f)       ¿Que metodo es el primero que se ejecuta cuando corremos una interfaz?



g)      ¿En donde se genera el archivo r.java?



h)     ¿Que contiene el archivo r.java?



i)       ¿En que carpeta se genera el archivo AndroidManifest.xml




j)       ¿Que contiene el archivo AndroidManifest.xml




k)      ¿Cual es el compilador de android que utilizamos?










ooooooooooooo  oooooooooooooooooooo  ooooooooooooooooooooo  oooooooooooooooooooooooo


ooooooooooooo  oooooooooooooooooooo  ooooooooooooooooooooo  oooooooooooooooooooooooo 


 


 


 










Publicadas por



a la/s 






















Etiquetas:


















No hay comentarios.:















Publicar un comentario


















        

      









Suscribirse a:
Comentarios de la entrada (Atom)