android應用開發之ImageView,SeekBar,TableHost,ProgressBar的使用 – Android移動開發技術文章_手機開發 Android移動開發教學課程

先讓大傢看一個效果圖

 

怎麼樣,效果炫嗎?

讓我們來分析一下,這種效果怎麼樣才能實現呢?

首先我們註意一下,上方幾個橫著切換的功能是TabHost

TabHost

提供選項卡(Tab頁)的窗口視圖容器。此對象包含兩個子對象:一組是用戶可以選擇指定Tab頁的標簽;另一組是FrameLayout用來顯示該Tab頁的內容。通常控制使用這個容器對象,而不是設置在子元素本身的值。(譯者註:即使使用的是單個元素,也最好把它放到容器對象ViewGroup裡)

內部類

interfaceTabHost.OnTabChangeListener   

接口定義瞭當選項卡更改時被調用的回調函數

 

interface TabHost.TabContentFactory 

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

 

class TabHost.TabSpec    

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

 

公共方法

public void addTab(TabHost.TabSpec tabSpec)

新增一個選項卡

參數

tabSpec   指定怎樣創建指示符和內容.

<?xml version="1.0" encoding="utf-8"?> 
<TabHost xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" > 
 
    <LinearLayout android:id="@+id/tab1" android:orientation="vertical" 
        android:layout_width="fill_parent" android:layout_height="fill_parent"> 
        <Button android:id="@+id/button" android:layout_width="fill_parent" 
            android:layout_height="wrap_content" android:text="切換到第3個標簽" /> 
        <ImageView  android:layout_width="fill_parent" 
            android:layout_height="wrap_content" android:src="@drawable/background" android:layout_marginTop="30dp"/> 
    </LinearLayout> 
</TabHost> 

import android.app.TabActivity; 
import android.content.Intent; 
import android.os.Bundle; 
import android.view.LayoutInflater; 
import android.widget.TabHost; 
 
public class TableHostTest extends TabActivity { 
 
    private TabHost tabHost = null; 
 
    @Override  
    protected void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        tabHost = this.getTabHost(); 
        LayoutInflater inflater = LayoutInflater.from(this); 
        /*註意true的作用*/ 
        inflater.inflate(R.layout.tablehost, tabHost.getTabContentView(),true); 
        tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("界面1").setContent(R.id.tab1)); 
        tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("界面2").setContent(new Intent(this,SeekBarDemo.class))); 
        tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("界面3").setContent(new Intent(this,UITest4Activity.class))); 
    } 
     

 


進度條顯示:

 


<?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" > <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="500" android:secondaryProgress="300" android:id="@+id/progressbar2" /> </LinearLayout>

 

import android.app.Activity; 
import android.os.Bundle; 
import android.os.Handler; 
import android.util.Log; 
import android.widget.ProgressBar; 
 
public class ProgressBarDemo extends Activity{ 
     
    ProgressBar progressbar = null; 
    static int i = 0; 
    int progressbarMax = 0; 
 
    Handler handler = new Handler(); 
     
    public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.progressbar_layout); 
         
        findViews(); 
    } 
 
    private void findViews() { 
        progressbar = (ProgressBar) this.findViewById(R.id.progressbar2); 
        progressbar.setMax(1000); 
        progressbarMax = progressbar.getMax(); 
         
        new Thread(new Runnable(){ 
             
            public void run(){ 
                while(i< progressbarMax){ 
                    i=doWork(); 
                     
                    handler.post(new Runnable(){ 
                     
                        public void run(){ 
                            progressbar.setProgress(i); 
                        } 
                    }); 
                    try { 
                        Thread.sleep(50); 
                    } catch (InterruptedException e) { 
                        // TODO Auto-generated catch block 
                        e.printStackTrace(); 
                    } 
                } 
            } 
        }).start(); 
 
    } 
     
    public int doWork(){ 
        Log.d("TAG", String.valueOf(i)); 
        return ++i; 
    } 
     
/*  //不能用!!!!
    public void run(){
        Log.d("TAG","thread starting…");
        
        while(i++ < progressbarMax){
            progressbar.setProgress(i);
            try {
                Thread.sleep(50);
            } catch (InterruptedException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
        }
    }
    */ 

 

 


下面用ImageView實現圖片預覽功能

 


import android.app.Activity; 
import android.graphics.Bitmap; 
import android.graphics.drawable.BitmapDrawable; 
import android.os.Bundle; 
import android.view.MotionEvent; 
import android.view.View; 
import android.view.View.OnTouchListener; 
import android.widget.ImageView; 
 
public class ImageViewDemo extends Activity implements OnTouchListener { 
 
    ImageView imageView1, imageView2; 
 
    protected void onCreate(Bundle savedInstanceState) { 
        // TODO Auto-generated method stub 
        super.onCreate(savedInstanceState); 
        this.setContentView(R.layout.imageview_layout); 
 
        findViews(); 
    } 
 
    private void findViews() { 
        imageView1 = (ImageView) findViewById(R.id.img1); 
        imageView2 = (ImageView) findViewById(R.id.img2); 
         
        imageView1.setOnTouchListener(this); 
 
    } 
 
    public boolean onTouch(View v, MotionEvent event) { 
        float scale = 412 / 320; 
 
        int x = (int) (event.getX() * scale); 
        int y = (int) (event.getY() * scale); 
         
        //嘗試考慮解決邊界問題 
        int width = (int) (100 * scale); 
        int height = (int) (100 * scale); 
 
        BitmapDrawable bitmapDrawable = (BitmapDrawable) imageView1.getDrawable(); 
         
        imageView2.setImageBitmap(Bitmap.createBitmap(bitmapDrawable.getBitmap(), 
                x,y, width, height)); 
         
        return false; 
    } 
 

 

 


<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" > 
 
    <ImageView 
        android:id="@+id/img1" 
        android:layout_width="fill_parent" 
        android:layout_height="300dp" 
        android:background="#cccccc" 
        android:src="@drawable/pig" /> 
 
    <ImageView 
        android:id="@+id/img2" 
        android:layout_width="100dp" 
        android:layout_height="100dp" 
        android:background="#cccccc" 
        android:scaleType="fitStart" 
        android:layout_marginTop="20dp" 
        /> 
 
</LinearLayout> 


調節音量等的控制條:


<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns: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> 

import android.app.Activity; 
import android.os.Bundle; 
import android.util.Log; 
import android.widget.SeekBar; 
import android.widget.SeekBar.OnSeekBarChangeListener; 
 
public class SeekBarDemo extends Activity implements OnSeekBarChangeListener { 
 
    SeekBar seekbar = null; 
 
    protected void onCreate(Bundle savedInstanceState) { 
        // TODO Auto-generated method stub 
        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, int progress, 
            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())); 
         
    } 
 

 摘自 瀟灑哥的專欄
 

發佈留言