Android控件(View)之TextView, Button, ImageButton, ImageView, CheckBox 简单介绍

时间:2021-10-03 09:50:54

 

介绍

  在 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);

  // 设置文本显示控件的文本内容,需要换行的话就用“ ”

  txt.setText("我是 TextView 显示文字用的");

  }

  }

  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");

  }

  }