Android View shadow

Question

I searched around  and I could not find a proper way to do this  I want to have the following shadow effects on my views      To be honest  I do not know if this second one is done by applying shadow effect  Any ideas

User · Answer

If you are in need of the shadows properly to be applied then you have to do the following.

Consider this view, defined with a background drawable:

<TextView
    android:id="@+id/myview"
    ...
    android:elevation="2dp"
    android:background="@drawable/myrect" />

The background drawable is defined as a rectangle with rounded corners:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
    <solid android:color="#42000000" />
    <corners android:radius="5dp" />
</shape>

This is the recomended way of appying shadows check this out https://developer.android.com/training/material/shadows-clipping.html#Shadows

User · Answer

putting a background of  android drawable dialog holo light frame  gives shadow but you can t change background color nor border style  so it s better to benefit from the shadow of it  while still be able to put a background via layer-list   lt  xml version  1 0  encoding  utf-8   gt   lt layer-list xmlns android  http   schemas android com apk res android  gt       lt  --the shadow comes from here-- gt       lt item         android bottom  0dp          android drawable   android drawable dialog holo light frame          android left  0dp          android right  0dp          android top  0dp  gt        lt  item gt        lt item         android bottom  0dp          android left  0dp          android right  0dp          android top  0dp  gt           lt  --whatever you want in the background  here i preferred solid white -- gt           lt shape android shape  rectangle  gt               lt solid android color   android color white    gt            lt  shape gt       lt  item gt   lt  layer-list gt    save it in the drawable folder under say shadow xml  to assign it to a view  in the xml layout file set the background of it   android background   drawable shadow

User · Answer

Use the elevation property for shadow affect    lt YourView             android elevation  3dp   gt

User · Answer

I m using Android Studio 0 8 6 and I couldn t find   android background   drawable abc menu dropdown panel holo light    so I found this instead   android background   android drawable dialog holo light frame    and it looks like this

User · Answer

Create background drawable like this to show rounded shadow    lt  xml version  1 0  encoding  utf-8   gt   lt layer-list xmlns android  http   schemas android com apk res android  gt       lt  -- Drop Shadow Stack -- gt       lt item gt           lt shape gt               lt corners android radius  4dp    gt               lt padding android bottom  1dp  android left  1dp                       android right  1dp   android top  1dp    gt               lt solid android color   00CCCCCC    gt           lt  shape gt       lt  item gt       lt item gt           lt shape gt               lt corners android radius  4dp    gt               lt padding android bottom  1dp  android left  1dp                       android right  1dp   android top  1dp    gt               lt solid android color   10CCCCCC    gt           lt  shape gt       lt  item gt       lt item gt           lt shape gt               lt corners android radius  4dp    gt               lt padding android bottom  1dp  android left  1dp                       android right  1dp   android top  1dp    gt               lt solid android color   20d5d5d5    gt           lt  shape gt       lt  item gt       lt item gt           lt shape gt               lt corners android radius  6dp    gt               lt padding android bottom  1dp  android left  1dp                       android right  1dp   android top  1dp    gt               lt solid android color   30cbcbcb    gt           lt  shape gt       lt  item gt       lt item gt           lt shape gt               lt corners android radius  4dp    gt               lt padding android bottom  1dp  android left  1dp                       android right  1dp   android top  1dp    gt               lt solid android color   50bababa    gt           lt  shape gt       lt  item gt        lt  -- Background -- gt       lt item gt           lt shape gt               lt solid android color   color gray 100    gt               lt corners android radius  4dp    gt           lt  shape gt       lt  item gt   lt  layer-list gt

User · Answer

use this shape as background      lt  xml version  1 0  encoding  utf-8   gt   lt layer-list xmlns android  http   schemas android com apk res android  gt        lt item android drawable   android drawable dialog holo light frame   gt        lt item gt           lt shape android shape  rectangle  gt               lt corners android radius  1dp    gt               lt solid android color   color gray 200    gt           lt  shape gt       lt  item gt    lt  layer-list gt

User · Answer

I know this question has already been answered but I want you to know that I found a drawable on Android Studio that is very similar to the pics you have in the question  Take a look at this   android background   drawable abc menu dropdown panel holo light    It looks like this     Hope it will be helpful  Edit  The option above is for the older versions of Android Studio so you may not find it  For newer versions   android background   android drawable dialog holo light frame    Moreover  if you want to have your own custom shape  I suggest to use a drawing software like Photoshop and draw it      Don t forget to save it as  9 png file  example  my background 9 png   Read the documentation  Draw 9-patch  Edit 2  An even better and less hard working solution is to use a CardView and set app cardPreventCornerOverlap  false  to prevent views to overlap the borders     lt android support v7 widget CardView     android id    id card view      android layout width  match parent      android layout height  wrap content      app cardCornerRadius  2dp      app cardElevation  2dp      app cardPreventCornerOverlap  false      app contentPadding  0dp  gt        lt  -- your layout stuff here -- gt    lt  android support v7 widget CardView gt    Also make sure to have included the latest version in the build gradle  current is  compile  com android support cardview-v7 26 0 0

User · Answer

Use elevation property to achieve a shadow affect     lt View         android elevation  2dp   gt    This is only to be used past v21  check out this link  http   developer android com training material shadows-clipping html

User · Answer

CardView gives you true shadow in android 5  and it has a support library  Just wrap your view with it and you re done    lt android support v7 widget CardView gt        lt MyLayout gt   lt  android support v7 widget CardView gt    It require the next dependency   dependencies               compile  com android support cardview-v7 21 0

User · Answer

I know this is stupidly hacky  but if you want to support under v21  here are my achievements    rectangle with 10dp radius white bg and shadow xml   lt  xml version  1 0  encoding  utf-8   gt   lt layer-list xmlns android  http   schemas android com apk res android  gt        lt  -- Shadow layers -- gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 1    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 2    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 3    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 4    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 5    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 6    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 7    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 8    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 9    gt           lt  shape gt       lt  item gt       lt item         android left  1dp          android right  1dp          android top  3dp  gt           lt shape gt               lt corners android radius  10dp    gt               lt padding                 android bottom  1 8dp                  android left  1dp                  android right  1dp                  android top  1dp    gt               lt solid android color   color shadow hack level 10    gt           lt  shape gt       lt  item gt        lt  -- Background layer -- gt       lt item gt           lt shape gt               lt solid android color   android color white    gt               lt corners android radius  10dp    gt           lt  shape gt       lt  item gt    lt  layer-list gt    rectangle with 10dp radius white bg and shadow xml  v21    lt  xml version  1 0  encoding  utf-8   gt   lt shape xmlns android  http   schemas android com apk res android      android shape  rectangle  gt       lt solid android color   android color white    gt       lt corners android radius  10dp    gt   lt  shape gt    view incoming xml   lt  xml version  1 0  encoding  utf-8   gt   lt LinearLayout xmlns android  http   schemas android com apk res android      xmlns tools  http   schemas android com tools      android layout width  match parent      android layout height  match parent      android background   drawable rectangle with 10dp radius white bg and shadow      android elevation  7dp      android gravity  center      android minWidth  240dp      android minHeight  240dp      android orientation  horizontal      android padding  16dp      tools targetApi  lollipop  gt        lt TextView         android id    id text1          android layout width  wrap content          android layout height  wrap content          tools text  Hello World      gt    lt  LinearLayout gt    Here is result    Under v21  this is which you made with xml    Above v21  real elevation rendering     The one significant difference is it will occupy the inner space from the view so your actual content area can be smaller than    lollipop devices

User · Answer

Create card background xml in the res drawable folder with the following code    lt  xml version  1 0  encoding  utf-8   gt   lt layer-list xmlns android  http   schemas android com apk res android  gt    lt item gt       lt shape android shape  rectangle  gt           lt solid android color   BDBDBD   gt           lt corners android radius  5dp   gt       lt  shape gt   lt  item gt    lt item     android left  0dp      android right  0dp      android top  0dp      android bottom  2dp  gt       lt shape android shape  rectangle  gt           lt solid android color   ffffff   gt           lt corners android radius  5dp   gt       lt  shape gt   lt  item gt   lt  layer-list gt    Then add the following code to the element to which you want the card layout  android background   drawable card background    the following line defines the color of the shadow for the card    lt solid android color   BDBDBD   gt

User · Answer

This question may be old  but for anybody in future that wants a simple way to achieve complex shadow effects check out my library here  https   github com BluRe-CN ComplexView  Using the library  you can change shadow colors  tweak edges and so much more  Here s an example to achieve what you seek for    lt com blure complexview ComplexView         android layout width  400dp          android layout height  600dp          app radius  10dp          app shadow  true          app shadowSpread  2  gt            lt com blure complexview ComplexView             android layout width  match parent              android layout height  match parent              app color   fdfcfc              app radius  10dp    gt       lt  com blure complexview ComplexView gt    To change the shadow color  use app shadowColor  your color code

User · Answer

This is may be late but for those who are still looking for answer for this I found a project on git hub and this is the only one that actually fit my needs  android-materialshadowninepatch  Just add this line on your build gradle dependency  compile  com h6ah4i android materialshadowninepatch materialshadowninepatch 0 6 3    cheers  thumbs up for the creator   happycodings

[android] Android View shadow

Examples related to android

Examples related to shadow

Examples related to dropshadow