【Android】标签页、计时器、单选按钮、复选按钮

写一个小程序把安卓程序中的几个基础组件的基本用法串联起来。

如下图所示：

在安卓程序中，一个计时器，一直在不断地计时，每10秒弹出一个提示。

MainActivity被一个标签页分成两部分，一部分，有单选按钮与复选按钮，最后有一个提交按钮，

结果在另一个标签页中显示。

用这个程序来说明安卓中标签页、计时器、单选按钮、复选按钮的用法。

首先贴上res\values\string.xml中，各个组件的字符串。

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

    <string name="app_name">标签页与基本组件</string>
    <string name="action_settings">Settings</string>
    <string name="tab1_RadioGroup1_RadioButton1">单选选项1</string>
    <string name="tab1_RadioGroup1_RadioButton2">单选选项2</string>
    <string name="tab1_CheckBox1">复选选项1</string>
    <string name="tab1_CheckBox2">复选选项2</string>
    <string name="tab1_Button1">提交</string>
    <string name="tab2_TextView1">标签页2</string>

</resources>

整个程序的组件，已经基本可以略窥一二了，

标签页的的标题“组件”、“结果”一会儿通过Java中设置。

同时，在没有按“组件”标签页的“提交”按钮之前，在“结果”标签页的标签文本TextView默认是为“标签2”。

1、首先在res\layout文件夹中新建两个xml，一个为tab1.xml，一个为tab2.xml如下图所示：

如果你在一个Activity中决定使用标签页，那你这个Activity中基本布局文件，这里MainActivity默认是activity_main.xml是定死了，必须这样写：

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            />

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" />

    </LinearLayout>

</TabHost>

这里大家可以明显注意到，这里设置ID的方式，与平时我们自己定义安卓组件的情况不同，这里设置Id不为android:id="@+id/xx"中间没有加号。这是因为这个标签页组件是系统中一个固定的常量，tabhost、tabs这些id，不得自己改名，相当于关键字。

2、之后是对"组件"标签页的布局tab1.xml的书写。

这里很简单，通过一个基本线性布局，各个组件垂直排列下来，在"组件"标签页中放着一个计时器、单选按钮组、复选按钮x2，一个按钮，并且对要被Java控制的组件赋予id。

同时非常重要的一点是，要为总的线性布局赋予id，一会儿要在MainActivity.java声明，标签1加载这个布局。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <!-- 计时器 -->

    <Chronometer
        android:id="@+id/chronometer1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="24sp" />
    <!--
	单选按钮组
	需要注意的是：
	单选按钮组如果要被控制
	必须对单选按钮组、各个单选按钮都赋予相应的id，
	否则程序会出错
    -->

    <RadioGroup
        android:id="@+id/tab1_RadioGroup1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <RadioButton
            android:id="@+id/tab1_RadioGroup1_RadioButton1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"
            android:text="@string/tab1_RadioGroup1_RadioButton1"
            android:textSize="24sp" />

        <RadioButton
            android:id="@+id/tab1_RadioGroup1_RadioButton2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/tab1_RadioGroup1_RadioButton2"
            android:textSize="24sp" />
    </RadioGroup>
    <!-- 复选框x2 -->

    <CheckBox
        android:id="@+id/tab1_CheckBox1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/tab1_CheckBox1"
        android:textSize="24sp" />

    <CheckBox
        android:id="@+id/tab1_CheckBox2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/tab1_CheckBox2"
        android:textSize="24sp" />
    <!-- 按钮 -->

    <Button
        android:id="@+id/tab1_Button1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/tab1_Button1"
        android:textSize="24sp" />

</LinearLayout>

3、最后是对"结果"标签页的布局tab2.xml的书写。这里非常简单，放置一个带id的标签文本TextView就OK了。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout2"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/tab2_TextView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/tab2_TextView1"
        android:textSize="24sp" />

</LinearLayout>

4、布局完毕，开始对MainActivity.java这个文件进行书写。虽然用了标签页布局，但这个java文件能够一次性地控制多个标签页中的各个组件。

程序中的OnCreate方法分为三个部分，一个是标签页的初始化、一个是计时器的初始化、一个是按钮单击事件。没有什么特别的。

package com.tabComponent;

import android.os.Bundle;
import android.app.Activity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.Chronometer;
import android.widget.Chronometer.OnChronometerTickListener;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TabHost;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {
	// 声明要控制的组件
	private TabHost tabHost;
	private Chronometer chronometer;
	private RadioGroup tab1_RadioGroup1;
	private CheckBox tab1_CheckBox1;
	private CheckBox tab1_CheckBox2;
	private Button tab1_Button1;
	private TextView tab2_TextView1;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		// 标签页初始化开始
		tabHost = (TabHost) findViewById(android.R.id.tabhost);
		tabHost.setup();
		LayoutInflater layoutInflater = LayoutInflater.from(this);
		layoutInflater.inflate(R.layout.tab1, tabHost.getTabContentView());
		layoutInflater.inflate(R.layout.tab2, tabHost.getTabContentView());
		tabHost.addTab(tabHost.newTabSpec("").setIndicator("组件")
				.setContent(R.id.LinearLayout1));// 设置标签1的标题为“组件”，且布局为LinearLayout1，下同理
		tabHost.addTab(tabHost.newTabSpec("").setIndicator("结果")
				.setContent(R.id.LinearLayout2));
		// 标签页初始化结束
		// 计时器初始化开始
		chronometer = (Chronometer) findViewById(R.id.chronometer1);
		chronometer.setFormat("程序已经运行了:%s");// %s就是那个不断跳跃的时间，其格式为00:00，精确到秒
		chronometer.start();// 开始计时，默认不开始
		chronometer// 计时器监听事件，计时器每改变一次触发一次，这里是每1秒触发一次
				.setOnChronometerTickListener(new OnChronometerTickListener() {
					int i = 0;

					// 这个i，自从程序运行之后，每秒都在自增
					public void onChronometerTick(Chronometer chronometer) {
						i++;
						if (i % 10 == 0) {// 每10秒，弹出一个Toast提示一下
							Toast.makeText(MainActivity.this,
									"程序已启动了" + i + "秒", Toast.LENGTH_LONG)
									.show();
						}
					}
				});
		// 计时器结束
		// 按钮1点击事件开始
		tab1_Button1 = (Button) findViewById(R.id.tab1_Button1);
		tab1_Button1.setOnClickListener(new OnClickListener() {// 为button1添加点击事件
					@Override
					public void onClick(View v) {
						String str = "";
						// 获取单选按钮组的值
						tab1_RadioGroup1 = (RadioGroup) findViewById(R.id.tab1_RadioGroup1);
						for (int i = 0; i < tab1_RadioGroup1.getChildCount(); i++) {
							RadioButton radioButton = (RadioButton) tab1_RadioGroup1
									.getChildAt(i);
							if (radioButton.isChecked()) {
								str += radioButton.getText() + "被选中，";
								break;
							}
						}
						// 获取各个复选框是否被选中
						tab1_CheckBox1 = (CheckBox) findViewById(R.id.tab1_CheckBox1);
						if (tab1_CheckBox1.isChecked()) {
							str += tab1_CheckBox1.getText() + "被选中，";
						}
						tab1_CheckBox2 = (CheckBox) findViewById(R.id.tab1_CheckBox2);
						if (tab1_CheckBox2.isChecked()) {
							str += tab1_CheckBox2.getText() + "被选中，";
						}
						tab2_TextView1 = (TextView) findViewById(R.id.tab2_TextView1);
						tab2_TextView1.setText(str);
					}
				});
		// 按钮1点击事件结束
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}

至此，整个安卓程序写完。