系出名门Android(5) - 控件(View)之TextView, Button, ImageButton, ImageView, CheckBox, RadioButton, AnalogClock, DigitalClock

[索引页]
[源码下载]

系出名门Android(5) - 控件(View)之TextView, Button, ImageButton, ImageView, CheckBox, RadioButton, AnalogClock, DigitalClock

作者： webabcd


介绍
在 Android 中使用各种控件(View)

• TextView - 文本显示控件
• Button - 按钮控件
• ImageButton - 图片按钮控件
• ImageView - 图片显示控件
• CheckBox - 复选框控件
• RadioButton - 单选框控件
• AnalogClock - 钟表（带表盘的那种）控件
• DigitalClock - 电子表控件

1、TextView 的 Demo
textview.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 - 文本显示控件
     -->
     < TextView  android:layout_width ="fill_parent"
        android:layout_height ="wrap_content"  android:id ="@+id/textView"   />
        
</ LinearLayout >

_TextView.java

代码

package  com.webabcd.view;

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

public   class  _TextView  extends  Activity {

    @Override
     protected   void  onCreate(Bundle savedInstanceState) {
         //  TODO Auto-generated method stub
         super .onCreate(savedInstanceState);
         this .setContentView(R.layout.textview);

         //  设置 Activity 的标题
        setTitle( " TextView " );
        
        TextView txt  =  (TextView)  this .findViewById(R.id.textView);
         //  设置文本显示控件的文本内容，需要换行的话就用“\n”
        txt.setText( " 我是 TextView\n显示文字用的 " );
    }
}

2、Button 的 Demo
button.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"   />
    
      <!--
         Button - 按钮控件
      -->     
     < Button  android:id ="@+id/button"
        android:layout_width ="wrap_content"  android:layout_height ="wrap_content" >
     </ Button >
    
</ LinearLayout >

_Button.java

代码

package  com.webabcd.view;

import  android.app.Activity;
import  android.os.Bundle;
import  android.view.View;
import  android.widget.Button;
import  android.widget.TextView;

public   class  _Button  extends  Activity {

    @Override
     protected   void  onCreate(Bundle savedInstanceState) {
         //  TODO Auto-generated method stub
         super .onCreate(savedInstanceState);
         this .setContentView(R.layout.button);

        setTitle( " Button " );
        
        Button btn  =  (Button)  this .findViewById(R.id.button);
        btn.setText( " click me " );
        
         //  setOnClickListener() - 响应按钮的鼠标单击事件
        btn.setOnClickListener( new  Button.OnClickListener(){
            @Override
             public   void  onClick(View v) {
                TextView txt  =  (TextView) _Button. this .findViewById(R.id.textView);
                txt.setText( " 按钮被单击了 " );
            }
        });
    }
}

3、ImageButton 的 Demo
imagebutton.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"   />
    
     <!--
        ImageButton - 图片按钮控件
     -->     
     < ImageButton  android:id ="@+id/imageButton"
        android:layout_width ="wrap_content"  android:layout_height ="wrap_content" >
     </ ImageButton >
    
</ LinearLayout >

_ImageButton.java

代码

package  com.webabcd.view;

import  android.app.Activity;
import  android.os.Bundle;
import  android.view.View;
import  android.widget.Button;
import  android.widget.ImageButton;
import  android.widget.TextView;

public   class  _ImageButton  extends  Activity {

    @Override
     protected   void  onCreate(Bundle savedInstanceState) {
         //  TODO Auto-generated method stub
         super .onCreate(savedInstanceState);
         this .setContentView(R.layout.imagebutton);

        setTitle( " ImageButton " );
        
        ImageButton imgButton  =  (ImageButton)  this .findViewById(R.id.imageButton);
         //  设置图片按钮的背景
        imgButton.setBackgroundResource(R.drawable.icon01);
        
         //  setOnClickListener() - 响应图片按钮的鼠标单击事件
        imgButton.setOnClickListener( new  Button.OnClickListener(){
            @Override
             public   void  onClick(View v) {
                TextView txt  =  (TextView) _ImageButton. this .findViewById(R.id.textView);
                txt.setText( " 图片按钮被单击了 " );
            }
        });
    }
}

4、ImageView 的 Demo
imageview.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" >
    
     <!--
        ImageView - 图片显示控件
     -->
     < ImageView  android:id ="@+id/imageView"  android:layout_width ="wrap_content"
        android:layout_height ="wrap_content" ></ ImageView >
        
</ LinearLayout >

_ImageView.java

代码

package  com.webabcd.view;

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

public   class  _ImageView  extends  Activity {

    @Override
     protected   void  onCreate(Bundle savedInstanceState) {
         //  TODO Auto-generated method stub
         super .onCreate(savedInstanceState);
         this .setContentView(R.layout.imageview);

        setTitle( " ImageView " );
        
        ImageView imgView  =  (ImageView)  this .findViewById(R.id.imageView);
         //  指定需要显示的图片
        imgView.setBackgroundResource(R.drawable.icon01);
    }
}

5、CheckBox 的 Demo
checkbox.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"   />
        
     <!--
        CheckBox - 复选框控件
     -->
     < CheckBox  android:text ="CheckBox01"  android:id ="@+id/chk1"
        android:layout_width ="wrap_content"  android:layout_height ="wrap_content" ></ CheckBox >
     < CheckBox  android:text ="CheckBox02"  android:id ="@+id/chk2"
        android:layout_width ="wrap_content"  android:layout_height ="wrap_content" ></ CheckBox >
     < CheckBox  android:text ="CheckBox03"  android:id ="@+id/chk3"
        android:layout_width ="wrap_content"  android:layout_height ="wrap_content" ></ CheckBox >
        
</ LinearLayout >

_CheckBox.java

代码

package  com.webabcd.view;

import  android.app.Activity;
import  android.os.Bundle;
import  android.widget.CheckBox;
import  android.widget.CompoundButton;
import  android.widget.TextView;

public   class  _CheckBox  extends  Activity {

    @Override
     protected   void  onCreate(Bundle savedInstanceState) {
         //  TODO Auto-generated method stub
         super .onCreate(savedInstanceState);
         this .setContentView(R.layout.checkbox);

        setTitle( " CheckBox " );
        
        CheckBox chk  =  (CheckBox)  this .findViewById(R.id.chk1);
         //  setOnCheckedChangeListener() - 响应复选框的选中状态改变事件
        chk.setOnCheckedChangeListener( new  CompoundButton.OnCheckedChangeListener() {
            @Override
             public   void  onCheckedChanged(CompoundButton buttonView,  boolean  isChecked) {
                TextView txt  =  (TextView) _CheckBox. this .findViewById(R.id.textView);
                txt.setText( " CheckBox01 的选中状态： "   +  String.valueOf(isChecked));                
            }
        });
    }
}

6、RadioButton 的 Demo
radiobutton.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"   />
        
     <!--
        RadioButton - 单选框控件
        RadioGroup - 对其内的单选框控件做分组
            checkedButton - 指定组内被选中的单选框的 ID
     -->
     < RadioGroup  android:id ="@+id/radioGroup"
        android:layout_width ="fill_parent"  android:layout_height ="fill_parent"
        android:checkedButton ="@+id/rad3"  android:orientation ="horizontal"
        android:gravity ="center_vertical|center_horizontal" >
         < RadioButton  android:text ="rad1"  android:id ="@+id/rad1"
            android:layout_width ="wrap_content"  android:layout_height ="wrap_content" ></ RadioButton >
         < RadioButton  android:text ="rad2"  android:id ="@+id/rad2"
            android:layout_width ="wrap_content"  android:layout_height ="wrap_content" ></ RadioButton >
         < RadioButton  android:text ="rad3"  android:id ="@+id/rad3"
            android:layout_width ="wrap_content"  android:layout_height ="wrap_content" ></ RadioButton >
     </ RadioGroup >
    
</ LinearLayout >

_RadioButton.java

代码

package  com.webabcd.view;

import  android.app.Activity;
import  android.os.Bundle;
import  android.widget.RadioButton;
import  android.widget.RadioGroup;
import  android.widget.TextView;

public   class  _RadioButton  extends  Activity {

    @Override
     protected   void  onCreate(Bundle savedInstanceState) {
         //  TODO Auto-generated method stub
         super .onCreate(savedInstanceState);
         this .setContentView(R.layout.radiobutton);

        setTitle( " RadioButton " );
        
        RadioGroup group  =  (RadioGroup)  this .findViewById(R.id.radioGroup);
         //  setOnCheckedChangeListener() - 响应单选框组内的选中项发生变化时的事件
        group.setOnCheckedChangeListener( new  RadioGroup.OnCheckedChangeListener() {    
            @Override
             public   void  onCheckedChanged(RadioGroup group,  int  checkedId) {
                TextView txt  =  (TextView) _RadioButton. this .findViewById(R.id.textView);
                txt.setText(((RadioButton)findViewById(checkedId)).getText()  +   "  被选中 " );                    
            }
        }); 
    }
}

7、AnalogClock 的 Demo
analogclock.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" >
    
     <!--
        AnalogClock - 钟表（带表盘的那种）控件
     -->
     < AnalogClock  android:id ="@+id/analogClock"
        android:layout_width ="wrap_content"  android:layout_height ="wrap_content" >
     </ AnalogClock >
    
</ LinearLayout >

_AnalogClock.java

代码

package  com.webabcd.view;

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

public   class  _AnalogClock  extends  Activity {

    @Override
     protected   void  onCreate(Bundle savedInstanceState) {
         //  TODO Auto-generated method stub
         super .onCreate(savedInstanceState);
         this .setContentView(R.layout.analogclcok);

        setTitle( " AnalogClock " );
    }
}

8、DigitalClock 的 Demo
digitalclock.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" >
    
     <!--
        DigitalClock - 电子表控件
     -->
     < DigitalClock  android:id ="@+id/digitalClock"
        android:layout_width ="wrap_content"  android:layout_height ="wrap_content" >
     </ DigitalClock >
    
</ LinearLayout >

_DigitalClock.java

代码

package  com.webabcd.view;

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

public   class  _DigitalClock  extends  Activity {

    @Override
     protected   void  onCreate(Bundle savedInstanceState) {
         //  TODO Auto-generated method stub
         super .onCreate(savedInstanceState);
         this .setContentView(R.layout.digitalclcok);

        setTitle( " DigitalClcok " );
    }
}

OK
[源码下载]