现在的位置: 首页 > 综合 > 正文

Android的shape美化

2012年10月30日 ⁄ 综合 ⁄ 共 6266字 ⁄ 字号 评论关闭

Eg1:shape使android组件呈现特殊效果

 

 

 

使用到的布局文件

 view plaincopyprint?<?xml version="1.0" encoding="utf-8"?> 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical"  
    android:background="#ffffff" 
    android:gravity="center_horizontal"> 
 
    <TextView 
        android:id="@+id/text" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:textColor="#000000" 
        android:text="未使用效果" 
        android:layout_marginTop="30dp" 
        /> 
    <EditText 
        android:id="@+id/edit" 
        android:layout_width="280dp" 
        android:layout_height="wrap_content" 
        android:textColor="#000000" 
        android:text="未使用效果 未使用效果 未使用效果 未使用效果 未使用效果 未使用效果" 
        android:cursorVisible="true" 
         /> 
    <TextView 
        android:id="@+id/text" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:textColor="#000000" 
        android:text="使用效果" 
        android:layout_marginTop="10dp" 
        /> 
    <EditText 
        android:id="@+id/edit2" 
        android:layout_width="280dp" 
        android:layout_height="wrap_content" 
        android:textColor="#000000" 
        android:text="使用效果 使用效果 使用效果 使用效果 使用效果 使用效果 使用效果  使用效果" 
        android:background="@drawable/shape" 
        android:cursorVisible="true" 
         /> 
     
 
</LinearLayout> 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:background="#ffffff"
    android:gravity="center_horizontal">

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#000000"
        android:text="未使用效果"
        android:layout_marginTop="30dp"
        />
    <EditText
        android:id="@+id/edit"
        android:layout_width="280dp"
        android:layout_height="wrap_content"
        android:textColor="#000000"
        android:text="未使用效果 未使用效果 未使用效果 未使用效果 未使用效果 未使用效果"
        android:cursorVisible="true"
         />
    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#000000"
        android:text="使用效果"
        android:layout_marginTop="10dp"
        />
    <EditText
        android:id="@+id/edit2"
        android:layout_width="280dp"
        android:layout_height="wrap_content"
        android:textColor="#000000"
        android:text="使用效果 使用效果 使用效果 使用效果 使用效果 使用效果 使用效果  使用效果"
        android:background="@drawable/shape"
        android:cursorVisible="true"
         />
   

</LinearLayout>

 

 

 

使用到的shape文件 

 

shape各项对应功能

gradient    设置背景颜色渐变。

startColor  起始颜色值

endColor   结束颜色值

angle         为渐变角度

padding     设置组件里内容距离组件内边框的间距

stroke       设置组件的边框。width为边框宽度,color为边框颜色

 

[java] view plaincopyprint?<?xml version="1.0" encoding="utf-8"?> 

<shape xmlns:android="http://schemas.android.com/apk/res/android" > 
 
    <corners 
        android:radius="10dp" 
        /> 
    <gradient  
        android:startColor="#33CC00" 
        android:endColor="#666600" 
        android:angle="45" 
        /> 
    <padding 
        android:left="5dp" 
        android:top="5dp" 
        android:right="5dp" 
        android:bottom="5dp" 
        /> 
    <stroke 
        android:width="3dp" 
        android:color="#FF3300" 
        /> 
     
</shape> 
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <corners
        android:radius="10dp"
        />
 <gradient
     android:startColor="#33CC00"
     android:endColor="#666600"
     android:angle="45"
     />
 <padding
     android:left="5dp"
     android:top="5dp"
     android:right="5dp"
     android:bottom="5dp"
     />
 <stroke
     android:width="3dp"
     android:color="#FF3300"
     />
 
</shape>

Eg2:

 

<?xml version="1.0" encoding="utf-8"?>  
<shape xmlns:android="http://schemas.android.com/apk/res/android" >  
     <!-- 填充 -->
    <solid
        android:color="#B2B2B2"
        />  
        
    <!-- 大小 -->
    <size
        android:width="200dp"
        android:height="50dp"
        />   
     
     <!-- 渐变色 -->
    <gradient
        android:startColor="#DBDCDD"
        android:endColor="#B8B9BB"
        android:centerColor="#ADADAF"
        android:angle="270" 
        />  
      
         
    <!-- 描边 -->
    <stroke
        android:width="2dp"
        android:color="#3D4148" 
        />   
             
    <!-- 圆角 -->
    <corners 
       android:radius="5dp" 
        />  
      
    <padding
        android:left="10dp"
        android:top="10dp"
        android:right="10dp"
        android:bottom="10dp"
        />  
     
</shape>  
     
<!--   
     
1、  solid   
     描述:内部填充  
      属性     android:color 填充颜色  
     
     
2、size   
     描述:size: 大小  
     属性:  
     android:width   表示形状的宽度  
     android:height 表示形状的高度  
     
3、gradient  
          
      描述: 渐变色  
        
       属性:  
       android:startColor  起始颜色  
       android:endColor    结束颜色  
       android:angle       渐变角度(PS:当angle=0时,渐变色是从左向右。 然后逆时针方向转,当angle=90时为从下往上。angle必须为45的整数倍)  

       android:type       渐变类型(取值:linear、radial、sweep)  
                            linear  线性渐变,这是默认设置  
                            radial  放射性渐变,以开始色为中心。  
                            sweep   扫描线式的渐变。  
       android:centerColor  渐变中间颜色,即开始颜色与结束颜色之间的颜色  
       android:useLevel   如果要使用LevelListDrawable对象,就要设置为true。设置为true无渐变。false有渐变色  

       android:gradientRadius  渐变色半径.当 android:type="radial" 时才使用。单独使用 android:type="radial"会报错。  

       android:centerX    渐变中心X点坐标的相对位置  
       android:centerY   渐变中心Y点坐标的相对位置  
4、stroke  
     
    描述: stroke:描边  相当于html中的盒子模型的border  
             
   属性:  
        android:width 描边的宽度  
        android:color 描边的颜色  
        android:dashWidth 表示描边的样式是虚线的宽度,  
                                                             值为0时,表示为实线。值大于0则为虚线。  

        android:dashGap  表示描边为虚线时,虚线之间的间隔 即“ - - - - ”  
             
 5、corners  
      
         描述: corners: 圆角  
          
        属性:  
        android:radius  半径  
        android:topLeftRadius  左上角半径  
        android:topRightRadius  右上角半径  
        注意一下两个属性比较不同:  
        android:bottomLeftRadius 右下角半径  
        android:bottomRightRadius 左下角半径  
 6、padding  
               
          描述:内部边距,即内容与边的距离  
               
         属性:  
        android:left  左内边距  
        android:top   上内边距  
        android:right  右内边距  
        android:bottom 下内边距  
 -->

抱歉!评论已关闭.