Diseño de Android roto con fondo de 9 parches

Question

Encontré este problema al actualizar mi fondo para usar una imagen de 9 parches. El diseño está bien en diferentes pantallas usando diferentes tamaños de la misma imagen, pero cuando cambio la imagen para que sea un parche de 9, rompe todo el diseño misteriosamente.

La disposición anterior es el siguiente:

Original layout http://onik.org/android/layoutOk.png.

Cuando cambiado a 9-patch:

9-Patch image http://onik.org/android/layoutError.png.

El archivo XML se mantuvo igual, solo se modificaron los archivos PNG.

<?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" 
    android:background="@drawable/bg"> 

    <TextView 
     android:text="@string/title" 
     android:id="@+id/login_title" 
     android:layout_width="fill_parent" 
     android:layout_height="40px" 
     android:textSize="30px"> 
    </TextView> 

    <View 
     android:id="@+id/login_underline" 
     android:layout_width="wrap_content" 
     android:layout_height="2px" 
     android:background="#aaaaaa"> 
    </View> 

    <TableLayout 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_weight="1" 
     android:stretchColumns="1" 
     android:gravity="center" 
     android:paddingLeft="10px" 
     android:paddingRight="10px"> 

     <TableRow> 
      <TextView 
       android:id="@+id/login_usernameLabel" 
       android:text="@string/login_usernameLabel" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:paddingRight="5px"> 
      </TextView> 

      <EditText 
       android:text="" 
       android:id="@+id/login_username" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:inputType="textEmailAddress" 
       android:lines="1" 
       android:nextFocusDown="@+id/login_password"> 
      </EditText> 

     </TableRow> 

     <TableRow> 

      <TextView 
       android:id="@+id/login_passwordLabel" 
       android:text="@string/login_passwordLabel" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content"> 
      </TextView> 

      <EditText 
       android:text="" 
       android:id="@+id/login_password" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:nextFocusDown="@+id/login_login" 
       android:inputType="textPassword"> 
      </EditText> 

     </TableRow> 

     <TableRow android:gravity="right"> 

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


    </TableRow> 

     <TableRow> 

      <CheckBox 
       android:id="@+id/login_remember" 
       android:text="@string/login_remember" 
       android:layout_span="2"> 
      </CheckBox> 

     </TableRow> 

</TableLayout> 


</LinearLayout> 

¿Alguna idea? ¿U otras soluciones para obtener un fondo centrado y sin escala?

Answer 1

significa que sólo tiene que añadir el atributo

android:padding="0dip" 

a su etiqueta de diseño

<?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" 
    android:background="@drawable/bg" 
    android:padding="0dip"> 

Actualización:

Android Docs tiene la explicación exacta:

"También puede definir una sección dibujable opcional de la imagen (de hecho, las líneas de relleno) dibujando una línea en las líneas derecha e inferior. Si un objeto View configura el NinePatch como su fondo y luego especifica el texto de la Vista, se estirará para que todo el texto encaje solo dentro del área designada por las líneas derecha e inferior (si están incluidas). Si las líneas de relleno no están incluidas, Android usa las líneas izquierda y superior para definir esta área dibujable. "

ignorar este comportamiento por defecto tenemos que establecer el relleno atributo explícitamente en el diseño XML

Answer 2

Resuelto el problema, mi área de relleno en el parche 9 no era adecuada. Cuando dibujé el área de relleno como el inverso del área estirable, la imagen comenzó a funcionar. Sólo pensé que esto habría sido automática si no hay área de relleno estaba presente :)

Answer 3

Uso 9-parche de establecer la línea de contenidos (derecha y abajo)!