Android學習筆記— widget組件的基本介紹

 

簡單的學習了一下android的widget組件。以及它們的實現方式。

先說說最常用的button.

1. button 按紐

在main.xml檔案裡建立一個id為button的按扭

public class MainActivity extends Activity {
 
 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);
  Button button = (Button) findViewById(R.id.button);
  button.setOnClickListener(button_listener);
 }

先綁定R.layout.main.然後用findViewById的方法建立了一個button 並用setOnClickListener的方法對其監聽。 參數為botton_listener

對於這個參數 是這樣定義的

private Button.OnClickListener button_listener = new Button.OnClickListener() {
  public void onClick(View v) {
   setTitle("點了一下");
  }
 };

使用了匿名內部類 對OnClickListener介面new了個對象 並做出了具體的實現。設定當前的Activity的title為"點了一下"。

2. TextView 標籤（不可編輯的文字框）

 這是其具體屬性

<TextView 
    android:id="@+id/text_view"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="16sp"  帶比例的像素
    android:textColor="#ffffff"
 android:padding="10dip"
 android:background="#cc0000"
    android:text="這裡是TextView，你可以在這裡輸入需要顯示的文字資訊.."
    />

3. EditText 文字框 (可編輯的)

 同上

4. CheckBox 多選框

<CheckBox android:id="@+id/plain_cb"
     android:text="Plain"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
/>
 
<CheckBox android:id="@+id/serif_cb"
     android:text="Serif"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:typeface="serif"
/>
 
<CheckBox android:id="@+id/bold_cb"
     android:text="Bold"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:textStyle="bold"
/>
 每一個CheckBox都有一個自己的id有自己的text 還可以設定自己的style 這個和html基本一樣。

5. RadioGroup 單選

   <RadioGroup
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:checkedButton="@+id/lunch"
        android:id="@+id/menu">
        <RadioButton
            android:text="breakfast"
            android:id="@+id/breakfast"
            />
        <RadioButton
            android:text="lunch"
            android:id="@id/lunch" />
        <RadioButton
            android:text="dinner"
            android:id="@+id/dinner" />
        <RadioButton
            android:text="all"
            android:id="@+id/all" />
    </RadioGroup>

外面是一個RadioGroup組件 有他自己的ID，裡麵包含多個RadioButton 每一個都有自己的ID 選中事件也是isChecked().

6. Spinner 下拉式清單

  下拉式清單是要有內容的。感覺這個組件的實現方式相對麻煩一些。有兩種實現的方式。

  （1）先定義幾個字串 存在數組裡

   private static final String[] mCountries = { "China" ,"Russia", "Germany",
   "Ukraine", "Belarus", "USA" };

   spinner_c = (Spinner) findViewById(R.id.spinner_1);
   allcountries = new ArrayList<String>();                    定義一個ArrayList<String>
   for (int i = 0; i < mCountries.length; i++) {     
   allcountries.add(mCountries[i]);                           遍曆數組把內容存在集合裡
  }
  aspnCountries = new ArrayAdapter<String>(this,              把集合放在ArrayAdapter對     
    android.R.layout.simple_spinner_item, allcountries);      象裡並指定位置
  aspnCountries
    .setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item); 
  spinner_c.setAdapter(aspnCountries);

 調用ArrayAdapter對象的SetDropDownViewResource的方法

 最後用spinner對象的setAdapter方法填加內容。

(2) 還可以在xml檔案裡預先定義資料

        spinner_2 = (Spinner) findViewById(R.id.spinner_2);
        ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(
                this, R.array.countries, android.R.layout.simple_spinner_item);
        adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
        spinner_2.setAdapter(adapter);

<resources>
    <!-- Used in Spinner/spinner_2.java -->
    <string-array name="countries">
        <item>China2</item>
        <item>Russia2</item>
        <item>Germany2</item>
        <item>Ukraine2</item>
        <item>Belarus2</item>
        <item>USA2</item>
    </string-array>
</resources>

在res/values/目錄下建立array.xml的檔案 然後通過R.array.countries找到

7. AutoCompleteTextView自動完成文本

 對於這個組件，我覺得挺牛的。目前只會一個簡單的自動匹配功能

ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                 android.R.layout.simple_dropdown_item_1line, COUNTRIES);
         AutoCompleteTextView textView = (AutoCompleteTextView) findViewById(R.id.auto_complete);
         textView.setAdapter(adapter);

static final String[] COUNTRIES = new String[] {
  "China" ,"Russia", "Germany",
  "Ukraine", "Belarus", "USA" ,"China1" ,"China12", "Germany",
  "Russia2", "Belarus", "USA"
     };

   把COUNTRIES數組的內容綁定進去

對應的xml

<AutoCompleteTextView android:id="@+id/auto_complete"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"/>

在輸入ch的時候 裡面與其匹配的內容就自動顯示出來了。 這個挺強大的，理解的還不深刻。

8. DatePicker 日期選取器

 DatePicker dp =  (DatePicker)this.findViewById(R.id.date_picker);
  dp.init(2009, 5, 17, null);

用init方法進行初始化

<DatePicker
     android:id="@+id/date_picker"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />
9. TimePicker

跟上面的DatePicker差不多

10. ScrollView 滾動視圖

 當主介面要顯示的內容超過一個螢幕的時候 可以在xml檔案版面配置容器外面加上

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">

 用這個組件把他包起來，這樣就OK了。

11. ProgressBar 進度條

<TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="圓形進度條" />      
<ProgressBar
   android:id="@+id/progress_bar"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"/>

<TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="水平進度條" />     
<ProgressBar android:id="@+id/progress_horizontal"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="200dip"
        android:layout_height="wrap_content"
        android:max="100"
        android:progress="50"
        android:secondaryProgress="75" />
</LinearLayout>

12. SeekBar 拖動條

 <SeekBar
        android:id="@+id/seek"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:max="100"
        android:thumb="@drawable/seeker"
        android:progress="50"/>

  android:thumb="@drawable/seeker" 可以設定拖動圖表的圖片

13. ImageView 圖片視圖

 <ImageView
  android:id="@+id/imagebutton"
  android:src="@drawable/eoe"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"/>

 展示一張指定的圖片 這個很簡單

14. ImageSwitcher&Gallery（畫廊） 切換圖片

 這個組件挺複雜的

 <RelativeLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="fill_parent"
       android:layout_height="fill_parent">
      
       <ImageSwitcher
       android:id="@+id/switcher"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
              android:layout_alignParentTop="true"
              android:layout_alignParentLeft="true" />
             
       <Gallery android:id="@+id/gallery"
       android:background="#55000000"
              android:layout_width="fill_parent"
              android:layout_height="60dp"
              android:layout_alignParentBottom="true"
              android:layout_alignParentLeft="true"
              android:gravity="center_vertical"
              android:spacing="16dp" />
</RelativeLayout>

這是它的xml檔案 它分為兩部分 ImageSwitcher 和 Gallery 最終實現是螢幕上面展示一個大圖，螢幕下面是一組可以滾動的圖片。

代碼比較複雜 這裡就不介紹了

15. TabHost 切換面版

TabHost tabHost = getTabHost();
  LayoutInflater.from(this).inflate(R.layout.tab_demo,
    tabHost.getTabContentView(), true);
  tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("tab1")
    .setContent(R.id.view1));
  tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab2")
    .setContent(R.id.view2));
  tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab3")
    .setContent(R.id.view3));

先getTabHost()擷取一個TabHost,然後綁定模板，進行綁定每個標籤的內容關聯，看下模板檔案

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TextView android:id="@+id/view1"
        android:background="@drawable/blue"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:text="這裡是Tab1裡的內容。"/>

    <TextView android:id="@+id/view2"
        android:background="@drawable/red"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:text="這裡是Tab2，balabalal....。"/>

    <TextView android:id="@+id/view3"
        android:background="@drawable/green"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:text="Tab3"/>

</FrameLayout>
組件基本就這麼多，感覺學這個 要多琢磨，多嘗試。才能學好。

 

原文：http://blog.sina.com.cn/s/blog_61c62a960100ev5k.html