Tecnologías que aprenderas

Native Development

Desarrollo bajo el SDK de Android para aplicaciones nativas, poderosas y veloces.

PhoneGap + Jquery Mobile + Algo mas

Desarrollo bajo tecnologías web aplicadas en dispositivos móviles. Rápidas, bonitas y faciles de crear.

Node.js, WebSockets And Git.

1. Desarrollo de sistemas de comunicación sincronos y asincronos.
2. Manejo de sistema de control de versiones con Git.
3. Metodologías de desarrollo Ágil.

Recomendaciones

Conocimientos previos

1. Conocimientos intermedios en Programación
2. Conocimientos básicos en HTML
3. Conocimientos básicos en CSS
4. Conocimientos básicos en Javascript
5. Disposición, Disciplina y muchas ganas de Aprender

Software Necesario

1. Android SDK download
2. Eclipse Classic 4+ download
3. ADT Plugin download
4. PhoneGap 2.5+ download
5. Jquery Mobile 1.3+ download
6. Node.js download
7. Sublime Text 2 download
8. Google Chrome download

Guias de instalación

1. Guía de como instalar el plugin ADT en ECLIPSE.
2. Guías de como iniciar con PhoneGap.

Headers and Footers

Buttons

Forms Elements

Forms Elements

Forms Elements

Forms Elements

Listviews

Listviews

Dialogs

Panels

Accordion

Accordion

La aplicación del Día

Aplicación No-Oficial Cinépolis

El objetivo

Generar una aplicación móvil que pueda obtener datos reales de la cartelera al día de Cinépolis y mostrarla de una forma ordenada, simple, básica, pero funcional y elegante.

La arquitectura

Los bocetos: Principal

Los bocetos: Complejos

Los bocetos: Cartelera

Mános a la obra

a programar !!

Lo referente a la resolución

Lo referente a la resolución

Los Layouts

1. FrameLayout
2. LinearLayout
3. TableLayout
4. GridLayout
5. RelativeLayout

FrameLayout

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <EditText android:id="@+id/TxtNombre"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:inputType="text" />

</FrameLayout>
				    	

LinearLayout

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <EditText android:id="@+id/TxtDato1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:inputType="text"
        android:layout_weight="1" />

</LinearLayout>
				    	

TableLayout

<TableLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TableRow>
        <TextView android:text="Celda 1.1" />
        <TextView android:text="Celda 1.2" />
        <TextView android:text="Celda 1.3" />
    </TableRow>

    <TableRow>
        <TextView android:text="Celda 2.1" />
        <TextView android:text="Celda 2.2" />
        <TextView android:text="Celda 2.3" />
    </TableRow>

    <TableRow>
        <TextView android:text="Celda 3.1"
               android:layout_span="2" />
        <TextView android:text="Celda 3.2" />
    </TableRow>
</TableLayout>
				    	

GridLayout

<GridLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:rowCount="2"
    android:columnCount="3"
    android:orientation="horizontal" >

        <TextView android:text="Celda 1.1" />
        <TextView android:text="Celda 1.2" />
        <TextView android:text="Celda 1.3" />

        <TextView android:text="Celda 2.1" />
        <TextView android:text="Celda 2.2" />
        <TextView android:text="Celda 2.3" />

        <TextView android:text="Celda 3.1"
               android:layout_columnSpan="2" />

        <TextView android:text="Celda 3.2" />

</GridLayout>
				    	

RelativeLayout

<RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <EditText android:id="@+id/TxtNombre"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:inputType="text" />

        <Button android:id="@+id/BtnAceptar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/TxtNombre"
            android:layout_alignParentRight="true" />
</RelativeLayout>
				    	

Controles Básicos

1. Button
2. ToggleButton
3. ImageButton
4. ImageView
5. TextView
6. EditText
7. CheckBox
8. RadioButton

Button

<Button android:id="@+id/BtnBoton1"
    android:text="@string/pulsame"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />
				        

btnBoton1 = (Button)findViewById(R.id.BtnBoton1);

btnBoton1.setOnClickListener(new View.OnClickListener() {
    public void onClick(View arg0)
    {
        lblMensaje.setText("Botón 1 pulsado!");
    }
});
				        

ToggleButton

<ToggleButton android:id="@+id/BtnBoton2"
    android:textOn="@string/on"
    android:textOff="@string/off"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />
				        

btnBoton2 = (ToggleButton)findViewById(R.id.BtnBoton2);

btnBoton2.setOnClickListener(new View.OnClickListener() {
    public void onClick(View arg0)
    {
        if(btnBoton2.isChecked())
            lblMensaje.setText("Botón 2: ON");
        else
            lblMensaje.setText("Botón 2: OFF");
    }
});
				        

ImageButton

<ImageButton android:id="@+id/BtnBoton3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:contentDescription="@string/icono_ok"
    android:src="@drawable/ok" />
				        

btnBoton3 = (Button)findViewById(R.id.BtnBoton3);

btnBoton3.setOnClickListener(new View.OnClickListener() {
    public void onClick(View arg0)
    {
        lblMensaje.setText("Botón 3 pulsado!");
    }
});
				        

ImageView

<ImageView android:id="@+id/ImgFoto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/icon"
    android:contentDescription="@string/imagen_ejemplo" />
				        

ImageView img= (ImageView)findViewById(R.id.ImgFoto);
img.setImageResource(R.drawable.icon);
				        

TextView

<TextView android:id="@+id/LblEtiqueta"
    android:layout_width="matchfill_parent"
    android:layout_height="wrap_content"
    android:text="@string/escribe_algoEscribe algo:"
    android:background="#AA44FF"
    android:typeface="monospace" />
				        

final TextView lblEtiqueta = (TextView)findViewById(R.id.LblEtiqueta);
String texto = lblEtiqueta.getText().toString();
texto += "123";
lblEtiqueta.setText(texto);
lblEtiqueta.setBackgroundColor(Color.BLUE);
				        

EditText

<EditText android:id="@+id/TxtTexto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="text" />
				        

final EditText txtTexto = (EditText)findViewById(R.id.TxtTexto);
String texto = txtTexto.getText().toString();
txtTexto.setText("Hola mundo!")
				        

Controles de Selección

1. Spinner
2. ListView
3. GridView

Spinner

<Spinner android:id="@+id/CmbOpciones"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />
				        

cmbOpciones = (Spinner)findViewById(R.id.CmbOpciones);

final String[] datos =
        new String[]{"Elem1","Elem2","Elem3","Elem4","Elem5"};

ArrayAdapter<String> adaptador =
        new ArrayAdapter<String>(this,
            android.R.layout.simple_spinner_item, datos);

adaptador.setDropDownViewResource(
                android.R.layout.simple_spinner_dropdown_item);

cmbOpciones.setAdapter(adaptador);

cmbOpciones.setOnItemSelectedListener(
        	new AdapterView.OnItemSelectedListener() {
                public void onItemSelected(AdapterView parent,
                    android.view.View v, int position, long id) {
                        lblMensaje.setText("Seleccionado: " + datos[position]);
                }

                public void onNothingSelected(AdapterView parent) {
                    lblMensaje.setText("");
                }
        });
				        

ListView

<ListView android:id="@+id/LstOpciones"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
				        

final String[] datos =
    new String[]{"Elem1","Elem2","Elem3","Elem4","Elem5"};

ArrayAdapter<String> adaptador =
    new ArrayAdapter<String>(this,
        android.R.layout.simple_list_item_1, datos);

lstOpciones = (ListView)findViewById(R.id.LstOpciones);

lstOpciones.setAdapter(adaptador);
				        

GridView

<GridView android:id="@+id/GridOpciones"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:numColumns="auto_fit"
    android:columnWidth="80px"
    android:horizontalSpacing="5dp"
    android:verticalSpacing="10dp"
    android:stretchMode="columnWidth" />
				        

private String[] datos = new String[25];
//...
for(int i=1; i<=25; i++)
        datos[i-1] = "Dato " + i;

ArrayAdapter<String> adaptador =
        new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, datos);

grdOpciones = (GridView)findViewById(R.id.GridOpciones);

grdOpciones.setAdapter(adaptador);
				        

SQLiteOpenHelper

import android.content.Context;
import android.database.sqlite.SQLiteDatabase;
import android.database.sqlite.SQLiteDatabase.CursorFactory;
import android.database.sqlite.SQLiteOpenHelper;

public class UsuariosSQLiteHelper extends SQLiteOpenHelper {

    String sqlCreate = "...";

    public UsuariosSQLiteHelper(Context contexto, String name,
                               CursorFactory factory, int version) {
        super(contexto, name, factory, version);
    }

    @Override
    public void onCreate(SQLiteDatabase db) {
        db.execSQL(sqlCreate);
    }

    @Override
    public void onUpgrade(SQLiteDatabase db, int versionAnterior, int versionNueva) {

    }
}
				    	

SQLiteOpenHelper

import android.app.Activity;
import android.database.sqlite.SQLiteDatabase;
import android.os.Bundle;

public class MiActividad extends Activity
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        UsuariosSQLiteHelper usdbh = new UsuariosSQLiteHelper(this, "MiBasededatos", null, 1);

        SQLiteDatabase db = usdbh.getWritableDatabase();

    }
}