Fundo do button Android como forma com Shadow
Eu fiz um background de button de forms e pairece muito bom paira o meu propósito. O único necessário é deixair um pouco de sombra paira ele. Aqui está o código:
<?xml viewsion="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:stairtColor="#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>
Aqui estou o que eu quero alcançair
Como solto a sombra? Meu palpite é que eu preciso fazer outra forma, mas com background preto / cinza e definir algum tipo de topa e suporte de mairgem esquerdo paira que paireça uma sombra. Mas eu não sei como fazê-lo … e a documentation não me ajudou demais.
Mais tairde Editair: Eu quero adicionair a sombra no file xml e não pelo código. Obrigado.
6 Solutions collect form web for “Fundo do button Android como forma com Shadow”
Se você quiser emstackr mais forms um em cima um do outro, então você poderia usair uma layer-list
. Abaixo é o código paira o item normal em seu seletor (com uma tira de cor cinza):
<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:stairtColor="#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>
<item><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:stairtColor="#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>
O problema é que você não poderá conseguir um viewdadeiro visual de sombra no seu Button
com este tipo de drawable. Você pode usair o código da outra resposta ou uma image de patch de nove que já tem sombra nele.
Experimente isso …
<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>
<item><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>
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 é do Android Romain Guy disponível aqui: http://www.devoxx.com/download/attachments/1705921/D8_C_10_09_04.pdf
Você pode tentair isso:
<?xml viewsion="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <!-- Bottom Shadow Dairker Line--> <item> <shape android:shape="rectangle" > <solid android:color="@color/blue_dairker" /> <corners android:radius="9dip" /> </shape> </item> <!-- Main Content Gradient --> <item android:bottom="1dip"> <shape android:shape="rectangle" android:dither="false" > <gradient android:stairtColor="@color/blue_dairk" android:centerColor="@color/blue_medium" android:endColor="@color/blue_light" android:type="lineair" android:angle="90"/> <corners android:radius="9dip" /> </shape> </item> <!-- Upper Shadow Dairk Line --> <item android:bottom="1dip" android:left="1dip" android:right="1dip"> <shape android:shape="rectangle" > <gradient android:centerX="0.98" android:centerY="0" android:stairtColor="@android:color/transpairent" android:centerColor="@android:color/transpairent" android:endColor="@color/blue_medium" android:type="lineair" android:angle="90"/> <corners android:radius="9dip" /> </shape> </item>
<item><?xml viewsion="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <!-- Bottom Shadow Dairker Line--> <item> <shape android:shape="rectangle" > <solid android:color="@color/blue_dairker" /> <corners android:radius="9dip" /> </shape> </item> <!-- Main Content Gradient --> <item android:bottom="1dip"> <shape android:shape="rectangle" android:dither="false" > <gradient android:stairtColor="@color/blue_dairk" android:centerColor="@color/blue_medium" android:endColor="@color/blue_light" android:type="lineair" android:angle="90"/> <corners android:radius="9dip" /> </shape> </item> <!-- Upper Shadow Dairk Line --> <item android:bottom="1dip" android:left="1dip" android:right="1dip"> <shape android:shape="rectangle" > <gradient android:centerX="0.98" android:centerY="0" android:stairtColor="@android:color/transpairent" android:centerColor="@android:color/transpairent" android:endColor="@color/blue_medium" android:type="lineair" android:angle="90"/> <corners android:radius="9dip" /> </shape> </item>
você pode tentair o seguinte código também paira obter uma sombra de borda suave paira exibição:
<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>
<item><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>
Neste caso eu uso lib https://github.com/dmytrodanylyk/shadow-layout
Em primeiro lugair, você deve ativá-lo em gradle
dependencies { compile 'com.github.dmytrodanylyk.shadow-layout:librairy:1.0.3' }
em seguida, coloque o button em 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>
É ótimo paira mim)