Android(7) - 控件(View)之ZoomControls, Include, VideoView, WebView, RatingBar, Tab, Spinner, Chronomete

介绍 
在 Android 中使用各种控件(View) 
ZoomControls - 放大/缩小按钮控件 
Include - 整合控件 
VideoView - 视频播放控件 
WebView - 浏览器控件 
RatingBar - 评分控件 
Tab - 选项卡控件 
Spinner - 下拉框控件 
Chronometer - 计时器控件 
ScrollView - 滚动条控件 




Java代码  
1、ZoomControls 的 Demo  
zoomcontrols.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="fill_parent">  
  
    <!--  
        放大/缩小按钮控件  
    -->  
    <ZoomControls android:id="@+id/zoomControls"  
        android:layout_width="wrap_content" android:layout_height="wrap_content"></ZoomControls>  
  
</LinearLayout>  
  
  
_ZoomControls.java  
  
代码   
package com.webabcd.view;  
  
import android.app.Activity;  
import android.os.Bundle;  
import android.view.View;  
import android.view.View.OnClickListener;  
import android.widget.Toast;  
import android.widget.ZoomControls;  
  
public class _ZoomControls extends Activity {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
        this.setContentView(R.layout.zoomcontrols);  
  
        setTitle("ZoomControls");  
  
        ZoomControls zoomControls = (ZoomControls) this.findViewById(R.id.zoomControls);  
        // setOnZoomInClickListener() - 响应单击放大按钮的事件  
        zoomControls.setOnZoomInClickListener(new OnClickListener() {  
            public void onClick(View v) {  
                Toast.makeText(_ZoomControls.this, "单击了放大按钮", Toast.LENGTH_SHORT).show();  
            }  
        });  
          
        // setOnZoomOutClickListener() - 响应单击缩小按钮的事件  
        zoomControls.setOnZoomOutClickListener(new OnClickListener() {  
            public void onClick(View v) {  
                Toast.makeText(_ZoomControls.this, "单击了缩小按钮", Toast.LENGTH_SHORT).show();      
            }  
        });  
  
    }  
}  
  
  
  
2、Include 的 Demo  
include.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="fill_parent">  
  
    <!--  
        include - 整合控件，将指定的 layout 整合进来  
            layout - 指定需要整合 layout  
    -->  
    <include android:id="@+id/cell1" layout="@layout/include_1" />  
    <include android:id="@+id/cell2" android:layout_width="fill_parent" layout="@layout/include_2" />  
  
</LinearLayout>  
  
  
include_1.xml  
  
代码   
<?xml version="1.0" encoding="utf-8"?>  
<TextView xmlns:android="http://schemas.android.com/apk/res/android"  
    android:text="TextView01" android:layout_width="wrap_content"  
    android:layout_height="wrap_content">  
</TextView>  
  
  
  
include_2.xml  
  
代码   
<?xml version="1.0" encoding="utf-8"?>  
<TextView xmlns:android="http://schemas.android.com/apk/res/android"  
    android:text="TextView02" android:layout_width="wrap_content"  
    android:layout_height="wrap_content">  
</TextView>  
  
  
_Include.java  
  
代码   
package com.webabcd.view;  
  
import android.app.Activity;  
import android.os.Bundle;  
  
public class _Include extends Activity {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
        this.setContentView(R.layout.include);  
  
        setTitle("Include");  
    }  
}  
  
  
  
3、VideoView 的 Demo  
videoview.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="fill_parent">  
  
    <!--  
        VideoView - 视频播放控件  
    -->  
    <VideoView android:id="@+id/videoView" android:layout_width="wrap_content"  
        android:layout_height="wrap_content">  
    </VideoView>  
          
</LinearLayout>  
  
  
_VideoView.java   
代码   
package com.webabcd.view;  
  
import android.app.Activity;  
import android.net.Uri;  
import android.os.Bundle;  
import android.widget.MediaController;  
import android.widget.VideoView;  
  
public class _VideoView extends Activity {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
        this.setContentView(R.layout.videoview);  
  
        setTitle("VideoView");  
          
        VideoView videoView = (VideoView) findViewById(R.id.videoView);  
          
        // 指定需要播放的视频的地址  
        videoView.setVideoURI(Uri.parse("android.resource://com.webabcd.view/" + R.raw.demo));  
        // videoView.setVideoPath();  
           
        // 设置播放器的控制条  
        videoView.setMediaController(new MediaController(this));  
        // 开始播放视频  
        videoView.start();  
    }  
}  
  
  
  
4、WebView 的 Demo  
webview.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="fill_parent">  
  
    <!--  
        WebView - 浏览器控件（WebKit 内核）  
    -->  
    <WebView android:layout_width="fill_parent"  
        android:layout_height="wrap_content" android:id="@+id/webView" />  
          
</LinearLayout>  
  
  
_WebView.java  
  
代码   
package com.webabcd.view;  
  
import android.app.Activity;  
import android.os.Bundle;  
import android.webkit.WebSettings;  
import android.webkit.WebView;  
  
public class _WebView extends Activity {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
        this.setContentView(R.layout.webview);  
  
        setTitle("WebView");  
          
        WebView webView = (WebView) findViewById(R.id.webView);  
  
        // 配置浏览器，使其可支持 JavaScript  
        WebSettings webSettings = webView.getSettings();  
        webSettings.setJavaScriptEnabled(true);  
          
        // 清除浏览器缓存  
        webView.clearCache(true);  
        // 指定浏览器需要解析的 url 地址  
        webView.loadUrl("http://webabcd.cnblogs.com/");  
        // 指定浏览器需要解析的 html 数据  
        // webView.loadData("<a href='http://webabcd.cnblogs.com/'>webabcd</a>", "text/html", "utf-8");  
    }  
}  
  
  
  
5、RatingBar 的 Demo  
ratingbar.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="fill_parent">  
  
    <!--  
        RatingBar - 评分控件  
            numStars - 评分控件的星星的数量  
            rating - 当前评分的值      
    -->  
    <RatingBar android:id="@+id/ratingBar" android:numStars="5"  
        android:rating="1.5" android:layout_width="wrap_content"  
        android:layout_height="wrap_content">  
    </RatingBar>  
  
    <TextView android:id="@+id/textView" android:layout_width="wrap_content"  
        android:layout_height="wrap_content" />  
  
</LinearLayout>  
  
  
_RatingBar.java  
  
代码   
package com.webabcd.view;  
  
import android.app.Activity;  
import android.os.Bundle;  
import android.widget.RatingBar;  
import android.widget.TextView;  
  
public class _RatingBar extends Activity implements RatingBar.OnRatingBarChangeListener {  
  
    private RatingBar mRatingBar;  
    private TextView mTextView;  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
        this.setContentView(R.layout.ratingbar);  
  
        setTitle("RatingBar");  
  
        mTextView = (TextView) findViewById(R.id.textView);  
        mRatingBar = (RatingBar) findViewById(R.id.ratingBar);  
  
        // setOnRatingBarChangeListener() - 响应评分值发生改变的事件  
        mRatingBar.setOnRatingBarChangeListener(this);  
    }  
  
    @Override  
    public void onRatingChanged(RatingBar ratingBar, float rating,  
            boolean fromUser) {  
        mTextView.setText(String.valueOf(rating));  
    }  
}  
  
  
  
6、Tab 的 Demo  
tab.xml  
  
代码   
<?xml version="1.0" encoding="utf-8"?>  
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="fill_parent" android:layout_height="fill_parent">  
  
    <!-- Tab 1 的内容　-->  
    <TextView android:id="@+id/view1" android:layout_width="fill_parent"  
        android:layout_height="fill_parent" android:text="tab1 content" />  
          
    <!-- Tab 2 的内容 -->  
    <TextView android:id="@+id/view2" android:layout_width="fill_parent"  
        android:layout_height="fill_parent" android:text="tab2 content" />  
  
</FrameLayout>  
  
  
_Tab.java  
  
代码   
package com.webabcd.view;  
  
import android.app.TabActivity;  
import android.content.Intent;  
import android.os.Bundle;  
import android.view.LayoutInflater;  
import android.widget.TabHost;  
  
// 实现 Tab 功能的话要继承 TabActivity  
public class _Tab extends TabActivity {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
  
        TabHost tabHost = getTabHost();  
        LayoutInflater.from(this).inflate(R.layout.tab, tabHost.getTabContentView(), true);  
  
        // Tab 1 的内容  
        tabHost.addTab(tabHost.newTabSpec("tab1")  
                .setIndicator("tab1")  
                .setContent(R.id.view1));  
          
        // Tab 2 的内容（设置了 Tab 图片）  
        tabHost.addTab(tabHost.newTabSpec("tab2")  
                .setIndicator("tab2", getResources().getDrawable(R.drawable.icon01))  
                .setContent(R.id.view2));  
          
        // Tab 3 的内容（设置 Tab 的内容为指定的 Activity）  
        tabHost.addTab(tabHost.newTabSpec("tab3")  
                .setIndicator("tab3")  
                .setContent(new Intent(this, _TextView.class)));  
  
    }  
}  
  
  
  
7、Spinner 的 Demo  
spinner.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="fill_parent">  
  
    <TextView android:layout_width="fill_parent"  
        android:layout_height="wrap_content" android:id="@+id/textView" />  
  
    <!--  
        Spinner - 下拉框控件  
    -->          
    <Spinner android:id="@+id/spinner" android:layout_width="fill_parent"  
        android:layout_height="wrap_content" />  
  
</LinearLayout>  
  
  
_Spinner.java  
  
代码   
package com.webabcd.view;  
  
import android.app.Activity;  
import android.os.Bundle;  
import android.view.View;  
import android.widget.AdapterView;  
import android.widget.ArrayAdapter;  
import android.widget.Spinner;  
import android.widget.TextView;  
  
public class _Spinner extends Activity {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
        this.setContentView(R.layout.spinner);  
  
        setTitle("Spinner");  
  
        Spinner spinner = (Spinner) findViewById(R.id.spinner);  
          
        // 设置下拉框控件的标题文本  
        spinner.setPrompt("请选择");  
        // 实例化适配器，指定显示格式及数据源  
        ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(  
                this, R.array.colors, android.R.layout.simple_spinner_item);  
        adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);  
        spinner.setAdapter(adapter);  
  
        // setOnItemSelectedListener() - 响应下拉框的选中值发生变化的事件  
        spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {  
            @Override  
            public void onItemSelected(AdapterView<?> arg0, View arg1,  
                    int arg2, long arg3) {  
                TextView textView = (TextView)_Spinner.this.findViewById(R.id.textView);  
                textView.setText(((TextView)arg1).getText());  
            }  
  
            @Override  
            public void onNothingSelected(AdapterView<?> arg0) {  
                                  
            }  
        });  
    }  
}  
  
  
  
8、Chronometer 的 Demo  
chronometer.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="fill_parent">  
  
    <!--  
        Chronometer - 计时器控件  
    -->  
    <Chronometer android:id="@+id/chronometer"  
        android:layout_width="wrap_content" android:layout_height="wrap_content" />  
  
    <Button android:id="@+id/btnStart" android:layout_width="wrap_content"  
        android:layout_height="wrap_content" android:text="开始计时">  
        <requestFocus />  
    </Button>  
  
    <Button android:id="@+id/btnStop" android:layout_width="wrap_content"  
        android:layout_height="wrap_content" android:text="停止计时">  
    </Button>  
  
    <Button android:id="@+id/btnReset" android:layout_width="wrap_content"  
        android:layout_height="wrap_content" android:text="计时器复位">  
    </Button>  
  
</LinearLayout>  
  
  
_Chronometer.java  
  
代码   
package com.webabcd.view;  
  
import android.app.Activity;  
import android.os.Bundle;  
import android.os.SystemClock;  
import android.view.View;  
import android.view.View.OnClickListener;  
import android.widget.Button;  
import android.widget.Chronometer;  
  
public class _Chronometer extends Activity {  
  
    private Chronometer mChronometer;  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
        this.setContentView(R.layout.chronometer);  
  
        setTitle("Chronometer");  
  
        Button button;  
  
        mChronometer = (Chronometer) findViewById(R.id.chronometer);  
        // 设置计时器所显示的时间格式  
        mChronometer.setFormat("计时：(%s)");  
          
        button = (Button) findViewById(R.id.btnStart);  
        button.setOnClickListener(mStartListener);  
  
        button = (Button) findViewById(R.id.btnStop);  
        button.setOnClickListener(mStopListener);  
  
        button = (Button) findViewById(R.id.btnReset);  
        button.setOnClickListener(mResetListener);  
    }  
  
    View.OnClickListener mStartListener = new OnClickListener() {  
        public void onClick(View v) {  
            // 启动计时器  
            mChronometer.start();  
        }  
    };  
  
    View.OnClickListener mStopListener = new OnClickListener() {  
        public void onClick(View v) {  
            // 暂停计时器  
            mChronometer.stop();  
        }  
    };  
  
    View.OnClickListener mResetListener = new OnClickListener() {  
        public void onClick(View v) {  
            // 复位计时器，即停止计时器  
            mChronometer.setBase(SystemClock.elapsedRealtime());  
        }  
    };  
}  
  
  
  
9、ScrollView 的 Demo   
scrollview.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="fill_parent">  
  
    <!--  
        ScrollView - 滚动条控件  
            scrollbarStyle - 滚动条的样式  
    -->  
    <ScrollView android:id="@+id/scrollView"  
        android:layout_width="fill_parent" android:layout_height="200px"  
        android:scrollbarStyle="outsideOverlay" android:background="@android:drawable/edit_text">  
        <TextView android:layout_width="fill_parent"  
            android:layout_height="wrap_content" android:id="@+id/textView" />  
    </ScrollView>  
  
</LinearLayout>  
  
  
_ScrollView.java  
  
代码   
package com.webabcd.view;  
  
import android.app.Activity;  
import android.os.Bundle;  
import android.widget.TextView;  
  
public class _ScrollView extends Activity {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        // TODO Auto-generated method stub  
        super.onCreate(savedInstanceState);  
        this.setContentView(R.layout.scrollview);  
  
        setTitle("ScrollView");  
  
        TextView textView = (TextView)this.findViewById(R.id.textView);  
        textView.setText("a\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na");  
    }  
}