Separador de sombras entre fragmentos de Android

Question

Tengo un diseño similar a la aplicación ICS Gmail para tabletas (ListFragment a la izquierda y el contenido a la derecha) y me preguntaba cómo podría construir los diseños de modo que haya un separador de sombra entre los dos fragmentos (como en la aplicación Gmail, que se muestra a continuación)

.

Además, como esto es aplicable a esta pregunta, ¿cómo puedo tener ese bonito marcador de triángulo/flecha en el diseño del elemento de la lista activa?Supongo que para implementar esto, el propio ListView debe mentir arriba la "capa" de sombra, pero no tengo idea de cómo crearla.

Answer 1

Solo para que todos sepan (porque parece que hay una falta de información en este tema), esto se logra dentro del selector de fondo XML de la vista de las filas de la lista individual.Por ejemplo, este es el diseño de la pantalla principal,

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/list_row"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:background="@drawable/list_item_selector">

    ...<!-- Rest of layout goes here -->

</RelativeLayout>

Pero la magia viene en el list_item_selector:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@drawable/list_pressed" />
    <item android:state_activated="true" android:drawable="@drawable/list_arrow_activated"  />
    <item android:drawable="@drawable/list_default" />
</selector>

Al definir estos sorteos de 9 parches como este, puede hacer que cada elemento de la listaEspero que esto ayude a alguien, ¡ya que estoy seguro de ayudarme!

Answer 2

Estoy buscando hacer lo mismo que tú intentas hacer;crea el efecto de que un fragmento está "más cerca" que otro.

La respuesta de Roboguy maneja cómo tener el "selector" de flecha blanca en el elemento de la lista;Intentaré ser más específico sobre las sombras.Otro buen ejemplo del uso de selectores de fondo se puede ver en el código fuente de la aplicación Google IO 2011. Una vez que tenga la fuente, mire los selectores de íconos fragment_dashboard.xml.

El separador de sombras es un degradado que se aplica al lado izquierdo de una vista.Hay dos partes;

Primero, la "sombra" misma:

res/shadow_left.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
    android:angle="0"
    android:startColor="#55000000" 
    android:endColor="#00000000"
    />
</shape>

Luego, para aplicarlo realmente a un diseño:

diseño/mi_capa_inferior

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
<View
    android:layout_width="20dp"
    android:layout_height="fill_parent"
    android:background="@drawable/fragment_shadow_left" />
<ImageView
    android:id="@+id/imageview"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true" />
</RelativeLayout>

Esto debe hacerse con un diseño relativo (que yo sepa).Si está utilizando un diseño lineal, puede envolver todo el diseño lineal dentro de un diseño relativo y luego agregarlo con el degradado.

Tenga en cuenta que, si hace esto, el gradiente <View> tiene que ir por debajo del <LinearLayout>;de lo contrario, el degradado se dibujará bajo el diseño lineal, por lo que no lo verá.