Android笔记---- Android应用界面开发（2）

最新推荐文章于 2021-06-04 00:21:51 发布

boby_zheng

最新推荐文章于 2021-06-04 00:21:51 发布

阅读量750

点赞数

分类专栏： Android 文章标签： android开发 xml imageview textview layout

本文链接：https://blog.csdn.net/boby2012/article/details/42395307

版权

Android 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

TextView和EditText的功能和用法

Button和ImageButton的功能和用法

RadioButton和CheckBox的功能和用法

ToggleButton的功能和用法

时钟的功能和用法

ImageView的功能和用法

AutoCompleteTextView的功能和用法

Spinner的功能和用法

日期和时间选择器的功能和用法

消息提示（Toast、Notification）

TextView和EditText的功能和用法

TextView直接继承了View，它还是EditText、Button两个UI的父类。它主要的做用就是显示文本，类似于JLabel。

从功能上讲TextView是一个文本编辑器，只是Android关闭了它的文字编辑功能。如果想要编辑文本内容，可以使用其子类: EditText。

android:elipsize属性可支持如下几个属性值

none:不进行任何处理

start：在文本开头部分进行省略

middle:在文本中间部分进行省略

end：在文本结尾处进行省略

marquee:跑马灯的形式显示文本信息（动画横向移动）

在android:ellipsize的属性值为marquee时

android:marqueeRepeatLimit设置重复滚动的次数，当值设为marquee_forever时表示无限次。

android:focusableInTouchMode:是否在触摸模式下获得焦点

android:focusable控件是否能够获取焦点

例:EditText使用（用户的输入界面）

bg_border.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
	<solid android:color="#000000"/>
	<stroke android:width="2dip" android:color="#ff0000" />
</shape>

Main.xml
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TableRow>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/bg_border"
            android:text="用户名:"
            android:textSize="10sp" />

        <EditText
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:hint="请填写登录帐号"
            android:selectAllOnFocus="true" />
    </TableRow>

    <TableRow>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/bg_border"
            android:text="密码:"
            android:textSize="10pt" />

        <EditText
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:password="true" />
    </TableRow>

    <TableRow>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/bg_border"
            android:text="电话号码:"
            android:textSize="10pt" />

        <EditText
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:hint="请填写您的电话号码"
            android:phoneNumber="true"
            android:selectAllOnFocus="true" />
    </TableRow>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="注册" />

</TableLayout>

Button和ImageButton的功能和用法

Button继承了TextView，ImageButton继承了ImageView。区别在于Button生成的按钮上显示文字， ImageButton显示图片。

注意： ImageButton按钮指定了android:text属性没用，即使指定了该属性，图片按钮上不会显示任何文字。

如果要定义图片随用户动作而改变，可以使用XML资源文件来定义Drawable对象，再将Drawable对象设为Button的android:background属性值，或设为ImageButton的android:src属性值。

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal" >

    <TableRow>

        <!-- 普通文字按钮 -->

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/red"
            android:text="普通按钮"
            android:textSize="10pt" />
        <!-- 普通图片按钮 -->

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#000000"
            android:src="@drawable/blue" />
    </TableRow>

    <TableRow>

        <!-- 按下时显示不同图片的按钮 -->

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#000000"
            android:src="@drawable/button_selector" />
        <!-- 带文字的图片按钮 -->

        <Button
            android:id="@+id/test"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/button_selector"
            android:text="带文字的图片按钮" />
    </TableRow>

</TableLayout>

RadioButton和CheckBox的功能和用法

RadioButton（单选按钮）和CheckBox(复选框)都继承了Button按钮，可以直接使用Button支持的各种属性和方法。

与普通按钮不同的是，它们多了一个可选的功能，因此多了一个android:checked属性，该属性用于指定RadioButton、CheckBox初始时是否被选中。

RadioButton与CheckBox不同之处在于，一组RadioButton只能选择其中一个，因此RadioButton与RadioGroup一起使用。

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TableRow>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="性别:"
            android:textSize="11pt" />
        <!-- 定义一组单选框 -->

        <RadioGroup
            android:layout_gravity="center_horizontal"
            android:orientation="horizontal" >

            <!-- 定义两个单选框 -->

            <RadioButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="男" />

            <RadioButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="女" />
        </RadioGroup>
    </TableRow>

    <TableRow>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="喜欢的颜色:"
            android:textSize="11pt" />
        <!-- 定义一个垂直的线性布局 -->

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:orientation="vertical" >

            <!-- 定义三个复选框 -->

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:checked="true"
                android:text="红色" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="蓝色" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="绿色" />
        </LinearLayout>
    </TableRow>

</TableLayout>

ToggleButton的功能和用法

ToggleButton（状态开关按钮）也是由Button派生出来的,与CheckBox复选框相似，也提供两种状态。不过区别在于功能上， ToggleButton通常用于切换程序中的某种状态。

XML属性	方法	说明
android:checked	setChecked(boolean)	设置按钮是否被选中
android:textOff		设置没有选中时显示的文本
android:textOn		设置按钮选中时显示的文本

ToggleButtonTest.java

public class ToggleButtonTest extends Activity
{
	@Override
	public void onCreate(Bundle savedInstanceState)
	{
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		ToggleButton toggle = (ToggleButton)findViewById(R.id.toggle);
		final LinearLayout test = (LinearLayout)findViewById(R.id.test);
		toggle.setOnCheckedChangeListener(new OnCheckedChangeListener()
			{

				@Override
				public void onCheckedChanged(CompoundButton arg0, boolean arg1)
				{
					if(arg1)
					{
						//设置LinearLayout垂直布局
						test.setOrientation(1);
					}
					else
					{
						//设置LinearLayout水平布局
						test.setOrientation(0);
					}			
				}
			});
	}
}

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <!-- 定义一个ToggleButton按钮 -->

    <ToggleButton
        android:id="@+id/toggle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:checked="true"
        android:textOff="横向排列"
        android:textOn="纵向排列" />
    <!-- 定义一个可以动态改变方向的线性布局 -->

    <LinearLayout
        android:id="@+id/test"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="测试按钮一" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="测试按钮二" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="测试按钮三" />
    </LinearLayout>

</LinearLayout>

时钟的功能和用法

DigitalClock（数字时钟）继承了TextView，也就是说它本身是文本框，只是它里面显示的内容是当前时间，可以显示秒数。

AnalogClock(模拟时钟)继承了View组件，它重写了View的OnDraw方法，它会在View上显示模拟时钟，不会显示当前的秒数。

Chronometer是计时器组件，也继承了TextView，它不显示当前时间，它显示的是从某起始时间开始，一共过去了多长时间。

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <!-- 定义模拟时钟 -->

    <AnalogClock
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <!-- 定义数字时钟 -->

    <DigitalClock
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14pt" />

</LinearLayout>

ChronometerTest.java

public class ChronometerTest extends Activity
{
	@Override
	public void onCreate(Bundle savedInstanceState)
	{
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		//获取计时器组件
		final Chronometer ch = (Chronometer)findViewById(R.id.test);
		//获取“开始”按钮
		Button start = (Button)findViewById(R.id.start);
		start.setOnClickListener(new OnClickListener()
		{
			@Override
			public void onClick(View source)
			{
				//设置开始计时时间
				ch.setBase(SystemClock.elapsedRealtime());
				//启动计时器
				ch.start();				
			}
		});	
		ch.setOnChronometerTickListener(new OnChronometerTickListener()
		{
			@Override
			public void onChronometerTick(Chronometer ch)
			{
				//如果从开始计时到现在超过了20s。
				if(SystemClock.elapsedRealtime() - ch.getBase()
					 > 20 * 1000)
				{
					ch.stop();
				}
			}
		});
	}
}

Main.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"
	android:gravity="center_horizontal"
	>
<Chronometer
	android:id="@+id/test"  
	android:layout_width="wrap_content" 
	android:layout_height="wrap_content" 
	android:textSize="12pt"
	android:textColor="#ffff0000"
	/>
<Button
	android:id="@+id/start"  
	android:layout_width="wrap_content" 
	android:layout_height="wrap_content" 
	android:text="启动"
	/>		
</LinearLayout>

ImageView的功能和用法

ImageView继承了View组件，它的主要功能就是显示图片，其实它不仅可以显示图片，任何Drawable对象都可使用ImageView来显示。

XML属性	方法	说明
android:adjustViewBounds	setAdjustViewBounds(boolean)	设置ImageView是否调整自己的边界来保持所显示图片的长宽比
android:maxHeight	setmaxHeight(int)	设置ImageView的最大高度
android:maxWidth	setmaxWidth(int)	设置ImageView的最大宽度
android:scaleType	setScaleType(ImageView.ScaleType)	设置所显示图片如何缩放或移动以适应ImageView的大小
android:src	setImageResource(int)	设置ImageView所显示的Drawable对象的ID

AutoCompleteTextView的功能和用法

AutoCompleteTextView（自动完成文本框）从EditText派生而来，比普通文本编辑框多一个功能：当用户输入一定字符之后，自动完成文本框会显示一个下拉菜单，供用户选择。当用户选择某个菜单项之后， AutoCompleteTextView按用户选择自动填写该文本框。

AutoCompleteTextView除了可以使用EditText提供的XML属性和方法外，还支持如下表所示的常用的XML属性。

XML属性	方法	说明
android:completionHint	setCompletionHint(CharSequence)	出现下拉菜单时中的提示标题
android:completionThreshold	setThreshold(int)	设置用户至少输入几个字符才会提示
android:dropDownHeight	setdropDownHeight(int)	设置下拉菜单的高度

AutoCompleteTextViewTest.java

public class AutoCompleteTextViewTest extends Activity
{
	//定义字符串数组，作为提示的文本
	String[] books = new String[]{
		"hello,Android",
		"hello,Ajax",
		"hello,XML",
		"SSH讲义"
	};
	@Override
	public void onCreate(Bundle savedInstanceState)
	{
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		//创建一个ArrayAdapter，封装数组
		ArrayAdapter<String> aa = new ArrayAdapter<String>(
			this,
			android.R.layout.simple_dropdown_item_1line,
			books);
		AutoCompleteTextView actv = (AutoCompleteTextView)
			findViewById(R.id.auto);
		//设置Adapter
		actv.setAdapter(aa);
		
	}
}

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <!--
     定义一个自动完成文本框
	，指定输入一个字符后进行提示
    -->

    <AutoCompleteTextView
        android:id="@+id/auto"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:completionHint="请选择您喜欢的图书："
        android:completionThreshold="1"
        android:dropDownHorizontalOffset="20dp" />

</LinearLayout>

Spinner的功能和用法

Spinner （列表选择框），Android中的Spinner的列表选择框并不是需要显示下拉列表的，而是相当于弹出一个菜单供用户选择。

Spinner是ViewGroup的间接子类，因此可以作为容器使用， Spinner 支持如下表所示的XML属性。

XML属性	说明
android:prompt	设置该列表选择框的提示
android:entries	使用数组资源设置该下拉列表框的的列表项目。
XML属性	方法	说明
android:completionHint	setCompletionHint(CharSequence)	出现下拉菜单时中的提示标题
android:completionThreshold	setThreshold(int)	设置用户至少输入几个字符才会提示
android:dropDownHeight	setdropDownHeight(int)	设置下拉菜单的高度

日期和时间选择器的功能和用法

DatePicker和TimePicker都是从FrameLayout派生而来，其中DatePicker供用户选择日期， TimePicker供用户选择时间。

如果需要获取用户选择的日期、时间，则可以通过DatePicker添加OnDateChangedListener进行监听、为TimePicker添加OnTimerChangedListener进行监听来实现。

ChooseDate.java

public class ChooseDate extends Activity
{
	//定义5个记录当前时间的变量
	private int year;
	private int month;
	private int day;
	private int hour;
	private int minute;
	@Override
	public void onCreate(Bundle savedInstanceState)
	{
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		DatePicker datePicker = (DatePicker)findViewById(R.id.datePicker);
		TimePicker timePicker = (TimePicker)findViewById(R.id.timePicker);
		//获取当前的年、月、日、小时、分钟
		Calendar c = Calendar.getInstance();
		year = c.get(Calendar.YEAR);
		month = c.get(Calendar.MONTH);
		day = c.get(Calendar.DAY_OF_MONTH);
		hour = c.get(Calendar.HOUR);
		minute = c.get(Calendar.MINUTE);
		//初始化DatePicker组件，初始化时指定监听器
		datePicker.init(year , month ,day 
			, new OnDateChangedListener()
		{

			@Override
			public void onDateChanged(DatePicker arg0, int year
				, int month, int day)
			{
				ChooseDate.this.year = year;
				ChooseDate.this.month = month;
				ChooseDate.this.day = day;
				//显示当前日期、时间
				showDate(year, month , day , hour, minute);
			}
		});
		//为TimePicker指定监听器
		timePicker.setOnTimeChangedListener(new OnTimeChangedListener()
		{
			@Override
			public void onTimeChanged(TimePicker arg0, int hour, int minute)
			{
				ChooseDate.this.hour = hour;
				ChooseDate.this.minute = minute;
				//显示当前日期、时间
				showDate(year, month , day , hour, minute);				
			}
		});
	}
	//定义在EditText中显示当前日期、时间的方法
	private void showDate(int year, int month , int day
			, int hour , int minute)
	{
		EditText show = (EditText)findViewById(R.id.show);
		show.setText("您的购买日期为：" + year + "年" + month + "月"
			+ day + "日  " + hour + "时" + minute + "分");
	}	
}

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="选择购买本书的具体时间" />
    <!-- 定义一个DatePicker组件 -->

    <DatePicker
        android:id="@+id/datePicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal" />
    <!-- 定义一个TimePicker组件 -->

    <TimePicker
        android:id="@+id/timePicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal" />
    <!-- 显示用户输入日期、时间的控件 -->

    <EditText
        android:id="@+id/show"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:cursorVisible="false"
        android:editable="false" />

</LinearLayout>

消息提示（Toast、Notification）

Toast是一种非常方便的提示消息框，它会在程序界面上显示一个简单的提示信息，这个提示框用于向用户生成简单的提示信息。它具有两个特点：

Toast提示信息不会获得焦点。

Toast提示信息过一段时间会自动消息。

使用Toast生成消息的步骤如下：

调用Toast的构造器或makeText方法创建一个Toast对象。

调用Toast的方法来设置该消息提示的对齐方式、页边距、显示内容等。

调用Toast的show（）方法将它显示出来。

一般用Toast显示文本信息，如果想要显示图片信息，调用 Toast的setView()方法。

ToastTest.java

public class ToastTest extends Activity
{
	@Override
	public void onCreate(Bundle savedInstanceState)
	{
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		Button simple = (Button)findViewById(R.id.simple);
		//为按钮的单击事件绑定事件监听器
		simple.setOnClickListener(new OnClickListener()
		{
			@Override
			public void onClick(View source)
			{
				//创建一个Toast提示信息
				Toast toast = Toast.makeText(ToastTest.this
					, "简单的提示信息"
					// 设置该Toast提示信息的持续时间
					, Toast.LENGTH_SHORT);
				toast.show();
			}
		});
		Button bn = (Button)findViewById(R.id.bn);
		//为按钮的单击事件绑定事件监听器
		bn.setOnClickListener(new OnClickListener()
		{
			@Override
			public void onClick(View source)
			{
				//创建一个Toast提示信息
				Toast toast = Toast.makeText(ToastTest.this
					, "带图片的的提示信息"
					// 设置该Toast提示信息的持续时间
					, Toast.LENGTH_LONG);				
				toast.setGravity(Gravity.CENTER, 0, 0);
				//获取Toast提示里原有的View
				View toastView = toast.getView();
				//创建一个ImageView
				ImageView image = new ImageView(ToastTest.this);
				image.setImageResource(R.drawable.tools);
				//创建一个LinearLayout容器
				LinearLayout ll = new LinearLayout(ToastTest.this);
				//向LinearLayout中添加图片、原有的View
				ll.addView(image);
				ll.addView(toastView);
				toast.setView(ll);
				toast.show();				
			}
		});	
	}
}

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <Button
        android:id="@+id/simple"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="显示简单提示" />

    <Button
        android:id="@+id/bn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="显示带图片的提示" />

</LinearLayout>

Notification是显示在手机状态栏的消息，所谓手机状态栏，位于手机屏幕的最上方，显示了手机当前的网络状态、电池状态、时间等。

Notification所代表的是一种具有全局效果的通知，程序一般通过NotificationManager服务来发送Notification。

使用Notification的步骤：

调用getSystemService(NOTIFICATION_SERVICE)方法获取系统NotificationManager服务。

通过构造器创建一个Notification对象。

为Notification对象设置各种属性。

通过NotificationManager发送Notification。