arquitectura de aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf•...
TRANSCRIPT
![Page 1: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/1.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IA
Plataforma Android
Sesión 3: Introducción al diseño de interfaces gráficas en Android
![Page 2: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/2.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 2
Puntos a tratar
• Vistas
• Layouts
• Uso básico de elementos
• Independencia del hardware
![Page 3: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/3.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 3
Introducción
• Terminología de interfaces gráficas en Android• Vistas
• Equivalentes a widgets o componentes gráficos• Subclases de View
• Grupos de vistas: • Contienen múltiples vistas• Subclases de ViewGroup
• Layouts• Grupos de vistas utilizados para organizar vistas en la
pantalla
• Actividad• Cada una de las pantallas de nuestra aplicación• Equivalente a un formulario
![Page 4: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/4.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 4
Vistas
• Asignar una interfaz gráfica a una actividad mediante recursos
• /res/layout/milayout.xml• setContentView(): asignación de la interfaz a la actividad
• Parámetro: identificador de recurso u objeto View
• findViewById(): acceso a las vistas desde el código• Parámetro: el atributo android:id de la vista en el archivo de recursos• android:id=”@+id/[IDENTIFICADOR]”
@Overridepublic void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.milayout); TextView miTexto = (TextView)findViewById(R.id.texto);}
![Page 5: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/5.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 5
Vistas
• Asignar una interfaz gráfica a una actividad mediante código:
@Overridepublic void onCreate(Bundle sagedInstaceState) { super.onCreate(savedInstanceState); textView texto = new TextView(this); setContentView(texto); texto.setText("Hola Mundo!");}
![Page 6: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/6.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 6
Vistas básicas de Android• TextView• EditText• ListView• Spinner• Button• CheckBox• RadioButton• SeekBar• ...
http://developer.android.com/guide/tutorials/views/index.html
![Page 7: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/7.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 7
Layouts
Layouts básicos de Android:• FrameLayout: coloca todos los elementos en la esquina superior
izquierda• LinearLayout: dispone todos los elementos en una única fila o
columna• TableLayout: organiza los elementos en forma de tabla con
varias filas y columnas• RelativeLayout: layout flexible para la colocación de elementos
en posiciones relativas a otros• Gallery: lista horizontal de vistas con scroll
http://developer.android.com/guide/topics/ui/layout-objects.html
![Page 8: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/8.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 8
Layouts como recursos
• Carpeta /res/layout/
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:id="@+id/textView1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Introduce un texto" /> <EditText android:id="@+id/editText1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Escribe el texto aquí" /></LinearLayout>
![Page 9: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/9.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 9
Layouts a partir de código
• Desaconsejado en general
LinearLayout ll = new LinearLayout(this);ll.setOrientation(LinearLayout.VERTICAL); TextView texto = new TextView(this);EditText edicion = new EditText(this); text.setText("Introduce un texto");edicion.setText("Escribe el texto aquí"); int lHeight = LinearLayout.LayoutParams.FILL_PARENT;int lWidth = LienarLayout.LayoutParams.WRAP_CONTENT; ll.addView(texto, new LinearLayout.LayoutParams(lHeight, lWidth));ll.addView(edicion, new LinearLayout.layoutParams(lHeight, lWidth)); setContentView(ll);
![Page 10: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/10.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 10
Optimización de layouts
• La creación de la interfaz gráfica es un proceso costoso computacionalmente
• Reglas para interfaces eficientes
• Evitar anidamientos innecesarios
• Evitar usar demasiadas vistas
• Evitar anidamientos profundos
• Comando layouopt
• Parámetro: nombre de fichero o carpeta de recursos
![Page 11: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/11.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 11
Vistas de texto
• TextView• Etiqueta de texto• Atributos
• android:text• android:textColor• android:textSize
• Métodos• setText()• appendText()
• getText()
• EditText• Hereda de TextView, editable
![Page 12: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/12.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 12
Button
public class MiActividad extends Activity { protected void onCreate(Bundle icicle) { super.onCreate(icicle); setContentView(R.layout.miLayout); TextView texto = (TextView)findViewById(R.id.texto); Button boton = (Button)findViewById(R.id.boton);
boton.setOnClickListener( new OnClickListener() { public void onClick(View v) { texto.setText("Botón pulsado"); } }); }}
![Page 13: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/13.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 13
Button
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent">
<TextView android:id="@+id/texto" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Texto" /> <Button android:id="@+id/boton" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Púlsame" />
</LinearLayout>
![Page 14: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/14.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 14
Button
• Definición del manejador del evento OnClick en el archivo XML de layout:
• Manejador implementado en el código:
<Button android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="@string/textoBoton" android:onClick="manejador" />
public void manejador(View vista) { // Hacer algo}
![Page 15: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/15.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 15
CheckBox
• Botón con dos posibles estados
• Independientes unos de otros
• Atributos
• android:checked
• android:text
• Métodos
• isChecked
• setChecked
![Page 16: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/16.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 16
CheckBox
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent">
<TextView android:id="@+id/texto" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Texto" /> <CheckBox android:id="@+id/micheckbox" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Púlsame" android:checked="false" />
</LinearLayout>
![Page 17: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/17.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 17
CheckBoxpublic class MiActividad extends Activity { TextView texto; CheckBox miCheckbox;
protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); texto = (TextView)findViewById(R.id.texto); miCheckbox = (CheckBox)findViewById(R.id.micheckbox); miCheckbox.setChecked( true );
miCheckbox.setOnClickListener(new OnClickListener() { public void onClick(View v) { // Acción a realizar si está pulsado o no if (miCheckbox.isChecked()) { texto.setText("activado"); } else { texto.setText("desactivado"); } } }); }}
![Page 18: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/18.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 18
RadioButton
• Botón con dos estados• Una vez seleccionado, no puede dejar de estarlo por
acción directa del usuario• Agrupados en elementos de tipo RadioGroup<RadioGroup android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical"> <RadioButton android:id="@+id/radio_si" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Sí" /> <RadioButton android:id="@+id/radio_no" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="No" /></RadioGroup>
![Page 19: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/19.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 19
RadioButtonpublic class MiActividad extends Activity { boolean valor = true; RadioButton botonSi, botonNo; protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); botonSi = (RadioButton)findViewById(R.id.radio_si); botonNo = (RadioButton)findViewById(R.id.radio_no); botonSi.setOnClickListener(new OnClickListener() { public void onClick(View v) { valor = true; } }); botonNo.setOnClickListener(new OnClickListener() { public void onClick(View v) { valor = false; } }); }}
![Page 20: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/20.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 20
Spinner
• Cuadro de selección múltiple
• Pasos:
• Añadir objeto Spinner al layout
• Recursos:
• Prompt – Título de la ventana
• Entries – Array de opciones
• Asignar array de opciones al Spinner
![Page 21: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/21.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 21
Spinner
• Añadir objeto Spinner al layout
• Cadena para el prompt en /res/values/strings.xml
<Spinner android:id="@+id/spinner" android:layout_width="fill_parent" android:layout_height="wrap_content" android:drawSelectorOnTop="true" android:prompt="@string/eligeopcion" android:entries="@array/opciones" />
<string name="eligeopcion">Elige!</string>
![Page 22: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/22.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 22
Spinner
• Array de opciones en /res/values/arrays.xml
• Asociar opciones al Spinner desde código:
<resources> <string-array name="opciones"> <item>Mensual</item> <item>Trimestral</item> <item>Semestral</item> <item>Anual</item> </string-array></resources>
Spinner s = (Spinner) findViewById(R.id.spinner);ArrayAdapter adaptador = ArrayAdapter.createFromResource( this, R.array.opciones, android.R.layout.simple_spinner_item);adaptador.setDropDownViewResource( android.R.layout.simple_spinner_dropdown_item);s.setAdapter(adaptador);
![Page 23: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/23.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 23
Spinner
• Eventos:• No es posible asignar eventos a elementos individuales• Manejador de evento global:
spinner.setOnItemSelectedListener(new OnItemSelectedListener() { @Override public void onItemSelected(AdapterView parentView, View selectedItemView, int position, long id) { // Código } @Override public void onNothingSelected(AdapterView parentView) { // Código }});
![Page 24: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/24.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 24
LinearLayout
• Dispone los elementos en una fila o una columna• android:gravity• android:weight
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical|horizontal" android:layout_width="fill_parent" android:layout_height="fill_parent">
[ELEMENTOS]
</LinearLayout>
![Page 25: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/25.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 25
TableLayout
• Organiza los elementos como una rejilla dividida en filas y columnas
• Compuesto por elementos de tipo <TableRow> representando las filas de la tabla• Cada fila contendrá un conjunto de vistas• Columnas
• Anchura dependiente del elemento más ancho de la columna
• android:layout_width=”match_parent”
• android:layout_height=”wrap_content”
• setColumnShrinkable: disminuir anchura
• setColumnStretchable: aumentar anchura
• setColumnCollapsed: ocultar columna
![Page 26: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/26.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 26
TableLayout
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TableRow> [ELEMENTOS] </TableRow> <TableRow> [ELEMENTOS] </TableRow> <View android:layout_height="2dip" android:background="#FF909090" /> <TableRow> [ELEMENTOS] </TableRow></TableLayout>
![Page 27: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/27.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 27
RelativeLayout <TextView android:id="@+id/etiqueta" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Escribe"/> <EditText android:id="@+id/entrada" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/etiqueta"/> <Button android:id="@+id/ok" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/entrada" android:layout_alignParentRight="true" android:layout_marginLeft="10dip" android:text="OK" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_toLeftOf="@id/ok" android:layout_alignTop="@id/ok" android:text="Cancelar" />
![Page 28: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/28.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 28
Independencia del hardware
• Múltiples archivos de recursos:
Modificadores: small, normal, large, xlarge, land, port, long, notlong,
ldpi, mdpi, hdpi• Configuraciones de pantalla soportadas (en Manifest)
/res/layout-small-long//res/layout-large//res/drawable-hdpi/
<supports-screens android:smallScreens="false" android:normalScreens="true" android:largeScreens="true" android:anyDensity="true"/>
![Page 29: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/29.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 29
Independencia del hardware
• ¡Hacer todas las pruebas posibles!
• No utilizar nunca medidas absolutas (usar dp):
![Page 30: Arquitectura de Aplicacionesjtech.ua.es/dadm/restringido/android/traspas/sesion03-traspas.pdf• FrameLayout: coloca todos los elementos en la esquina superior izquierda • LinearLayout:](https://reader034.vdocuments.site/reader034/viewer/2022052013/602a0ee585083f0a2a31f825/html5/thumbnails/30.jpg)
Experto en Desarrollo de Aplicaciones para Dispositivos Móviles
© 2012-2013 Depto. Ciencia de la Computación e IAPlataforma Android Diseño de UIs - 30
¿Preguntas...?
ncontant 13 . Interface ncontant 14 . Interface Et cela ? Si on" href="https://vdocuments.site/uv1-android-2017-12-13-androidlayoutweight009-androidtext.html">UV1- ANDROID · 2017-12-13 · android:layout_weight="0.09" android:text=« Re-Bonjour" /> ncontant 13 . Interface ncontant 14 . Interface Et cela ? Si on