2012-04-02 22 views
7

He hecho un fondo de botón de formas y parece bastante bueno para mi propósito. Lo único que se necesita es dejar caer un poco de sombra. Aquí está el código:Fondo del botón de Android como forma con Shadow

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 

    <item android:state_pressed="true"> 
     <shape> 
      <solid android:color="#343434" /> 

      <stroke android:width="1dp" android:color="#171717" /> 

      <corners android:radius="3dp" /> 

      <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> 
     </shape> 
    </item> 
    <item> 
     <shape> 
      <gradient android:angle="270" android:endColor="#E2E2E2" android:startColor="#BABABA" /> 

      <stroke android:width="1dp" android:color="#BABABA" /> 

      <corners android:radius="4dp" /> 

      <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> 
     </shape> 
    </item> 

</selector> 

Esto es lo que quiero lograr

enter image description here

¿Cómo se me cae la sombra? Mi suposición es que necesito hacer otra forma, pero con fondo negro/gris y establecer algún tipo de topa y margen de margen izquierdo para que parezca una sombra. Pero no sé cómo hacerlo ... y la documentación no me ayudó demasiado.

Edición posterior: Quiero agregar la sombra en el archivo xml y no por el código. Gracias.

+0

Así es como lo hago [http://stackoverflow.com/a/11579459/672773][1] [1]: http://stackoverflow.com/a/11579459/672773 Esperamos que esto pueda ayuda – Machete

Respuesta

11

Si desea apilar más formas uno en uno encima del otro, entonces podría usar un layer-list. Abajo es el código para el elemento normal en su selector (con una franja de color de gris):

<item> 
    <layer-list> 
     <item android:right="5dp" android:top="5dp"> 
      <shape> 
       <corners android:radius="3dp" /> 
       <solid android:color="#D6D6D6" /> 
      </shape> 
     </item> 
     <item android:bottom="2dp" android:left="2dp"> 
      <shape> 
       <gradient android:angle="270" android:endColor="#E2E2E2" android:startColor="#BABABA" /> 
       <stroke android:width="1dp" android:color="#BABABA" /> 
       <corners android:radius="4dp" /> 
       <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> 
      </shape> 
     </item> 
    </layer-list> 
</item> 

El problema es que usted no será capaz de lograr una verdadera mirada sombra en su Button con este tipo de dibujable Puede usar el código de la otra respuesta o una imagen de nueve parches que ya tiene una sombra.

4
Paint mShadow = new Paint(); 
// radius=10, y-offset=2, color=black 
mShadow.setShadowLayer(10.0f, 0.0f, 2.0f, 0xFF000000); 
// in onDraw(Canvas) 
canvas.drawBitmap(bitmap, 0.0f, 0.0f, mShadow); 

Este código es de Romain Guy Android disponible aquí: http://www.devoxx.com/download/attachments/1705921/D8_C_10_09_04.pdf

+0

Gracias por su respuesta, lo noté.En este caso, olvidé mencionar que quiero agregar el shadow directo en el archivo xml. – Alin

+0

el enlace es 404. muy mal –

5

Prueba esto ...

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 
    <item> 
     <shape> 
      <solid android:color="#000000" /> 

      <corners android:radius="7dp" /> 
     </shape> 
    </item> 
    <item 
     android:bottom="5px" 
     android:left="5px"> 
     <shape> 
      <solid android:color="#FF0000" /> 

      <corners android:radius="7dp" /> 
     </shape> 
    </item> 
</layer-list> 
1

puede probar el siguiente código también para obtener una sombra suave frontera de vista:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 

<item> 
    <shape> 
     <solid android:color="#88000000" /> 

     <corners android:radius="15dp" /> 
    </shape> 
</item> 
<item 
    android:bottom="5px" 
    android:right="5px"> 
    <shape> 
     <solid android:color="#55B0CF" /> 

     <stroke 
      android:width="2dp" 
      android:color="#ffffff" /> 

     <corners android:radius="7dp" /> 
    </shape> 
</item> 

2

Usted puede intentar esto:

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 
<!-- Bottom Shadow Darker Line--> 
<item> 
    <shape android:shape="rectangle" > 
     <solid android:color="@color/blue_darker" /> 
     <corners android:radius="9dip" /> 
    </shape> 
</item>  


<!-- Main Content Gradient --> 
<item android:bottom="1dip"> 
    <shape android:shape="rectangle" android:dither="false" > 
     <gradient 
      android:startColor="@color/blue_dark" 
      android:centerColor="@color/blue_medium" 
      android:endColor="@color/blue_light" 
      android:type="linear" 
      android:angle="90"/> 
     <corners android:radius="9dip" /> 
    </shape> 
</item> 

<!-- Upper Shadow Dark Line --> 
<item android:bottom="1dip" android:left="1dip" android:right="1dip"> 
    <shape android:shape="rectangle" > 
     <gradient 
      android:centerX="0.98" 
      android:centerY="0" 
      android:startColor="@android:color/transparent" 
      android:centerColor="@android:color/transparent" 
      android:endColor="@color/blue_medium" 
      android:type="linear" 
      android:angle="90"/>    
     <corners android:radius="9dip" /> 
    </shape> 
</item>  

1

En este caso uso lib https://github.com/dmytrodanylyk/shadow-layout

En primer lugar, tiene que girar en Gradle

dependencies { 
    compile 'com.github.dmytrodanylyk.shadow-layout:library:1.0.3' 
} 

a continuación, poner el botón en ShadowLayout

<com.dd.ShadowLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:sl_shadowRadius="3dp" 
     app:sl_shadowColor="@color/your_color"> 
     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" /> 
    </com.dd.ShadowLayout> 

Es worsk grande para mí)

Cuestiones relacionadas