Android - 基本コントロール (パート 2) (18)

1. クロックコンポーネント: AnalogClock および DigitalClock

1.1 知識ポイント

(1) AnalogClock と DigitalClock の使い方をマスターします。

1.2 具体内容

package com.example.clockproject;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

public class ClockActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_clock);
	}

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

}

 クロックコンポーネントには複雑な動作はありませんが、後でスレッドの動作を説明するときにこの種のコンポーネントを使用します。

1.3 概要

(1) AnalogClock はアナログ時計を表示できます。

(2) DigitalClock はデジタル時計を表示できます。

2.タイマー：クロノメーター

2.1 知識ポイント

(1) クロノメーター コンポーネントの使用と操作をマスターする。

(2) 振動サービスは携帯電話の開発に使用できます。

2.2 具体内容

 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context=".ChronometerActivity" >

    <Chronometer
        android:id="@+id/myChronometer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        >
        <Button 
            android:id="@+id/butStart"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="开始计时"
            />
        <Button 
            android:id="@+id/butStop"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="停止计时"
            />
        <Button 
            android:id="@+id/butReset"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="复位"
            />
        <Button 
            android:id="@+id/butFormat"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="格式化显示"
            />
        
        
    </LinearLayout>

</LinearLayout>

 

package com.example.chronometerproject;

import android.app.Activity;
import android.os.Bundle;
import android.os.SystemClock;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.Chronometer;

public class ChronometerActivity extends Activity {
    Button butStart,butStop,butReset,butFormat = null;
    Chronometer  myChronometer = null;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_chronometer);
		butStart = (Button) super.findViewById(R.id.butStart);
		butStop = (Button) super.findViewById(R.id.butStop);
		butReset = (Button) super.findViewById(R.id.butReset);
		butFormat = (Button) super.findViewById(R.id.butFormat);
		myChronometer = (Chronometer) super.findViewById(R.id.myChronometer);
		butStart.setOnClickListener(new OnClickListenerImpl());
		butStop.setOnClickListener(new OnClickListenerImpl());
		butReset.setOnClickListener(new OnClickListenerImpl());
		butFormat.setOnClickListener(new OnClickListenerImpl());
	}

	private class OnClickListenerImpl implements OnClickListener{

		@Override
		public void onClick(View v) {
			switch(v.getId()){
			  case R.id.butStart:
				  ChronometerActivity.this.myChronometer.start();
				  break;
			  case R.id.butStop:
				  ChronometerActivity.this.myChronometer.stop();
				  break;
			  case R.id.butReset:
				  ChronometerActivity.this.myChronometer.setBase(SystemClock.elapsedRealtime());//设置基准时间
			      break;
			  case R.id.butFormat:
				  ChronometerActivity.this.myChronometer.setFormat("新的格式：%s");//格式化
			}
			
		  }
		}

}

タイマーの機能は複雑ではありませんが、いくつかのシステム サービスと組み合わせて興味深い操作を実現できます。

振動は実機でテストする必要があります。

package com.example.chronometerproject;

import android.app.Activity;
import android.app.Service;
import android.os.Bundle;
import android.os.SystemClock;
import android.os.Vibrator;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.Chronometer;
import android.widget.Chronometer.OnChronometerTickListener;

public class ChronometerActivity extends Activity {
    Button butStart,butStop,butReset,butFormat = null;
    Chronometer  myChronometer = null;
    Vibrator vb = null;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_chronometer);
		butStart = (Button) super.findViewById(R.id.butStart);
		butStop = (Button) super.findViewById(R.id.butStop);
		butReset = (Button) super.findViewById(R.id.butReset);
		butFormat = (Button) super.findViewById(R.id.butFormat);
		myChronometer = (Chronometer) super.findViewById(R.id.myChronometer);
		butStart.setOnClickListener(new OnClickListenerImpl());
		butStop.setOnClickListener(new OnClickListenerImpl());
		butReset.setOnClickListener(new OnClickListenerImpl());
		butFormat.setOnClickListener(new OnClickListenerImpl());
		myChronometer.setOnChronometerTickListener(new OnChronometerTickListener() {
			
			@Override
			public void onChronometerTick(Chronometer chronometer) {
                      String time = chronometer.getText().toString();
                      if("0:30".equals(time)){
                    	  ChronometerActivity.this.vb.vibrate(new long[]{1000,10,1000,100}, 0);//设置震动周期震动的形式
                      }
			}
		});
		
		vb = (Vibrator) super.getApplication().getSystemService(Service.VIBRATOR_SERVICE);
	}

	private class OnClickListenerImpl implements OnClickListener{

		@Override
		public void onClick(View v) {
			switch(v.getId()){
			  case R.id.butStart:
				  ChronometerActivity.this.myChronometer.start();
				  break;
			  case R.id.butStop:
				  ChronometerActivity.this.myChronometer.stop();
				  ChronometerActivity.this.vb.cancel();
				  break;
			  case R.id.butReset:
				  ChronometerActivity.this.myChronometer.setBase(SystemClock.elapsedRealtime());//设置基准时间
			      break;
			  case R.id.butFormat:
				  ChronometerActivity.this.myChronometer.setFormat("新的格式：%s");//格式化
			}
			
		  }
		}
     
}

 電話機はシステムにサービスを提供するために振動し、許可が必要です。

<uses-permission 
        android:name="android.permission.VIBRATE"
        />

2.3 概要

(1) クロノメーターはタイマーの動作を完了できます。

(2) 携帯電話が振動動作を完了したい場合は、「Service.VIBRATOR_SERVICE」サービスを使用できます。

3. タグ: タブホスト

3.1 知識ポイント

(1) ラベル コンポーネントの使用法をマスターし、ラベル コンポーネントを使用してプログラム インターフェイスをセグメント化できるようになります。

(2) ラベル コンポーネントの表示は、設定ファイルを通じて完了できます。

(3) ラベル部品の表示をプログラムで完結できます。

3.2 具体内容

タブを使用すると、特定の画面スペースにさらに多くのコンテンツを表示できます。このようなインターフェイスでは、複数のタブがあり、複数のタブで TabHost が形成されます。

 

 

まずは最初の方法で完成させ、操作形態に注目してみましょう。

 

 TabActivity が成功する理由は、このアクティビティがタブの作成を完了できる 2 つの重要なメソッドを提供しているためです。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context=".TabHostActivity" >

    <LinearLayout 
        android:id="@+id/tab_edit"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        >
        <EditText 
            android:id="@+id/edt"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="input here..."
            />
        <Button 
            android:id="@+id/but"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Serach"
            />
    </LinearLayout>
    <LinearLayout 
        android:id="@+id/tab_clock"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        >
        <AnalogClock 
            android:id="@+id/clock"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            />
    </LinearLayout>
    <LinearLayout 
        android:id="@+id/tab_sex"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        >
        <RadioGroup 
            android:id="@+id/sex"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:checkedButton="@+id/woman"
            >
            <RadioButton 
                android:id="@+id/man"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="MAN"
                />
             <RadioButton 
                android:id="@+id/woman"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="WOMAN"
                />
        </RadioGroup>
    </LinearLayout>
</LinearLayout>

package com.example.tabhostproject;

import android.app.TabActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.widget.TabHost;

public class TabHostActivity extends TabActivity {
    TabHost tabHost = null;
    int layRes[]={R.id.tab_edit,R.id.tab_clock,R.id.tab_sex};
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		this.tabHost = super.getTabHost();
        LayoutInflater.from(this).inflate(R.layout.activity_tab_host, //定义要转换的布局管理局
        		this.tabHost.getTabContentView(),//指定标签添加的容器
        		true);//实例化布局管理器中的组件
        for(int i = 0;i<layRes.length;i++){
        	TabHost.TabSpec myTab = this.tabHost.newTabSpec("tab"+i);
        	myTab.setIndicator("标签"+i);//标签文字
        	myTab.setContent(layRes[i]);
        	this.tabHost.addTab(myTab);//添加标签
        }
	}

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

}

上記のコードは、TabActivity との直接統合を使用してタブ ページ効果を実現しています。Activity を継承し、タブ ページも実装できる場合は、2 番目の形式が必要です。

 

 

package com.example.tabhostproject;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TabHost;

public class TabHostActivity extends Activity {
    TabHost tabHost = null;
    int layRes[]={R.id.tab_edit,R.id.tab_clock,R.id.tab_sex};
	@Override
	protected void onCreate(Bundle savedInstanceState) {
	      super.onCreate(savedInstanceState);
	      super.setContentView(R.layout.tab_host_widget);
	      tabHost = (TabHost) super.findViewById(R.id.tabhost);
	      this.tabHost.setup();//创建TabHost对象
	      for(int i=0;i<layRes.length;i++){
	    	  TabHost.TabSpec myTab = this.tabHost.newTabSpec("tab"+i);
	    	  myTab.setIndicator("标签"+(i+1));//设置标签文字
	    	  myTab.setContent(layRes[i]);
	    	  this.tabHost.addTab(myTab);
	      }
	      this.tabHost.setCurrentTab(0);//设置开始索引
	}
}

 

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

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

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                <LinearLayout
                    android:id="@+id/tab_edit"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical" >

                    <EditText
                        android:id="@+id/edt"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="input here..." />

                    <Button
                        android:id="@+id/but"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="Serach" />
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab_clock"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical" >

                    <AnalogClock
                        android:id="@+id/clock"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content" />
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab_sex"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical" >

                    <RadioGroup
                        android:id="@+id/sex"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:checkedButton="@+id/woman"
                        android:orientation="vertical" >

                        <RadioButton
                            android:id="@+id/man"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:text="MAN" />

                        <RadioButton
                            android:id="@+id/woman"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:text="WOMAN" />
                    </RadioGroup>
                </LinearLayout>
            </FrameLayout>
    </LinearLayout>

</TabHost>

最初の方法と同じ表示効果が得られたので、ラベルを画面の下部に配置したいので、変更する必要があるのは 2 か所だけです。

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

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" 
            android:layout_alignParentBottom="true"
            />
            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                <LinearLayout
                    android:id="@+id/tab_edit"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical" >

                    <EditText
                        android:id="@+id/edt"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="input here..." />

                    <Button
                        android:id="@+id/but"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="Serach" />
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab_clock"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical" >

                    <AnalogClock
                        android:id="@+id/clock"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content" />
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab_sex"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical" >

                    <RadioGroup
                        android:id="@+id/sex"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:checkedButton="@+id/woman"
                        android:orientation="vertical" >

                        <RadioButton
                            android:id="@+id/man"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:text="MAN" />

                        <RadioButton
                            android:id="@+id/woman"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:text="WOMAN" />
                    </RadioGroup>
                </LinearLayout>
            </FrameLayout>
    </RelativeLayout>

</TabHost>

3.3 概要

(1) プログラムを列に表示するには、Tab タグを使用します。

(2) タブは、TabActivity クラスを継承するか、設定を通じて実装できます。

(3) 設定によってタブを実装するのはさらに面倒です。