Android组件4

1.ProgressBar

进度条是UI界面中一种非常实用组件，通常用于向用户显示某个耗时操作完成的百分比。

Android支持几种风格的进度条，通过style属性可以为ProgressBar指定风格：

• @android:style/Widget.ProgressBar.Horizontal  ：水平进度条
• @android:style/Widget.ProgressBar.Inverse： 不断跳跃、旋转画面的进度条
• @android:style/Widget.ProgressBar.Large：大进度条
• @android:style/Widget.ProgressBar.Large.Inverse:不断跳跃、旋转画面的大进度条
• @android:style/Widget.ProgressBar.Small:小进度条
• @android:style/Widget.ProgressBar.Small.Inverse：不断跳跃、旋转画面的小进度条

ProgressBar常用的XML属性:

• android:max   设置该进度条的最大值
•  android:progress  设置该进度条的已完成进度值
• android:progressDrawable  设置该进度条的轨道的绘制形式

在progressbar_layout.xml中代码如下：

<?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/progressbar"
	    />
	
	<ProgressBar 
	    style="@android:style/Widget.ProgressBar.Small"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:max="1000"
	    android:progress="100"
	    android:secondaryProgress="300"
	    android:id="@+id/progressbar2"
	    />
</LinearLayout>

在ProgressBarDemo.java中代码如下：

package cn.class3g.activity;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.widget.ProgressBar;

public class ProgressBarDemo extends Activity {
	ProgressBar progressbar = null;
	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(this).start();

		new Thread(new Runnable() {

			@Override
			public void run() {
				while (i < progressbarMax) {
					i=doWork();
					handler.post(new Runnable() {

						@Override
						public void run() {
							progressbar.setProgress(i);

						}
					});
					try {
						Thread.sleep(50);
					} catch (InterruptedException e) {
						// TODO Auto-generated catch block
						e.printStackTrace();
					}
				}

			}

			
		}).start();

	}
	private int doWork() {
		
		return i+=1;
	}
	/*
	 * public void run() {
	 * 
	 * while(i++ < progressbarMax){ progressbar.setProgress(i);
	 * 
	 * try { Thread.sleep(50); } catch (InterruptedException e) { // TODO
	 * Auto-generated catch block e.printStackTrace(); } } }
	 */

}

显示结果如下：

指定风格不同 产生效果不同

2.SeekBar

拖动条与进度条非常相似，只是进度条采用颜色填充来表明进度完成的程度，而拖动条则通过滑块的位置来标识数值-------而且拖动条运行用户拖动滑块来改变值，因此拖动条通常用于对系统的某种数值进行调节，比如调节音量。

在seekbar_layout.xml中代码如下

<?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>

在 SeekBarDemo.java中代码如下：

package cn.class3g.activity;

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);
		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.i("TAG","changed:"+String.valueOf(seekBar.getProgress()));
		
	}
	@Override
	public void onStartTrackingTouch(SeekBar seekBar) {
		Log.i("TAG","start:"+String.valueOf(seekBar.getProgress()));
		
	}
	@Override
	public void onStopTrackingTouch(SeekBar seekBar) {
		// TODO Auto-generated method stub
		
	}
	
}

显示效果如下：

3.ImageView

android:scaleType属性：

matrix：用矩阵来绘图
fitXY：拉伸图片（不按比例）以填充View的宽高
fitStart： 按比例拉伸图片，拉伸后图片的高度为View的高度，且显示在View的左边
fitCenter：按比例拉伸图片，拉伸后图片的高度为View的高度，且显示在View的中间
fitEnd：按比例拉伸图片，拉伸后图片的高度为View的高度，且显示在View的右边
center:按原图大小显示图片，但图片宽高大于View的宽高时，截图图片中间部分显示
centerCrop:按比例放大原图直至等于某边View的宽高显示。
centerInside:当原图宽高或等于View的宽高时，按原图大小居中显示；反之将原图缩放至View的宽高居中显示。
在imageview_layout.xml中代码如下：

<?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/ic1"
        
        />
    <ImageView 
        android:id="@+id/img2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#cccccc"
        android:scaleType="fitStart"
		android:layout_marginTop="20dp"        
        />

</LinearLayout>

在ImageViewDemo.java中代码如下：

package cn.class3g.activity;

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;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.imageview_layout);
		
		findViews();
	}
	private void findViews() {
		imageView1 = (ImageView) this.findViewById(R.id.img1);
		imageView2 = (ImageView) this.findViewById(R.id.img2);
		imageView1.setOnTouchListener(this);
	}
	
	public boolean onTouch(View v, MotionEvent event) {
		float scale = 200/163;
		
		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;
	}
	
}

显示效果如下：

4.TagHost

TabHost仅仅是一个简单的容器，它提供了两个方法：

newTabSpec（String tag）创建选项卡

addTab(TabHost.TabSpec tabSpec):添加选项卡

使用TabHost的一般步骤：

• 在界面布局中定义TabHost组件，并为组件定义该选项卡的内容。
  
• Activity应该继承TabActivity
• 调用TabActivity的getTabHost()方法获取TabHost对象
• 通过TabHost对象的方法来创建选项卡，添加选项卡

在tabhost_layout.xml中代码如下：

<?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: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/ic1"
            android:scaleType="fitCenter"
            android:layout_marginTop="20dp"
            />
        
        
    </LinearLayout>

</TabHost>

在TabHostDemo.java中代码如下：

package cn.class3g.activity;

import android.app.Activity;
import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.TabHost;

public class TabHostDemo extends TabActivity {
	TabHost tabHost = null;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tabhost_layout);
		tabHost = this.getTabHost();
		
		LayoutInflater inflater = LayoutInflater.from(this);
		inflater.inflate(R.layout.tabhost_layout, tabHost.getTabContentView(),true);
		tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("切换标签").setContent(R.id.tab1));
		tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("SeekBar demo").setContent(new Intent(this,SeekBarDemo.class)));
		tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("ImageView demo").setContent(new Intent(this,ImageViewDemo.class)));
		
		findViews();
	}
	private void findViews() {
		Button btn = (Button) this.findViewById(R.id.button);
		
		btn.setOnClickListener(new View.OnClickListener() {
			
			public void onClick(View v) {
				
//				tabHost.setCurrentTab(1);
				tabHost.setCurrentTabByTag("tab2");
			}
		});
			
	}
	
}

显示结果如下：