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