Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> Android 界面編程 探險(二)

Android 界面編程 探險(二)

編輯:關於Android編程

1.UI組件-AdapterView及其子類(二)

 

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

MultiAutoCompleteTextView是AutoCompleteTextView派生的子類,MultiAutoCompleteTextView允許輸入多個提示項,多個提示項以分隔符分隔。

下面簡單演示AutoCompleteTextView和MultiAutoCompleteTextView的用法:

main.xml

 

<linearlayout android:layout_height="fill_parent" android:layout_width="fill_parent" android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
	<autocompletetextview android:completionhint="請選擇:" android:completionthreshold="1" android:dropdownhorizontaloffset="10dp" android:id="@+id/auto" android:layout_height="wrap_content" android:layout_width="fill_parent">
	<multiautocompletetextview android:completionthreshold="1" android:id="@+id/mauto" android:layout_height="wrap_content" android:layout_width="fill_parent">
</multiautocompletetextview></autocompletetextview></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 adapter = new ArrayAdapter(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_height="wrap_content" android:layout_width="wrap_content" style="@android:style/Widget.ProgressBar.Large">
<progressbar android:layout_height="wrap_content" android:layout_width="wrap_content">
style="@android:style/Widget.ProgressBar.Small"		定義一個小環形進度條
style="@android:style/Widget.ProgressBar.Horizontal"	定義一個水平進度條
style="@android:style/Widget.ProgressBar.Horizontal" 	定義一個水平進度條,並改變軌道外觀</progressbar></progressbar>
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為
<menu xmlns:android="http://schemas.android.com/apk/res/android">
	<item android:icon="@android:drawable/ic_menu_search" android:id="@+id/item1" android:textsize="16sp" android:title="發起群聊"> <item android:icon="@android:drawable/ic_menu_add" android:id="@+id/item2" 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="收付款"> </item></item></item></item></menu>
這樣寫完運行會發現菜單字體比較大,不協調,為了解決這個問題,得從res/values/styles.xml下手
我修改styles.xml為如下代碼
<resources><style name="AppTheme" parent="@android:style/Theme.Holo.Light" type="text/css"><item name="android:actionMenuTextAppearance">@style/MenuTextStyle</item></style><style name="MenuTextStyle" type="text/css"><item name="android:textColor">@android:color/white</item>
        <item name="android:textSize">18sp</item></style>
</resources>
現在運行後效果圖如下:

 

\

 

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved