layout_width - Android LinearLayout: agrega borde con sombra alrededor de un lineLayout

linearlayout android studio ejemplo

Question

Me gustaría crear el mismo borde de este linearlayout como ejemplo:

En este ejemplo, podemos ver que el borde no es el mismo en todo el linealLayout. ¿Cómo puedo crear esto usando un archivo xml dibujable?

Por ahora, solo he podido crear un borde simple alrededor de la distribución lineal de esta manera:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<corners
android:radius="1dp"
android:topRightRadius="0dp"
android:bottomRightRadius="0dp"
android:bottomLeftRadius="0dp" />
<stroke
android:width="1dp"
android:color="#E3E3E1" />
<solid android:color="@color/blanc" />
</shape>

Answer 1

Ya Mahdi aj --- para RelativeLayout

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<gradient
android:startColor="#7d000000"
android:endColor="@android:color/transparent"
android:angle="90" >
</gradient>
<corners android:radius="2dp" />
</shape>
</item>
<item
android:left="0dp"
android:right="3dp"
android:top="0dp"
android:bottom="3dp">
<shape android:shape="rectangle">
<padding
android:bottom="40dp"
android:top="40dp"
android:right="10dp"
android:left="10dp"
>
</padding>
<solid android:color="@color/Whitetransparent"/>
<corners android:radius="2dp" />
</shape>
</item>
</layer-list>

Answer 2

Como alternativa, puede usar una imagen de 9 parches como fondo para su diseño, lo que permite más sombras "naturales":

Resultado:

Coloque la imagen en su carpeta /res/drawable .
Asegúrese de que la extensión del archivo sea .9.png , no .png

Por cierto, este es un modificado (reducido al tamaño mínimo cuadrado) de un recurso existente que se encuentra en la carpeta de recursos sdk API 19.
Dejé los marcadores rojos, ya que no parecen ser dañinos, como se muestra en la herramienta draw9patch.

[EDITAR]

Alrededor de 9 parches, en caso de que nunca haya tenido nada que ver con ellos.

Simplemente agrégalo como fondo de tu Vista.

Las áreas marcadas con negro (izquierda y arriba) se estirarán (verticalmente, horizontalmente).
Las áreas marcadas con negro (derecha, abajo) definen el "área de contenido" (donde es posible agregar texto o Vistas; puede llamar a las regiones sin marcar "relleno", si lo desea).

Tutorial: http://radleymarx.com/blog/simple-guide-to-9-patch/

Answer 3

Encontré la mejor manera de abordar esto.

1. Debe establecer un fondo de rectángulo sólido en el diseño.

2. Use este código - ViewCompat.setElevation(view , value)

3. En el diseño principal, establece android:clipToPadding="false"

Answer 4

Es por eso que existe CardView. CardView | Desarrolladores de Android
Es solo un FrameLayout que admite la elevación en dispositivos pre-piruletas.

<android.support.v7.widget.CardView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardUseCompatPadding="true"
app:cardElevation="4dp"
app:cardCornerRadius="3dp" >
<!-- put whatever you want -->
</android.support.v7.widget.CardView>

Para usar esto, necesita agregar dependencia a build.gradle :

compile ''com.android.support:cardview-v7:23.+''

Answer 5

Esto es tan simple:

Crea un archivo dibujable con un gradiente como este:

para la sombra debajo de una vista below_shadow.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#20000000"
android:endColor="@android:color/transparent"
android:angle="270" >
</gradient>
</shape>

para la sombra sobre una vista above_shadow.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#20000000"
android:endColor="@android:color/transparent"
android:angle="90" >
</gradient>
</shape>

y así sucesivamente para la sombra derecha e izquierda simplemente cambie el ángulo del degradado :)

Answer 6

Obtengo los mejores resultados usando un gráfico de 9 parches.

Simplemente puede crear un gráfico de parche individual 9 usando el siguiente editor: http://inloop.github.io/shadow4android/

Ejemplo:

El gráfico de 9 parches:

El resultado:

La fuente:

<LinearLayout
android:layout_width="200dp"
android:layout_height="200dp"
android:orientation="vertical"
android:background="@drawable/my_nine_patch"

Answer 7

Prueba esto..

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#CABBBBBB"/>
<corners android:radius="2dp" />
</shape>
</item>
<item
android:left="0dp"
android:right="0dp"
android:top="0dp"
android:bottom="2dp">
<shape android:shape="rectangle">
<solid android:color="@android:color/white"/>
<corners android:radius="2dp" />
</shape>
</item>
</layer-list>

Answer 8

Puede generar una sombra con este sitio: http://inloop.github.io/shadow4android/ . Configure los parámetros y descargue el archivo 9-patch.png.

Answer 9

Puedes hacerlo con 9 gráficos de parches, pero es incorrecto, porque tienes que usar el archivo png. Creo que deberías usar el archivo xml (archivo dibujable). Prueba usar este código

activity_main.xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="3dp"
android:layout_marginLeft="3dp"
android:layout_marginRight="3dp"
android:background="@drawable/gradient_top"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="3dp"
android:layout_height="match_parent"
android:layout_marginBottom="3dp"
android:background="@drawable/gradient_left"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="3dp"
android:layout_marginBottom="3dp"
android:background="@color/md_white_1000"
android:orientation="vertical">
</LinearLayout>
<LinearLayout
android:layout_width="3dp"
android:layout_height="match_parent"
android:layout_marginLeft="-4dp"
android:layout_marginBottom="3dp"
android:background="@drawable/gradient_right"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="3dp"
android:layout_marginTop="-4dp"
android:layout_marginLeft="3dp"
android:layout_marginRight="3dp"
android:background="@drawable/gradient_bottom"/>

gradient_top.xml

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

gradient_left.xml

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

gradient_right.xml

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

gradient_bottom.xml

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

Answer 10

Usted crea un archivo .xml en drawable con el nombre drop_shadow.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!--<item android:state_pressed="true">
<layer-list>
<item android:left="4dp" android:top="4dp">
<shape>
<solid android:color="#35000000" />
<corners android:radius="2dp"/>
</shape>
</item>
...
</layer-list>
</item>-->
<item>
<layer-list>
<!-- SHADOW LAYER -->
<!--<item android:top="4dp" android:left="4dp">
<shape>
<solid android:color="#35000000" />
<corners android:radius="2dp" />
</shape>
</item>-->
<!-- SHADOW LAYER -->
<item>
<shape>
<solid android:color="#35000000" />
<corners android:radius="2dp" />
</shape>
</item>
<!-- CONTENT LAYER -->
<item android:bottom="3dp" android:left="1dp" android:right="3dp" android:top="1dp">
<shape>
<solid android:color="#ffffff" />
<corners android:radius="1dp" />
</shape>
</item>
</layer-list>
</item>
</selector>

Entonces:

<LinearLayout
...
android:background="@drawable/drop_shadow"/>

Answer 11

de acuerdo, sé que esto es demasiado tarde. pero tenía el mismo requisito. lo solucioné así

1.Primero crea un archivo xml (ejemplo: border_shadow.xml) en la carpeta "dibujable" y copia el código a continuación en él.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<item>
<shape>
<!-- set the shadow color here -->
<stroke
android:width="2dp"
android:color="#7000" />
<!-- setting the thickness of shadow (positive value will give shadow on that side) -->
<padding
android:bottom="2dp"
android:left="2dp"
android:right="-1dp"
android:top="-1dp" />
<corners android:radius="3dp" />
</shape>
</item>
<!-- Background -->
<item>
<shape>
<solid android:color="#fff" />
<corners android:radius="3dp" />
</shape>
</item>

2. ahora en el diseño donde desea la sombra (ejemplo: LinearLayout) agregue esto en android: fondo

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="8dip"
android:background="@drawable/border_shadow"
android:orientation="vertical">

y eso funcionó para mí.