Cuando se utiliza de altura y ancho “fill_parent” en un RelativeLayout, es probable que le de algunas sorpresas.
Si es utilizado directamente en un archivo de layout, es probable que no de mucho problema, pero a la hora de crear componentes a base de este layout (utilizando el LayoutInflater) podrá notar que se comporta muy diferente. Particularmente con las alturas “ajustables”.
Buscando la razón me encontre este ticket en los bug reports de Android: http://code.google.com/p/android/issues/detail?id=1394 donde básicamente describen este problema y nos dan la solución. Utilizar altura y ancho fijos.
El siguiente layout
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="50dip" android:layout_height="50dip" > <RelativeLayout android:background="#FFFFFF" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:text="1" android:textColor="#FF0000" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:text="2" android:textColor="#FF0000" android:layout_alignParentTop="true" android:layout_alignParentRight="true" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:text="3" android:textColor="#0000FF" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:text="4" android:textColor="#0000FF" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </RelativeLayout> </FrameLayout>
Da como resultado este posicionamiento, normal, en el preview del layout en Eclipse.
Hemos utilizado un GridView con 10 Views que utilizan el layout anterior. Pero en vez de mostrarlo similar que en el preview, se muesta de la siguiente manera en un teléfono:
Como se citó anteriormente, al momento de ponerle altura fija directamente en la configuración del RelativeLayout, se resuelve el problema.
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" > <RelativeLayout android:background="#FFFFFF" android:layout_width="50dip" android:layout_height="50dip"> <TextView android:text="1" android:textColor="#FF0000" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:text="2" android:textColor="#FF0000" android:layout_alignParentTop="true" android:layout_alignParentRight="true" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:text="3" android:textColor="#0000FF" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:text="4" android:textColor="#0000FF" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </RelativeLayout> </FrameLayout>
Dando como resultado, el layout esperado:
Otra nota curiosa, es que esto solo es posible verlo en telefonos reales, ya que en los emuladores este problema no es posible replicarlo. Personalmente había visto este problema ocurrir solo en Android 2.1 (Eclair), pero a la hora de preparar este ejemplo, lo pude replicar tanto en un telefono con Eclair como con FroYo.