Issue
Is there any way in Android that applies drop shadow as shown in Figma or XD Tool ?
I have got a figma design and I am stuck in creating this drop effect I have tried it using selector
and layer-list
Is there any way to apply x , y and blur effect along with shadow color with opacity.
The above attributes only work for EditText but not working for TextInputLayout
My View Attribues in Figma are below .
Solution
New and Best Approach (I hope that's what you required)
<com.google.android.material.textfield.TextInputLayout
android:id="@+id/passwordTV"
style="@style/Widget.App.TextInputLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@drawable/text_input_selector"
android:backgroundTint="#0B102C"
android:outlineAmbientShadowColor="#1EB0D5"
android:outlineSpotShadowColor="#1EB0D5"
android:textColorHint="#4A5478"
android:translationZ="@dimen/_10sdp"
app:endIconDrawable="@drawable/ic_show_password"
app:endIconMode="password_toggle"
app:hintTextColor="#4A5478">
<com.google.android.material.textfield.TextInputEditText
android:id="@+id/passwordEt"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:drawableStart="@drawable/ic_lock"
android:drawablePadding="7dp"
android:hint=" Password"
android:inputType="textPassword"
android:textColor="@color/white"
android:textColorHint="#CAD5F4"
android:textSize="12dp" />
</com.google.android.material.textfield.TextInputLayout>
you just create a text_input_selector in drawable
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_focused="true" android:drawable="@drawable/background_glow"/> </selector>
text_input_selector.xml
Now create a shape for background glow in drawable
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#0C263E"/>
<corners android:radius="7dp"/>
</shape>
background_glow.xml
Answered By - Muhammad Ibrahim
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.