Android開發之路九——UI組件4

                   

今天繼續學習UI組件，主要是學習的是ProgressBar(進度條)、SeekBar、ImageView(處理圖片顯示)、和TabHost(切換組件)。

 

1、            ProgressBar組件

下面通過案例示範來說明：

 

首先建一個名為ProgressBar的Activity的類

案例實現過程：

public class ProgressbarDemo extendsActivity{

     ProgressBar progressbar = null;

     inti=0;

     intprogressbarMax = 0;

     Handler handler = new Handler();

    

    @Override

    publicvoid onCreate(BundlesavedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.progress);

        findViews();

    }

 

    private void findViews() {

        progressbar =(ProgressBar) this.findViewById(R.id.progressbar2);

        progressbar.setMax(1000);

        progressbarMax =progressbar.getMax();

       

        new Thread(newRunnable(){

             

            public void run(){

                while(i<progressbarMax){

                    i=doWork();

                   

                    handler.post(newRunnable(){

                        public void run(){

                            progressbar.setProgress(i);

                        }

                    });

                    try {

                        Thread.sleep(50);

                    } catch(InterruptedException e) {

                        // TODO Auto-generated catch block

                        e.printStackTrace();

                    }

                }      

            }          

      }).start();

   }

    public int doWork(){

        return ++i;

    }

}

 

布局檔案progressbar.xml裡的代碼示範

 

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

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:orientation="vertical">

 

    <TextView

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:text="進度條示範" />

   

    <ProgressBar

         android:layout_width="wrap_content"

         android:layout_height="wrap_content"

         android:max="1000"

         android:progress="100"

         android:id="@+id/progressbar1"

        />

   

        <ProgressBar

         style="@android:style/Widget.ProgressBar.Horizontal"

         android:layout_marginTop="30dp"

         android:layout_width="fill_parent"

         android:layout_height="wrap_content"

         android:max="1000"

         android:progress="100"

         android:secondaryProgress="300"

         android:id="@+id/progressbar2"

        />

</LinearLayout>

 

 

資訊清單檔：

  <activity

            android:label="@string/app_name"

            android:name=".ProgressbarDemo">

            <intent-filter >

                <action android:name="android.intent.action.MAIN"/>

 

              <category android:name="android.intent.category.LAUNCHER"/>

            </intent-filter>

        </activity>

效果如退：

 

 

2、            TabHost(切換組件)

內部類：

 1、interface TabHost.OnTabChangeListener

    介面定義了當選項卡更改時被調用的回呼函數。

 

 2、 interfaceTabHost.TabContentFactory

     當某一選項卡被選中時產生選項卡的內容

      

3、             class TabHost.TabSpec

       單獨的選項卡，每個選項卡都有一個選項卡指示符，內容和tag標籤，以便於記錄。

      

       方法：

         public voidaddTab(TabHost.TabSpec tabSpec)

           新增加一個選項卡

           參數

              tabSpec —— 指定怎樣建立指示符和內容。

 

下面通過案例示範來說明：

 

首先建一個名為TabHost的Activity的類

代碼參考：

public class TabHostDemo extends TabActivity {

    TabHost tabHost = null;

 

    @Override

    protected void onCreate(Bundle savedInstanceState){

        super.onCreate(savedInstanceState);

       

         tabHost = this.getTabHost();

        

         LayoutInflaterinflater = LayoutInflater.from(this);

         //取出來給tabhost_layout

        inflater.inflate(R.layout.tabhost_layout,tabHost.getTabContentView(),true);

        

    tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("切換標籤").setContent(R.id.tab1));

        

 tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("SeekBardemo").

                 setContent(new Intent(this,SeekBarDemo.class)));

 

        //setIndicator表示的是標籤的名字  tab1  tab2   tab3  是他的ID值

        tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("ImageViewDemo"). 

                 setContent(new Intent(this,ImageViewDemo.class)));

        

         findViews();

    }

 

    private void findViews() {

      Button btn = (Button) this.findViewById(R.id.button);

      //實現監聽

    btn.setOnClickListener(newView.OnClickListener() {

        @Override

        public voidonClick(View v) {

            //tabHost.setCurrentTab(1);

            tabHost.setCurrentTabByTag("tab2");

        }

    });   

    }  

}

布局檔案中tabhost.xml裡的代碼：

<TabHostxmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent">

   

<LinearLayout

    android:id="@+id/tab1"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical">

   

    <Button

        android:id="@+id/button"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:text="切換至tab2"/>

    

    <ImageView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:src="@drawable/pig"

        android:scaleType="fitCenter"

        android:layout_marginTop="20dp"

        />   

</LinearLayout>

</TabHost>

 

最後就是配置資訊清單檔：

<application

        android:icon="@drawable/ic_launcher"

        android:label="@string/app_name">

        <activity

            android:label="@string/app_name"

            android:name=".HostDemo">

            <intent-filter >

                <action android:name="android.intent.action.MAIN"/>

 

             <category android:name="android.intent.category.LAUNCHER"/>

            </intent-filter>

        </activity>

        <activity

            android:name=".SeekBarDemo">

        </activity>

            <activity

                android:name=".ImageViewDemo">

                </activity>

</application>

 

效果

 

3、SeekBar組件

下面通過案例示範來說明：

首先建一個名為SeekBar的Activity的類

案例實現過程：

 

public class SeekBarDemo extends Activity
implementsOnSeekBarChangeListener {

    SeekBar seekbar = null;

 

    @Override

    protected void onCreate(Bundle savedInstanceState){

   

        super.onCreate(savedInstanceState);

 

        this.setContentView(R.layout.seekbar_layout);

       

        findViews();

    }

 

    private void findViews() {

        seekbar = (SeekBar) this.findViewById(R.id.seekbar);

        //監聽的註冊

        seekbar.setOnSeekBarChangeListener(this);

    }

    

    @Override//監聽的方法

    public void onProgressChanged(SeekBar seekBar,
intprogress,

            boolean fromUser) {

        Log.d("TAG","changed:"+ String.valueOf(seekBar.getProgress()));  

    }

 

    @Override

    public void onStartTrackingTouch(SeekBar seekBar) {

       

        Log.d("TAG","start:"+ String.valueOf(seekBar.getProgress()));

    }

 

    @Override

    public void onStopTrackingTouch(SeekBar seekBar) {

        Log.d("TAG","stop:"+ String.valueOf(seekBar.getProgress()));

       

    }

}

布局檔案seekbar.xml裡的代碼示範

 

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical">

    <SeekBar

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:max="1000"

        android:id="@+id/seekbar"/>

</LinearLayout>

資訊清單檔：

<activity

            android:label="@string/app_name"

            android:name=".SeekBarDemo">

            <intent-filter >

                <action android:name="android.intent.action.MAIN"/>

 

              <category android:name="android.intent.category.LAUNCHER"/>

            </intent-filter>

        </activity>

實現效果