{"id":136,"date":"2013-03-06T11:54:29","date_gmt":"2013-03-06T11:54:29","guid":{"rendered":"http:\/\/www.einaweb.es\/develop\/?p=136"},"modified":"2013-03-12T14:21:27","modified_gmt":"2013-03-12T14:21:27","slug":"implementando-la-interfaz-de-usuario","status":"publish","type":"post","link":"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/","title":{"rendered":"Implementando la interfaz de usuario"},"content":{"rendered":"

Las interfaces de usuario en Android se pueden implementar de varias formas. Una de ellas es definirla en la propia clase de la actividad, aunque esta forma, a parte de ser poco elegante y poco estructurada, no proporciona una diferenciaci\u00f3n clara entre el propio c\u00f3digo de la aplicaci\u00f3n y el de la interfaz. Por lo que la forma m\u00e1s recomendada y la que utilizaremos para la implementaci\u00f3n de interfaces ser\u00e1 mediante XML. Estas interfaces se construyen a traves de controles llamados Views que ser\u00e1n el punto de interacci\u00f3n con el usuario. Los Views son la clase base para la creaci\u00f3n de widgets como por ejemplo botones, campos de texto, checkbox, etc. Por otro lado tenemos la clase ViewGroup que son contenedores de Views o incluso de otros ViewGroup como muestra la siguiente imagen.<\/p>\n

\"\"<\/div>\n

Tipos de Layouts<\/h2>\n
<\/div>\n

Los Layout son objetos derivados de la clase ViewGroup y determinan la posici\u00f3n que tendr\u00e1n los Views en la pantalla. A continuaci\u00f3n puedes ver los Layouts que nos proporciona Android:
\n
\n<\/strong>
\n<\/strong> Frame Layout<\/strong>
\nEste es el layout m\u00e1s simple, consiste en un marco que ocupa toda la pantalla. Los Views hijos que queramos agregar se posicionar\u00e1n en la esquina superior izquierda por lo que, si a\u00f1adimos varios de ellos, algunos quedar\u00e1n ocultos sobre otros.<\/p>\n

\n\n\n\n
<?<\/code>xml<\/code> version<\/code>=<\/code>\"1.0\"<\/code> encoding<\/code>=<\/code>\"utf-8\"<\/code>?><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
<<\/code>FrameLayout<\/code> xmlns:android<\/code>=<\/code>\"http:\/\/schemas.android.com\/apk\/res\/android\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"match_parent\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"match_parent\"<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>ImageView<\/code> android:id<\/code>=<\/code>\"@+id\/imageView1\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:src<\/code>=<\/code>\"@drawable\/and_logo\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"fill_parent\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"fill_parent\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n\n\n\n
<\/<\/code>FrameLayout<\/code>> <\/code>Linear Layout<\/strong><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

Este es el layout que se nos ofrece por defecto. Los Views hijos ser\u00e1n alineados de forma lineal uno tr\u00e1s de otro, ya sea horizontal o verticalmente, seg\u00fan especifiquemos en el atributo\u00a0orientation<\/em><\/strong>\u00a0en el fichero XML. Adem\u00e1s podemos modificar otros atributos para organizar los Views como por ejemplo sus margenes, gravedad, etc.<\/p>\n

\n\n\n\n
<?<\/code>xml<\/code> version<\/code>=<\/code>\"1.0\"<\/code> encoding<\/code>=<\/code>\"utf-8\"<\/code>?><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
<<\/code>LinearLayout<\/code> xmlns:android<\/code>=<\/code>\"http:\/\/schemas.android.com\/apk\/res\/android\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"match_parent\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"match_parent\"<\/code> android:orientation<\/code>=<\/code>\"vertical\"<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>Button<\/code> android:text<\/code>=<\/code>\"Button\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:id<\/code>=<\/code>\"@+id\/button1\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"fill_parent\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>Button<\/code> android:text<\/code>=<\/code>\"Button\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:id<\/code>=<\/code>\"@+id\/button2\"<\/code> android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"fill_parent\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>Button<\/code> android:text<\/code>=<\/code>\"Button\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:id<\/code>=<\/code>\"@+id\/button3\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"fill_parent\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n

<\/<\/code>LinearLayout<\/code>> <\/code><\/p>\n


\n<\/strong> Table Layout<\/strong><\/p>\n

En este layout los hijos son posicionados en filas y columnas exactamente de la misma forma que una tabla. Algunas de las celdas pueden estar vac\u00edas, contener Views o incluso ViewGroups.<\/p>\n

\n\n\n\n
<?<\/code>xml<\/code> version<\/code>=<\/code>\"1.0\"<\/code> encoding<\/code>=<\/code>\"utf-8\"<\/code>?><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
<<\/code>TableLayout<\/code> xmlns:android<\/code>=<\/code>\"http:\/\/schemas.android.com\/apk\/res\/android\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"match_parent\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"match_parent\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:stretchColumns<\/code>=<\/code>\"1\"<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>TableRow<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>TextView<\/code> android:text<\/code>=<\/code>\"Usuario:\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>EditText<\/code> android:id<\/code>=<\/code>\"@+id\/editText2\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:text<\/code>=<\/code>\"EditText\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><\/<\/code>TableRow<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>TableRow<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>TextView<\/code> android:id<\/code>=<\/code>\"@+id\/textView1\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:text<\/code>=<\/code>\"Contrase\u00c3\u00b1a:\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>EditText<\/code> android:text<\/code>=<\/code>\"EditText\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:id<\/code>=<\/code>\"@+id\/editText1\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:password<\/code>=<\/code>\"true\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><\/<\/code>TableRow<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>TableRow<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>Button<\/code> android:id<\/code>=<\/code>\"@+id\/button1\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_span<\/code>=<\/code>\"2\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:text<\/code>=<\/code>\"Login\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><\/<\/code>TableRow<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n

<\/<\/code>TableLayout<\/code>> <\/code><\/p>\n

Relative Layout<\/strong><\/p>\n

En este tipo de layouts tenemos varias propiedades para posicionar cada control en la pantalla con respecto a su View padre o a otro de los Views que tengamos en la interfaz.\u00a0Los elementos ser\u00e1n visualizados en el orden dado, de esta forma si el primero de ellos est\u00e1 centrado en la pantalla, los elementos siguientes estar\u00e1n alineados con respecto al centro de la pantalla.<\/p>\n

\n\n\n\n
<?<\/code>xml<\/code> version<\/code>=<\/code>\"1.0\"<\/code> encoding<\/code>=<\/code>\"utf-8\"<\/code>?><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
<<\/code>RelativeLayout<\/code> xmlns:android<\/code>=<\/code>\"http:\/\/schemas.android.com\/apk\/res\/android\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"fill_parent\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"fill_parent\"<\/code>><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>TextView<\/code> android:id<\/code>=<\/code>\"@+id\/textView01\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"fill_parent\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:text<\/code>=<\/code>\"Introduce tu nombre:\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>EditText<\/code> android:id<\/code>=<\/code>\"@+id\/edit01\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"fill_parent\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_below<\/code>=<\/code>\"@id\/textView01\"<\/code>\/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>Button<\/code> android:id<\/code>=<\/code>\"@+id\/aceptar\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_width<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_below<\/code>=<\/code>\"@id\/edit01\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_alignParentRight<\/code>=<\/code>\"true\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_marginLeft<\/code>=<\/code>\"10dip\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:text<\/code>=<\/code>\"Aceptar\"<\/code> \/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code><<\/code>Button<\/code> android:layout_width<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_height<\/code>=<\/code>\"wrap_content\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_toLeftOf<\/code>=<\/code>\"@id\/aceptar\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:layout_alignTop<\/code>=<\/code>\"@id\/aceptar\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n
\n\n\n\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/code>android:text<\/code>=<\/code>\"Cancelar\"<\/code> \/><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n

<\/<\/code>RelativeLayout<\/code>><\/code><\/p>\n","protected":false},"excerpt":{"rendered":"

Las interfaces de usuario en Android se pueden implementar de varias formas. Una de ellas es definirla en la propia clase de la actividad, aunque esta forma, a parte de ser poco elegante y poco estructurada, no proporciona una diferenciaci\u00f3n clara entre el propio c\u00f3digo de la aplicaci\u00f3n y el de la interfaz. Por lo […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"class_list":["post-136","post","type-post","status-publish","format-standard","hentry","category-android"],"yoast_head":"\nImplementando la interfaz de usuario - Blog Desarrollador<\/title>\n<meta name=\"description\" content=\"Implementando la interfaz de usuario - Blog Desarrollador\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Implementando la interfaz de usuario - Blog Desarrollador\" \/>\n<meta property=\"og:description\" content=\"Implementando la interfaz de usuario - Blog Desarrollador\" \/>\n<meta property=\"og:url\" content=\"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog Desarrollador\" \/>\n<meta property=\"article:published_time\" content=\"2013-03-06T11:54:29+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2013-03-12T14:21:27+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/desarrollandoenandroid.files.wordpress.com\/2011\/03\/viewhierarchy.png?w=480\" \/>\n<meta name=\"author\" content=\"Angel Fernandez Gutierrez\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@afernandezg76\" \/>\n<meta name=\"twitter:site\" content=\"@afernandezg76\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Angel Fernandez Gutierrez\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/\",\"url\":\"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/\",\"name\":\"Implementando la interfaz de usuario - Blog Desarrollador\",\"isPartOf\":{\"@id\":\"http:\/\/www.einaweb.es\/develop\/#website\"},\"datePublished\":\"2013-03-06T11:54:29+00:00\",\"dateModified\":\"2013-03-12T14:21:27+00:00\",\"author\":{\"@id\":\"http:\/\/www.einaweb.es\/develop\/#\/schema\/person\/2d3361868423160a6db46ce6f9fc9a3c\"},\"description\":\"Implementando la interfaz de usuario - Blog Desarrollador\",\"breadcrumb\":{\"@id\":\"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"http:\/\/www.einaweb.es\/develop\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Implementando la interfaz de usuario\"}]},{\"@type\":\"WebSite\",\"@id\":\"http:\/\/www.einaweb.es\/develop\/#website\",\"url\":\"http:\/\/www.einaweb.es\/develop\/\",\"name\":\"Blog Desarrollador\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"http:\/\/www.einaweb.es\/develop\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"http:\/\/www.einaweb.es\/develop\/#\/schema\/person\/2d3361868423160a6db46ce6f9fc9a3c\",\"name\":\"Angel Fernandez Gutierrez\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"http:\/\/www.einaweb.es\/develop\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/366f7c75ad085d0dcc2c290559c1aa5947679d86e3a8c55db42ac1c26e16c816?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/366f7c75ad085d0dcc2c290559c1aa5947679d86e3a8c55db42ac1c26e16c816?s=96&d=mm&r=g\",\"caption\":\"Angel Fernandez Gutierrez\"},\"url\":\"http:\/\/www.einaweb.es\/develop\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Implementando la interfaz de usuario - Blog Desarrollador","description":"Implementando la interfaz de usuario - Blog Desarrollador","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/","og_locale":"es_ES","og_type":"article","og_title":"Implementando la interfaz de usuario - Blog Desarrollador","og_description":"Implementando la interfaz de usuario - Blog Desarrollador","og_url":"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/","og_site_name":"Blog Desarrollador","article_published_time":"2013-03-06T11:54:29+00:00","article_modified_time":"2013-03-12T14:21:27+00:00","og_image":[{"url":"http:\/\/desarrollandoenandroid.files.wordpress.com\/2011\/03\/viewhierarchy.png?w=480"}],"author":"Angel Fernandez Gutierrez","twitter_card":"summary_large_image","twitter_creator":"@afernandezg76","twitter_site":"@afernandezg76","twitter_misc":{"Escrito por":"Angel Fernandez Gutierrez","Tiempo de lectura":"4 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/","url":"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/","name":"Implementando la interfaz de usuario - Blog Desarrollador","isPartOf":{"@id":"http:\/\/www.einaweb.es\/develop\/#website"},"datePublished":"2013-03-06T11:54:29+00:00","dateModified":"2013-03-12T14:21:27+00:00","author":{"@id":"http:\/\/www.einaweb.es\/develop\/#\/schema\/person\/2d3361868423160a6db46ce6f9fc9a3c"},"description":"Implementando la interfaz de usuario - Blog Desarrollador","breadcrumb":{"@id":"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/"]}]},{"@type":"BreadcrumbList","@id":"http:\/\/www.einaweb.es\/develop\/implementando-la-interfaz-de-usuario\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"http:\/\/www.einaweb.es\/develop\/"},{"@type":"ListItem","position":2,"name":"Implementando la interfaz de usuario"}]},{"@type":"WebSite","@id":"http:\/\/www.einaweb.es\/develop\/#website","url":"http:\/\/www.einaweb.es\/develop\/","name":"Blog Desarrollador","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"http:\/\/www.einaweb.es\/develop\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"es"},{"@type":"Person","@id":"http:\/\/www.einaweb.es\/develop\/#\/schema\/person\/2d3361868423160a6db46ce6f9fc9a3c","name":"Angel Fernandez Gutierrez","image":{"@type":"ImageObject","inLanguage":"es","@id":"http:\/\/www.einaweb.es\/develop\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/366f7c75ad085d0dcc2c290559c1aa5947679d86e3a8c55db42ac1c26e16c816?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/366f7c75ad085d0dcc2c290559c1aa5947679d86e3a8c55db42ac1c26e16c816?s=96&d=mm&r=g","caption":"Angel Fernandez Gutierrez"},"url":"http:\/\/www.einaweb.es\/develop\/author\/admin\/"}]}},"_links":{"self":[{"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/posts\/136","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/comments?post=136"}],"version-history":[{"count":2,"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/posts\/136\/revisions"}],"predecessor-version":[{"id":144,"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/posts\/136\/revisions\/144"}],"wp:attachment":[{"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/media?parent=136"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/categories?post=136"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.einaweb.es\/develop\/wp-json\/wp\/v2\/tags?post=136"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}