You are on page 1of 34

Android UI

Daro Fernando Chamorro Vela Junio 2012

Android UI
View ViewGroup View View

Activity

ViewGroup
setContentView()

View View

Propiedades Comunes
Width

Padding

Margin Padding

Heigth

Contenido

Contenedores

LinearLayout
El contenido es alineado uno en seguida de otro.

Propiedades Padre
Orientation : Vertical - Horizontal
Gravity : Posicin relativa de todo el contenido

Propiedades Hijo
Layout_Weight : peso o porcentaje que ocupa dicho contenido en el LinearLayout

FrameLayout
El contenido se superpone uno a otro en orden ascendente.

Propiedades Hijo
Layout_gravity : posicin relativa del elemento dentro del padre.

RelativeLayout
El contenido se organiza en relacion al padre y a otros Widgets.

Propiedades Hijo
Layout_ParentBottom : Alinea el elemento en la parte baja del padre Layout_CenterInParent : ubica el elemento en el centro del padre

Layout_Below: Ubica el elemento debajo del elemento referenciado


Layout_AlignLeft: Alinea el elemento a la izquierda del elemento referenciado

TableLayout
El contenido es ordenado en forma de tabla, utiliza un contenedor interno TableRow.

Propiedades Padre
Layout_span : # de columnas
StretchColumns : expande una o mas columnas para utilizar el espacio del padre ShrinkColumns : comprime una o mas columnas para ajustar el espacio del padre

Propiedades Hijo
Layout_Weight : peso o porcentaje que ocupa dicho contenido en el TableLayout o en el TableRow

ScrollView
El padre puede desplazar la vista para mostrar o esconder contenido, solo puede tener un hijo

Propiedades Padre
Orientation : Vertical - Horizontal

View Basicos

TextView
View para ingresar texto plano

Propiedades
Gravity : Posicin relativa de todo el contenido

TEXT VIEW
TEXT VIEW TEXT VIEW

TextColor : Color del Texto TextStyle : Estilo del texto


TextSize : Tamao del Texto

Text : Contenido del View


TypeFace : Fuente del Texto ShadowColor : Color de la Sombra ShadowDx : Posicin de la sombra en X Shadow Dy : Posicin de la sombra en Y

ShadowRadius : Dispersin de sombra

Button
View que efecta una accin al ser presionado

Propiedades
Text : Texto del Button

Codigo
setOnClickListener : Realiza una accin despues de realizarse un Click Aceptar

EditText
View que permite el ingreso de texto Texto de una sola lnea

Propiedades
Hint: Texto que se despliega cuando el campo esta vacio MaxLines: Determina el numero mximo de lneas en el EditText CursorVisible: Determina si el cursor de texto es visible InputTipe: Determina el tipo de dato del Texto Contenido de Texto en forma de prrafo para el EditText

ImageView
View que puede contener imgenes

Propiedades
Src : Fuente de la Imagen

Codigo
setImageResource : Carga una imagen en el ImageView a partir de un Recurso

CheckBox
View que permite realizar una seleccin de un item. Checkbox Activado !

Propiedades
Cheked: Estado actual del CheckBox Button: Imagen del icono seleccionable Checkbox Desactivado !

Codigo
setChecked : Fija el estado del CheckBox isChecked : Determina el estado del CheckBox

RadioGroup RadioButton
View que permite realizar una seleccin nica entre una lista de opciones. RadioButton 1

Propiedades Padre
CheckedButton: RadioButton Seleccionado Orientation: Orientacin del contenido, Vertical - Horizontal

RadioButton 2
RadioButton 3

Propiedades Hijo
Checked: Fijar estado inicial del RadioButton Button: Imagen del icono seleccionable

View Especiales

Adapters !!
Los adaptadores ofrecen una interfaz de datos comn para alimentar el contenido de este tipo de Widgets Convierte los datos en datos visibles

Codigo
ArrayAdapter<Clase> nombre = new ArrayAdapter<Clase>(Contexto, Recurso, Datos);

Personalizado
public View getView(int position, View convertView, ViewGroup parent) { return convertView; }

ListView
Arreglo de items seleccionables en forma de lista

Propiedades
DividerHeight: Distancia entre los items de la lista ChoiceMode: Fija el tipo de seleccin a simple o mltiple

GridView
Arreglo de items seleccionables en dos dimensiones

Propiedades
NumColumns: Fija el numero de columnas VerticalSpacing: Fija el espacio vertical entre items

HorizontalSpacing: Fija el espacio horizontal entre items


ColumnWidth: Fija el ancho de las columnas

Spinner
Despliega una lista opciones de seleccionables. Opciones

Propiedades
Entries: Fija el Array de datos a partir de un Recurso

Codigo
setDropDownViewResource: Enlaza a un recurso especifico de Datos

AutoCompletEditText
EditText que despliega una lista de opciones segn se ingresa el texto. Da

Propiedades
CompletionHint: Define el valor por defecto al desplegar las opciones CompletionThreshold: Define el numero mnimo de caracteres para generar la recomendacin

Daro Daniel Danny Daniela

TabsView
Organiza el contenido por medio de pestaas en una sola pantalla

Componentes
TabHost: Contenedor Padre de las pestaas y del contenido TabWidget: Implementa la fila de TabButtons, debe tener como id @android:id/tabs FrameLayout: Contiene el contenido de los tabs, debe tener como id @android:id/tabcontent

TAB 1

TAB 2

TAB 3

Men Contextuales

Options Menu
Acciones relevantes para el Activity Actual, como Buscar, Configuraciones. Agregar

Codigo
onCreateOptionsMenu : Constructor del Options Menu onOptionsItemSelected : Se define las acciones a realizar despus de seleccionar un Item

Opt 1

Opt 2

Opt 2

Contextual Menu
Acciones especificas para un elemento de la interfaz de usuario.

Codigo
onCreateContextMenu : Constructor del Contextual Menu onContextItemSelected : Se define las acciones a realizar despus de seleccionar un Item

Opt 2 Opt 3

Opt 4
Opt 5

Alertas y Mensajes

Toast
Mensaje temporal que sirve para informar al usuario de una eventualidad que no requiera su interaccin

Codigo
Toast.makeText : Construye el Toast con el contexto, mensaje y tiempo

Notificacin para el Usr

AlertDialog
Alerta para informar al usuario de una eventualidad, esta requiere la interaccin del usuario Titulo Contenido de la Alerta !

Codigo
AlertDialog.Builder : Construye la alarma con las caractersticas definidas

+ Button

- Button

Navegacin

Intents !!
Forma de representar una accin a travs de mensajes.
La forma de comunicacin de en Android funciona alrededor de Intents y receptores de Intents.

URL
Contexto

GET
Accion

Navegacin !!
Codigo - Crear Intent
Intent intent = new Intent(Contexto , NombreDestino.class);

Codigo Envio de Datos


Intent.putExtra( Nombre de Etiqueta, Valor );

Codigo Iniciar Activity


startActivity(intent);

Informacin
Sitio Oficial http://www.android.com Android Developer http://developer.android.com/index.html

Gracias !