码迷,mamicode.com
首页 > 移动开发 > 详细

Android 界面编程 探险(二)

时间:2016-05-18 18:32:55      阅读:261      评论:0      收藏:0      [点我收藏+]

标签:

本篇将开始Android 界面编程探险(二)的旅程。


1.UI组件-AdapterView及其子类(二)


1)自动完成文本框(AutoCompleteTextView)的用法

MultiAutoCompleteTextView是AutoCompleteTextView派生的子类,MultiAutoCompleteTextView允许输入多个提示项,多个提示项以分隔符分隔。下面简单演示AutoCompleteTextView和MultiAutoCompleteTextView的用法:

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" >
	<!-- 定义一个自动完成文本框,指定输入一个字符后进行提示 -->
	<AutoCompleteTextView  
		android:id="@+id/auto"
		android:layout_width="fill_parent" 
		android:layout_height="wrap_content" 
		android:completionHint="请选择:"
		android:dropDownHorizontalOffset="10dp"
		android:completionThreshold="1"/>
	<!-- 定义一个MultiAutoCompleteTextView组件 -->
	<MultiAutoCompleteTextView
		android:id="@+id/mauto"
		android:layout_width="fill_parent"
		android:layout_height="wrap_content"
		android:completionThreshold="1"/>
</LinearLayout>
AutoCompleteTextViewTest.java
public class AutoCompleteTextViewTest extends Activity {
	AutoCompleteTextView auto;
	MultiAutoCompleteTextView mauto;

	String[] str = new String[]{
		"aa",
		"ab",
		"ac",
	};
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		
		// 创建ArrayAdapter对象
		ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, str);
		
		auto = (AutoCompleteTextView)findViewById(R.id.auto);
		auto.setAdapter(adapter);
		
		mauto = (MultiAutoCompleteTextView)findViewById(R.id.mauto);
		mauto.setAdapter(adapter);
		
		// 为MultiAutoCompleteTextView设置分隔符
		mauto.setTokenizer(new MultiAutoCompleteTextView.CommaTokenizer());
	}
}

运行如上代码的效果如下图:

技术分享

2)网格视图(GridView)的用法

GridView与ListView的唯一区别就是ListView只显示一列,GridView可显示多列。GridView常用的XML属性如下:

android:columnWidth=""			设置列的宽度
android:numColumns=""			设置列数
android:gravity="" 				设置对齐方式
android:verticalSpacing=""		设置各元素之间的垂直距离
android:horizontalSpacing=""	设置各元素之间的水平距离
android:stretchMode=""			设置拉伸模式
GridView的Adapter写法参考ListView。

3)其他

本部分组件只给出演示效果,具体使用方法可以查阅官方文档。

可展开的列表组件(ExpandableListView)             

技术分享

弹出菜单供用户选择(Spinner)

技术分享

画廊视图(Gallery)

技术分享

使用AdapterViewFlipper实现自动播放图片                       

技术分享   

StackView实现以“堆叠”方式来显示多个列表项

技术分享



2.UI组件-ProgressBar及其子类


1)ProgressBar的用法

ProgressBar代表了进度条组件,通常用于显示某个耗时操作完成百分比,ProgressBar及其子类类图如下:

技术分享

ProgressBar的风格可以通过style属性设置,该属性有如下几个属性值:

<!-- 定义一个大环形进度条 -->
<ProgressBar
 	android:layout_width="wrap_content" 
	android:layout_height="wrap_content"
	style="@android:style/Widget.ProgressBar.Large" />
<!-- 定义一个中等大小的环形进度条 -->
<ProgressBar
 	android:layout_width="wrap_content" 
	android:layout_height="wrap_content" />
style="@android:style/Widget.ProgressBar.Small"		定义一个小环形进度条
style="@android:style/Widget.ProgressBar.Horizontal"	定义一个水平进度条
style="@android:style/Widget.ProgressBar.Horizontal" 	定义一个水平进度条,并改变轨道外观
ProgressBar常用的XML属性如下:
android:max="100"			设置进度条的最大值
android:progress=""			设置进度条已完成进度值
android:progressDrawable="@drawable/.."	设置进度条的轨道对应的Drawable对象
android:indeterminate=""			true表示设置进度条不精确显示进度
android:indeterminateDrawable=""	设置绘制不显示进度的进度条的Drawable对象
android:indeterminateDuration=""	设置不精确显示进度的持续时间

2)拖动条(SeekBar)的用法

SeekBar的应用比较少(典型应用有拖动调节音量等),SeekBar的用法请查阅官方文档。

3)星级评分条(RatingBar)的用法

RatingBar和SeekBar十分相似,它们最大区别在于RatingBar通过星星来表示进度,RatingBar的用法请查阅官方文档。



3.UI组件-ViewAnimator及其子类


ViewAnimator及其子类主要功能是增加动画效果,类图如下:

技术分享

ViewSwitcher:视图切换组件,可实现分屏、左右滚动的效果。

ImageSwitcher:图像切换器,可在切换View组件时使用动画效果。

TextSwitcher:文本切换器,可在切换View组件时使用动画效果,与ImageSwitcher不同的是TextSwitcher所需的ViewFactory的makeView()方法必须返回一个TextView组件;TextSwitcher和TextView功能相似,都可以显示文本内容,区别在于TextSwitcher可指定文本切换时的动画效果。



4.对话框


Android提供了4种常用的对话框:

AlertDialog:功能最丰富、实际应用最广泛的对话框

ProgressDialog:进度对话框

DatePickerDialog:日期选择对话框

TimePickerDialog:时间选择对话框

1)使用AlertDialog创建对话框

AlertDialog提供了如下6种方法来指定对话框的内容:

setMessage()		设置对话框内容为简单文本内容
setItems()		设置对话框内容为简单列表项
setSingleChoiceItems()	设置对话框内容为单选列表项
setMultiChoiceItems()	设置对话框内容为多选列表项
setAdapter()		设置对话框内容为自定义列表项
setView()		设置对话框内容为自定义View
下面来看看AlertDialog的具体用法:

1-1)显示提示消息的对话框

/**
 * 简单对话框点击事件
 * @param view
 */
public void simpleDialog(View view) {
	new AlertDialog.Builder(this)
	.setTitle("简单对话框") // 设置对话框标题
	.setIcon(R.drawable.tools) // 设置图标
	.setCancelable(false) // 设置点击Dialog以外的界面不消失,按返回键也不起作用
//	.setCanceledOnTouchOutside(false); // 设置点击Dialog以外的界面不消失,按返回键还起作用
	.setMessage("确定退出吗?")
	.setPositiveButton("确定", new OnClickListener() {
		@Override
		public void onClick(DialogInterface dialog, int which) {
			Toast.makeText(getApplicationContext(), "单击了确定按钮!", 0).show();
		}
	})
	.setNegativeButton("取消", null)
	.create()
	.show();
}
效果图:

技术分享


2)使用ProgressDialog创建对话框

2-1)环形进度条

public void showSpinner(View view) {
	// 调用静态方法显示环形进度条
	ProgressDialog.show(this, "任务执行中", "任务执行中,请等待", false, true); 
}
效果图:
技术分享

2-2)显示进度的进度条

public class ProgressDialogTest extends Activity {
	
	final static int MAX_PROGRESS = 100;
	private int[] data = new int[50]; // 该程序模拟填充长度为100的数组
	int progressStatus = 0; // 记录进度对话框的完成百分比
	int hasData = 0;
	ProgressDialog pd;
	
	/**
	 * 定义一个负责更新的进度的Handler
	 */
	Handler handler = new Handler() {
		@Override
		public void handleMessage(Message msg) {
			// 表明消息是由该程序发送的
			if (msg.what == 0) {
				pd.setProgress(progressStatus);
			}
		}
	};

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

	/**
	 * 显示进度的进度条的点击事件
	 * @param source
	 */
	public void showProgress(View source) {
		progressStatus = 0; // 将进度条的完成进度重设为0
		hasData = 0; // 重新开始填充数组
		pd = new ProgressDialog(ProgressDialogTest.this);
		pd.setMax(MAX_PROGRESS);
		pd.setTitle("任务完成百分比"); // 设置对话框的标题
		pd.setMessage("耗时任务的完成百分比"); // 设置对话框 显示的内容
		pd.setCancelable(false); // 设置对话框不能用“取消”按钮关闭
		pd.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL); // 设置对话框的进度条风格
		pd.setIndeterminate(false); // 设置对话框的进度条是否显示进度
		pd.show(); 

		new Thread() {
			public void run() {
				while (progressStatus < MAX_PROGRESS) {
					progressStatus = MAX_PROGRESS * doWork() / data.length; // 获取耗时操作的完成百分比
					handler.sendEmptyMessage(0); // 发送空消息到Handler
				}
				// 如果任务已经完成
				if (progressStatus >= MAX_PROGRESS) {
					// 关闭对话框
					pd.dismiss();
				}
			}
		}.start();
	}
	/**
	 * 模拟一个耗时的操作
	 * @return
	 */
	public int doWork() {
		
		data[hasData++] = (int) (Math.random() * 100); // 为数组元素赋值
		try {
			Thread.sleep(100);
		} catch (InterruptedException e) {
			e.printStackTrace();
		}
		return hasData;
	}
}
效果图:

技术分享



5.菜单


Android系统的菜单支持类图如下:

技术分享

ContextMenu:上下文菜单

SubMenu:子菜单

MenuItem:菜单项

1)使用PopupMenu创建仿微信弹出式菜单

PopupMenuTest.java

public class PopupMenuTest extends Activity {
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
	}
	
	PopupMenu popup = null;
	/**
	 * 弹出式菜单的点击事件
	 * @param button
	 */
	public void onPopupButtonClick(View button) {
		
		popup = new PopupMenu(this, button); // 创建PopupMenu对象
		// 将R.menu.popup_menu菜单资源加载到popup菜单中
		getMenuInflater().inflate(R.menu.popup_menu, popup.getMenu());
		// 为popup菜单的菜单项单击事件绑定事件监听器
		popup.setOnMenuItemClickListener(
			new PopupMenu.OnMenuItemClickListener() {
			@Override
			public boolean onMenuItemClick(MenuItem item) {
				switch (item.getItemId()) {
					case R.id.item1:
						// 隐藏该对话框
						popup.dismiss();
						break;
					default:
						// 使用Toast显示用户点击的菜单项
						Toast.makeText(PopupMenuTest.this, "您单击了" + item.getTitle() + "菜单项", 0).show();
				}
				return true;
			}
		});
		popup.show();
	}
}
其中res/menu/popup_menu.xml为
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:id="@+id/item1"
        android:icon="@android:drawable/ic_menu_search"
        android:textSize="16sp"
        android:title="发起群聊"/>
    <item
        android:id="@+id/item2"
        android:icon="@android:drawable/ic_menu_add"
        android:textSize="16sp"
        android:title="添加朋友"/>
    <item
        android:id="@+id/item3"
        android:textSize="16sp"
        android:title="扫一扫"/>
    <item
        android:id="@+id/item4"
        android:textSize="16sp"
        android:title="收付款"/>
</menu>

styles.xml如下

<resources>
    <!-- Application theme. -->
    <style name="AppTheme" parent="android:Theme.Holo.Light.DarkActionBar"></style>
</resources>

运行后效果图如下:

技术分享


Android 界面编程 探险(二)

标签:

原文地址:http://blog.csdn.net/smartbetter/article/details/51425204

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!