button with shadow that look like gradient in android xml -


i trying achieve button selector on press shadow removed..

enter image description here

but can seem close this..this shadow side , not reaching corners , can effect via xml ?

this xml close image 

<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android">      <item android:state_pressed="true" android:right="5dp" android:top="5dp" >         <layer-list>             <item android:right="5dp" android:top="5dp" >                 <shape>                     <corners android:radius="6dp" />                     <gradient android:angle="45" android:endcolor="@color/white" android:startcolor="#d6d6d6" />                  </shape>             </item>             <item  android:right="5dp" android:top="5dp">                 <shape                     android:shape="rectangle">                     <solid android:color="@color/white"/>                      <corners android:radius="6dp" />                      <padding                         android:bottom="10dp"                         android:left="10dp"                         android:right="10dp"                         android:top="10dp" />                     <stroke android:width="0.5px" android:color="@color/gray_50"/>                 </shape>             </item>         </layer-list>     </item>   <item>      <layer-list>         <item android:right="5dp" android:top="5dp" >             <shape>                 <corners android:radius="6dp" />                  <gradient android:angle="45" android:endcolor="@color/white" android:startcolor="#d6d6d6" />              </shape>         </item>         <item  android:bottom="2dp" android:left="2dp">             <shape                 android:shape="rectangle">                 <solid android:color="@color/white"/>                  <corners android:radius="6dp" />                  <padding                     android:bottom="10dp"                     android:left="10dp"                     android:right="10dp"                     android:top="10dp" />                 <stroke android:width="0.5px" android:color="@color/gray_50"/>             </shape>         </item>     </layer-list>   </item> </selector>

try using background. 

<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <item>     <shape android:shape="rectangle" >        <solid android:color="#fff" />         <corners android:radius="4dp" />     </shape> </item> <item android:bottom="1dp">     <shape android:shape="rectangle" >        <corners android:radius="4dp" />         <stroke android:width="1dp"         android:color="#dadad7" />         <solid android:color="#fff" />     </shape> </item> </layer-list>

i hope work


Comments

Post a Comment

Popular posts from this blog

javascript - AngularJS custom datepicker directive -

i make custom datepicker directive custom template. but have no idea how start building it... how include date data directive? i appreciate guide or give me advice work on more precisely. it might you! follow below steps html code sample: <label>birth date</label> <input type="text" ng-model="birthdate" date-options="dateoptions" custom-datepicker/> <hr/> <pre>birthdate = {{birthdate}}</pre> <script type="text/ng-template" id="custom-datepicker.html"> <div class="enhanced-datepicker"> <div class="proxied-field-wrap"> <input type="text" ui-date-format="yy-mm-dd" ng-model="ngmodel" ui-date="dateoptions"/> </div> <label> <button class="btn" type="button"><i class="icon-calendar"></i>
Read more

javascript - jQuery date picker - Disable dates after the selection from the first date picker -

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jquery ui datepicker - default functionality</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script> $(function () { $("#datepicker1").datepicker(); }); </script> <script> $(function () { $("#datepicker2").datepicker(); }); </script> </head> <body> <p>date 1: <input type="text" id="datepicker1"></p> <p>date 2: <input type="t
Read more