Android shape和selector 結合使用執行個體代碼_Android

來源:互聯網
上載者:User

shape和selector是Android UI設計中經常用到的,比如我們要自訂一個圓角Button,點擊Button有些效果的變化,就要用到shape和selector。可以這樣說,shape和selector在美化控制項中的作用是至關重要的。

1.Shape

簡介

作用:XML中定義的幾何形狀

位置:res/drawable/檔案的名稱.xml

使用的方法:

Java代碼中:R.drawable.檔案的名稱

XML中:android:background="@drawable/檔案的名稱"

屬性:

<shape>  android:shape=["rectangle" | "oval" | "line" | "ring"]

其中rectagle矩形,oval橢圓,line水平直線,ring環形

<shape>中子節點的常用屬性:

<gradient>  漸層

android:startColor  起始顏色

android:endColor  結束顏色            

android:angle  漸層角度,0從上到下,90表示從左至右,數值為45的整數倍預設為0;

android:type  漸層的樣式 liner線性漸層 radial環形漸層 sweep

<solid >  填充

android:color  填充的顏色

<stroke > 描邊

android:width 描邊的寬度

android:color 描邊的顏色

android:dashWidth 表示'-'橫線的寬度

android:dashGap 表示'-'橫線之間的距離

<corners > 圓角

android:radius  圓角的半徑 值越大角越圓

android:topRightRadius  右上圓角半徑

android:bottomLeftRadius 右下圓角角半徑

android:topLeftRadius 左上圓角半徑

android:bottomRightRadius 左下圓角半徑

 2.Selector

簡介

位置:res/drawable/檔案的名稱.xml

使用的方法:

Java代碼中:R.drawable.檔案的名稱

XML中:android:background="@drawable/檔案的名稱"

<?xml version="1.0" encoding="utf-8" ?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- 預設時的背景圖片--> <item android:drawable="@drawable/pic1" />  <!-- 沒有焦點時的背景圖片 --> <item  android:state_window_focused="false"  android:drawable="@drawable/pic_blue"  />  <!-- 非觸摸模式下獲得焦點並單擊時的背景圖片 --> <item  android:state_focused="true"  android:state_pressed="true"  android:drawable= "@drawable/pic_red"  />  <!-- 觸摸模式下單擊時的背景圖片--> <item  android:state_focused="false"  android:state_pressed="true"  android:drawable="@drawable/pic_pink"  />  <!--選中時的圖片背景--> <item  android:state_selected="true"  android:drawable="@drawable/pic_orange"  />  <!--獲得焦點時的圖片背景--> <item  android:state_focused="true"  android:drawable="@drawable/pic_green"  /> </selector> 

先看看這個例子的結構:

selector.xml

<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android">   <item android:state_selected="true">  <shape>   <gradient android:angle="270" android:endColor="#99BD4C"   android:startColor="#A5D245" />   <size android:height="60dp" android:width="320dp" />   <corners android:radius="8dp" />  </shape>  </item>  <item android:state_pressed="true">  <shape>   <gradient android:angle="270" android:endColor="#99BD4C"   android:startColor="#A5D245"/>   <size android:height="60dp" android:width="320dp" />   <corners android:radius="8dp" />  </shape>  </item>  <item>  <shape>   <gradient android:angle="270" android:endColor="#A8C3B0"   android:startColor="#C6CFCE" />   <size android:height="60dp" android:width="320dp" />   <corners android:radius="8dp" />  </shape>  </item> </selector>  

list_item.xml

<?xml version="1.0" encoding="utf-8"?>  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  android:orientation="horizontal"  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:background="@drawable/selector"  >    <ImageView  android:id="@+id/img"  android:layout_width="wrap_content"  android:layout_height="wrap_content"   android:layout_gravity="center_vertical"  android:layout_marginLeft="20dp"   />     <TextView   android:text="data"   android:id="@+id/title"   android:layout_width="fill_parent"   android:layout_height="wrap_content"   android:gravity="center_vertical"   android:layout_marginLeft="20dp"   android:layout_marginTop="20dp"   android:textSize="14sp"      android:textStyle="bold"   android:textColor="@color/black"      >  </TextView>   </LinearLayout> 

main.xml

<?xml version="1.0" encoding="utf-8"?>  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  android:orientation="vertical"  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:background="#253853"  >      <ListView   android:id="@+id/list"   android:layout_width="match_parent"   android:layout_height="match_parent"   android:cacheColorHint="#00000000"   android:divider="#2A4562"   android:dividerHeight="3px"   android:listSelector="#264365"   android:drawSelectorOnTop="false"   >  </ListView> </LinearLayout> 

colors.xml

<?xml version="1.0" encoding="utf-8"?> <resources>  <color name="white">#FFFFFFFF</color>  <color name="transparency">#00000000</color>  <color name="title_bg">#1C86EE</color>  <color name="end_color">#A0cfef83</color>  <color name="black">#464646</color> </resources> 

MainActivity.java

package com.lingdududu.customlist;  import java.util.ArrayList; import java.util.HashMap;  import xb.customlist.R;  import android.R.array; import android.app.Activity; import android.os.Bundle; import android.widget.ArrayAdapter; import android.widget.ListView; import android.widget.SimpleAdapter;  public class MainActivity extends Activity {  ListView list;   String data[] = new String[]{   "China","UK","USA","Japan","German","Canada","ET","Narotu"  };    /** Called when the activity is first created. */  @Override  public void onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentView(R.layout.main);      list =(ListView) findViewById(R.id.list);     SimpleAdapter adapter = new SimpleAdapter(this, getData(), R.layout.list_item,   new String[]{"title","img"}, new int[]{R.id.title,R.id.img});    list.setAdapter(adapter);   }   private ArrayList<HashMap<String, Object>> getData() {  ArrayList<HashMap<String, Object>> dlist = new ArrayList<HashMap<String,Object>>();    for(int i =0;i<data.length;i++){   HashMap<String, Object>map = new HashMap<String, Object>();    map.put("title", data[i]);   map.put("img", R.drawable.item_left2);   dlist.add(map);  }  return dlist;  } } 

效果圖:

以上就是對 Android shape和selector 的資料整理,有開發這塊的同學可以看下。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.