Wie Sie im Bild sehen können, möchte ich hinter einer Button
Schatten. Ich habe Button
mit abgerundeten Ecken erstellt. Aber das Problem ist, dass ich hinter dieser Button
keinen Schatten erzeugen kann. Wie kann ich das erreichen?
Verwenden Sie diesen Ansatz, um den gewünschten Look zu erhalten.
button_selector.xml:
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
<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>
</selector>
Und in deinem XML-Layout:
<Button
Android:background="@drawable/button_selector"
...
..
/>
Für Android Version 5.0 und höher
versuchen Sie das Elevation für andere Ansichten ..
Android:elevation="10dp"
Für Buttons,
Android:stateListAnimator="@anim/button_state_list_animator"
button_state_list_animator.xml - https://Android.googlesource.com/platform/frameworks/base/+/master/core/res/ res/anim/button_state_list_anim_material.xml
unter 5.0 Version,
Für alle Ansichten,
Android:background="@Android:drawable/dialog_holo_light_frame"
Meine Ausgabe:
Hier ist meine Schaltfläche mit Schattencw_button_shadow.xml
indrawable
Ordner
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item Android:state_pressed="false">
<layer-list>
<!-- SHADOW -->
<item>
<shape>
<solid Android:color="@color/red_400"/>
<!-- alttan gölge -->
<corners Android:radius="19dp"/>
</shape>
</item>
<!-- BUTTON alttan gölge
Android:right="5px" to make it round-->
<item
Android:bottom="5px"
>
<shape>
<padding Android:bottom="5dp"/>
<gradient
Android:startColor="#1c4985"
Android:endColor="#163969"
Android:angle="270" />
<corners
Android:radius="19dp"/>
<padding
Android:left="10dp"
Android:top="10dp"
Android:right="5dp"
Android:bottom="10dp"/>
</shape>
</item>
</layer-list>
</item>
<item Android:state_pressed="true">
<layer-list>
<!-- SHADOW -->
<item>
<shape>
<solid Android:color="#102746"/>
<corners Android:radius="19dp"/>
</shape>
</item>
<!-- BUTTON -->
<item Android:bottom="5px">
<shape>
<padding Android:bottom="5dp"/>
<gradient
Android:startColor="#1c4985"
Android:endColor="#163969"
Android:angle="270" />
<corners
Android:radius="19dp"/>
<padding
Android:left="10dp"
Android:top="10dp"
Android:right="5dp"
Android:bottom="10dp"/>
</shape>
</item>
</layer-list>
</item>
</selector>
Wie benutzt man. In Button xml können Sie Ihre Größe und Ihr Gewicht ändern
<Button
Android:text="+ add friends"
Android:layout_width="120dp"
Android:layout_height="40dp"
Android:background="@drawable/cw_button_shadow" />
Wenn Sie auf Geräte vor Lollipop-Geräten abzielen, können Sie Shadow-Layout verwenden, da es einfach ist und Sie es in verschiedenen Layouts verwenden können.
Füge Schatten-Layout zu deiner Gradle-Datei hinzu:
dependencies {
compile 'com.github.dmytrodanylyk.shadow-layout:library:1.0.1'
}
Am oberen Rand des XML-Layouts, an dem sich Ihre Schaltfläche befindet, fügen Sie oben hinzu:
xmlns:app="http://schemas.Android.com/apk/res-auto"
die benutzerdefinierten Attribute werden verfügbar gemacht.
Dann legst du ein Schattenlayout um dich. Button:
<com.dd.ShadowLayout
Android:layout_marginTop="16dp"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
app:sl_shadowRadius="4dp"
app:sl_shadowColor="#AA000000"
app:sl_dx="0dp"
app:sl_dy="0dp"
app:sl_cornerRadius="56dp">
<YourButton
.... />
</com.dd.ShadowLayout>
Sie können dann die app:
-Einstellungen an den gewünschten Schatten anpassen.
Ich hoffe es hilft.
Ich habe den Code von oben aus probiert und meinen eigenen Schatten erstellt, der etwas näher an dem ist, was ich erreichen möchte. Vielleicht hilft es auch anderen.
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
<layer-list>
<item Android:left="5dp" Android:top="5dp">
<shape>
<corners Android:radius="3dp" />
<gradient
Android:angle="315"
Android:endColor="@Android:color/transparent"
Android:startColor="@Android:color/black"
Android:type="radial"
Android:centerX="0.55"
Android:centerY="0"
Android:gradientRadius="300"/>
<padding Android:bottom="1dp" Android:left="0dp" Android:right="3dp" Android:top="0dp" />
</shape>
</item>
<item Android:bottom="2dp" Android:left="3dp">
<shape>
<corners Android:radius="1dp" />
<solid Android:color="@color/colorPrimary" />
</shape>
</item>
</layer-list>
</item>
</selector>
Versuchen Sie dies, wenn dies für Sie funktioniert
Android:background="@drawable/drop_shadow"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:paddingLeft="3dp"
Android:paddingTop="3dp"
Android:paddingRight="4dp"
Android:paddingBottom="5dp"
Sie können dies versuchen:
<?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="1dp" Android:top="3dp">
<shape>
<solid Android:color="#a5040d" />
<corners Android:radius="3dip"/>
</shape>
</item>
</layer-list>
</item>
<item>
<layer-list>
<item Android:left="0dp" Android:top="0dp">
<shape>
<solid Android:color="#99080d" />
<corners Android:radius="3dip"/>
</shape>
</item>
<item Android:bottom="3dp" Android:right="2dp">
<shape>
<solid Android:color="#a5040d" />
<corners Android:radius="3dip"/>
</shape>
</item>
</layer-list>
</item>
Beispiel 9 Patchbild mit Schatten
Nach langem Suchen fand ich eine einfache Methode.
Erstellen Sie ein 9-Patch-Bild und wenden Sie es als Schaltfläche oder Hintergrund einer anderen Ansicht an.
Sie können ein 9-Patch-Bild mit Schatten erstellen, indem Sie diese website verwenden.
Legen Sie das 9-Patch-Bild in Ihr gezeichnetes Verzeichnis und wenden Sie es als Hintergrund für die Schaltfläche an.
mButton.setBackground(ContextCompat.getDrawable(mContext, R.drawable.your_9_patch_image);