本章将介绍一下内容,均为XML设置UI:
- 文本框
- 编辑框
- 普通按钮&图片按钮
- 单选按钮
- 复选框
文本框TextView
支持的XML属性
属性 | 作用 | 值 |
---|---|---|
android:autoLinkl | 将文本以指定的格式转变 | none、web、email、phone、map、all |
android:gravity | 设置文本框内的的文本对齐方式,多个属性值用竖线隔开 | top、bottom、left、right、center_vertical、fill_vertical、center_horizon、fill_horizon、center、fill、clip_vertical、clip_horizon |
android:hint | 当文本框无值时设置默认显示文本 | |
android:inputType | 指定文本框显示文本的内容 | textPassword、textEmailAddress、phone、data |
android:singleLine | 文本是否单行显示 | true、false |
android:text | 显示文本 | |
android:textColor | 文本显示颜色 | #rgb、#argb、#rrggbb、#aarrggbb |
android:textSize | 文本大小 | dp、px、pt、sp、in |
android:width | 文本框的宽 | dp、px、pt、sp、in |
android:height | 文本框的长度 | dp、px、pt、sp、in |
android:drawableTop | 文本框中图片在文本的上边 | @drawable/XXX |
android:drawableBottom | 文本框中图片在文本的下边 | @drawable/XXX |
android:drawableLeft | 文本框中图片在文本的左边 | @drawable/XXX |
android:drawableRight | 文本框中图片在文本的右边 | @drawable/XXX |
<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:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="123456789"
android:autoLink="phone"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="123456789@qq.com"
android:autoLink="email"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="www.baidu.com"
android:autoLink="web"
/>
<!--autoLink中的格式要与text中的内容相照应-->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="www.baidu.com"
android:autoLink="phone"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="显示文本信息"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="无内容时显示的信息"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="单行显示1234567890111111111111111111111111111"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="无单行显示属性1234567890111111111111111111111111111"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="颜色"
android:textColor="#0ff"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="大小"
android:textSize="55sp"
/>
<!--字体大小不会变,但标签所占的面积发生了变化-->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="宽"
android:width="88dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="高"
android:height="105dp"
/>
<TextView
android:layout_width="100dp"
android:layout_height="50dp"
android:text="权重右"
android:gravity="right"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="带图片且图片在上"
android:drawableTop="@drawable/ic_launcher"
/>
<!--密码类型-->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="123456789"
android:inputType="textPassword"
/>
</LinearLayout>
编辑框EditText
- EditText是TextView的子类,EditText支持TextView的所有属性
- 不同的是
android:inputType
是输入的类型 - java中获取编辑框内容的语句为:
EditText对象的getText().tostring();
即可 - 另外EditeText还有个属性,可以输入所指定的数字与字母
android:digits
例如只输入数字:android:digits="1234567890"
- Graphical Layout 图形布局中可以直接拖拽你想输入的类型
普通按钮&图片按钮
1.普通按钮Button
- android:onClick属性,可以创建点击事件 (不用实例化Button,且方法要在onCreate之外,多个Button可以用switch语句根据id的不同来区分)
<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:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button1"
android:onClick="btuClick"
/>
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button2"
android:onClick="btuClick"
/>
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button3"
android:onClick="btuClick"
/>
</LinearLayout>
package com.example.qq;
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
public void btuClick(View v){
switch(v.getId())
{
case R.id.button1:
Log.i("1111","这是id为button1的按钮");break;
case R.id.button2:
Log.i("1111","这是id为button2的按钮");break;
case R.id.button3:
Log.i("1111","这是id为button3的按钮");break;
}
}
}
- 匿名类创建点击事件 ,需要实例化Button对象
- 内部类创建点击事件,需要实例化Button对象
<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:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="匿名类"
/>
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="内部类"
/>
</LinearLayout>
package com.example.qq;
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button button1 = (Button)findViewById(R.id.button1);
Button button2 = (Button)findViewById(R.id.button2);
//匿名类
button1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View arg0) {
Log.i("1111","这是id为button1的按钮");
}
});
//内部类
Btn2 b = new Btn2();
button2.setOnClickListener(b);
}
private class Btn2 implements View.OnClickListener{
@Override
public void onClick(View arg0) {
Log.i("1111","这是id为button2的按钮");
}
}
}
2.图片按钮ImageButton
- 添加监听事件与普通按钮相同
android:src
属性设置按钮显示图片
<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:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher"
android:onClick="myClick"
/>
</LinearLayout>
package com.example.qq;
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
public void myClick(View v){
Log.i("11111","图片按钮");
}
}
单选按钮RadioGroup、RadioButton
- 默认某项被选中则在某个RadioButton后添加:
android:checked = "true"
- 去掉圆圈
android:button="@null"
- 单选按钮有两种触发监听情况(RadioButton可以不设置id属性)
1.选中RadioButton后触发监听
2.选完之后点击另一个按钮触发监听
1.选中便触发监听
<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:orientation="vertical"
tools:context=".MainActivity" >
<TextView
android:text="请选择你喜欢的编程语言:"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<RadioGroup
android:id="@+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<RadioButton
android:id="@+id/radiobutton1"
android:text="JAVA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<RadioButton
android:id="@+id/radiobutton2"
android:text="C#"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</RadioGroup>
</LinearLayout>
package com.example.qq;
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
RadioGroup radio1 = (RadioGroup) findViewById(R.id.radio1);
radio1.setOnCheckedChangeListener(new OnCheckedChangeListener() {
public void onCheckedChanged(RadioGroup arg0, int arg1) {
RadioButton r = (RadioButton) findViewById(arg1);
Log.i("1111","你选择的语言是:"+r.getText().toString());
}
});
}
}
2.选完后点击另一个按钮触发(在RadioGroup的子标签里进行遍历,看哪个RadioButton被选中,便执行相应的语句)
<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:orientation="vertical"
tools:context=".MainActivity" >
<TextView
android:text="请选择你喜欢的编程语言:"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<RadioGroup
android:id="@+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<RadioButton
android:id="@+id/radiobutton1"
android:text="JAVA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<RadioButton
android:id="@+id/radiobutton2"
android:text="C#"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</RadioGroup>
<Button
android:id="@+id/button"
android:text="提交"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
package com.example.qq;
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final RadioGroup radio = (RadioGroup) findViewById(R.id.radio1);
Button button = (Button) findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View arg0) {
for(int i=0;i<radio.getChildCount();i++){
RadioButton r = (RadioButton) radio.getChildAt(i);
if(r.isChecked()){
Log.i("1111","选中的是"+r.getText().toString());
}
}
}
});
}
}
复选框CheckBox
与单选按钮相同,其也有两种触发监听的情况
1.选中便触发
<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:orientation="vertical"
tools:context=".MainActivity" >
<TextView
android:text="请选择你喜欢的编程语言:"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<CheckBox
android:id="@+id/check1"
android:text="JAVA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<CheckBox
android:id="@+id/check2"
android:text="C#"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
package com.example.qq;
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final CheckBox check1 = (CheckBox) findViewById(R.id.check1);
final CheckBox check2 = (CheckBox) findViewById(R.id.check2);
check1.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener(){
@Override
public void onCheckedChanged(CompoundButton arg0, boolean arg1) {
if(arg1){
Log.i("1111","你选择的是:"+check1.getText().toString());
}
}
});
check2.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton arg0, boolean arg1) {
if(arg1){
Log.i("1111","你选择的是:"+check2.getText().toString());
}
}
});
}
}
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:orientation="vertical"
tools:context=".MainActivity" >
<TextView
android:text="请选择你喜欢的编程语言:"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<CheckBox
android:id="@+id/check1"
android:text="JAVA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<CheckBox
android:id="@+id/check2"
android:text="C#"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<Button
android:id="@+id/button"
android:text="提交"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
package com.example.qq;
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final CheckBox check1 = (CheckBox) findViewById(R.id.check1);
final CheckBox check2 = (CheckBox) findViewById(R.id.check2);
Button button = (Button)findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View arg0) {
if(check1.isChecked()){
Log.i("1111","你选中的是"+check1.getText().toString());
}
if(check2.isChecked()){
Log.i("1111","你选中的是"+check2.getText().toString());
}
}
});
}
}