本篇繼續(xù)學(xué)習(xí)高級控件及獨具特色的監(jiān)聽器,目錄如下:
- ScrollView 滾動視圖
- ProgressBar 進度條
- ProgressDialog 對話框形式進度條
- SeekBar 可拖動進度條
- DataPicker 日歷選擇器
- DataPickerDialog 對話框形式日歷選擇器
- TimePicker 時間選擇器
- TimePickerDialog 對話框形式時間選擇器
1.ScrollView 滾動視圖
當(dāng)展示的內(nèi)容很多屏幕顯示不下時就需要用ScrollView來顯示完整的視圖。下圖對比了有無ScrollView兩種不同的情況:
可以看到當(dāng)整個頁面只有一個TextView時因為內(nèi)容不完整視覺上感覺很不好,如果加上ScrollView,用戶就可以滑動滾動條看到后面的內(nèi)容。ScrollView使用起來也很容易,只要將TextView作為它的子標(biāo)簽就可以了,如果不想看到滾動條,可以設(shè)置屬性android:scrollbars="none"隱藏起來。另外,根據(jù)需要也可以使用水平滾動視圖HorizantalScrollView,替換SrollView標(biāo)簽就可以了。
之后在MainActivity獲取TextView實例并set內(nèi)容,運行之后就能看到之前的效果了。
再介紹一個監(jiān)聽器OnTouchListener,它可以監(jiān)聽ScrollView滑行情況,比如希望用戶看完文本后繼續(xù)添加一些文本內(nèi)容,那么就可以在監(jiān)聽到ScrollView到達底部的事件后做出相應(yīng)的動作,代碼見下:
有必要對上述代碼做一些解釋:從event.getAction()可以監(jiān)聽到滑塊各種狀態(tài),其中一種狀態(tài)MotionEvent.ACTION_MOVE表示滑塊在滑動的過程中。接下來在判斷文本處于最頂端還是最低端時,使用了ScrollView三個測量高度的方法:scrollView.getChildAt(0).getMeasuredHeight()表示ScrollView第一個子標(biāo)簽即TextView文本內(nèi)容總長度,scrollView.getHeight()表示ScrollView高度即屏幕總高度, scrollView.getScrollY()表示滾動條滑動距離。易得出當(dāng)滑動距離+屏幕總高度=文本總長度時,正好到達文本最低端。調(diào)試結(jié)果如圖:
2.ProgressBar 進度條
ProgressBar通常用于展示某個耗時操作完成的進度,來更好的提升用戶界面的友好性。首先來學(xué)習(xí)ProgressBar幾個關(guān)鍵屬性:
max:最大顯示進度
progress:第一顯示進度
secondaryProgress:第二顯示進度
三者關(guān)系見圖:
style:進度條的類型,上圖顯示了四種常見的類型--大、中、小環(huán)形進度條以及水平進度條。其實每種類型的進度條顯示風(fēng)格也是多種多樣的,以水平進度條舉例,實際上style可選值中@android:style/下系統(tǒng)還提供了更多可選風(fēng)格,比如選擇第一項:
進度條就換了個風(fēng)格。
ctrl點進去看這個style源碼,發(fā)現(xiàn)整個進度條風(fēng)格由很多Item共同組成,比如通過第二項progressDrawable就可以實現(xiàn)自定義一個進度條樣式了。
介紹完P(guān)rogressBar幾個關(guān)鍵屬性后,再通過一個小demo學(xué)習(xí)它的幾個關(guān)鍵方法。在布局里準備三個button和一個textview,用于控制進度條加減和重置以及顯示進度條具體進度數(shù)據(jù)。
接著在MainActivity獲取到所有控件的實例并給所有按鈕都設(shè)置好監(jiān)聽器。為了顯示初始進度百分比,從ProgressBar三個get方法分別獲取到三個進度數(shù)值,經(jīng)過相應(yīng)的計算便可以得到了。
按鈕監(jiān)聽事件中,進度的重置直接用set方法,而進度的增加和減少就需要increment方法,參數(shù)為正數(shù)即加,負數(shù)即減。這里讓進度條每次變化十個百分比。
運行后點擊增加按鈕效果見圖,減少和重置功能也能很好的完成:
3.ProgressDialog 對話框形式進度條
學(xué)習(xí)完P(guān)rogressBar,趁熱打鐵,看看Dialog的進度條如何做到。直接在上個demo布局最后再添加一個Button,用于打開一個ProgressDialog,給它設(shè)置監(jiān)聽器后,在點擊事件里完成一個ProgressDialog的代碼見下:
用ProgressDialog的各種set方法設(shè)置了對話框頁面風(fēng)格(進度條樣式、標(biāo)題和圖標(biāo))、進度條屬性和一個名為“確認”的按鈕以及對應(yīng)的點擊事件,且這個對話框可通過返回鍵取消,最后一定要有progressDialog.show()否則之前設(shè)置都功虧一簣對話框是無法彈出來的。另外再說明一個方法setIndeterminate(),當(dāng)值為true表示不精確顯示進度條,比如環(huán)形進度條就會一直轉(zhuǎn)圈,而值為false表示精確顯示進度條,比如此例中水平進度條下就會顯示刻度。運行程序后結(jié)果如下:
當(dāng)點擊確定按鈕之后,確實彈出一個查看成功的Toast。
4.SeekBar 可拖動進度條
在我們調(diào)整音量或者聽歌的時候,會有這樣的進度條上面帶有滑塊允許用戶拖動以改變當(dāng)前進度的大小,這就是SeekBar。因為都是進度條,SeekBar的關(guān)鍵屬性就不多說了,這里認識一個監(jiān)聽器OnSeekBarChangeListener,用于監(jiān)聽SeekBar上滑塊運行狀態(tài)。接下來通過一個小例子學(xué)習(xí)如何使用,先準備這樣一個布局:
在MainActiviity給SeekBar注冊監(jiān)聽器并具體實現(xiàn)三個方法,對應(yīng)滑塊三個狀態(tài),其中onProgressChanged()方法會返回當(dāng)前進度progress數(shù)值使之顯示在第一個文本框。
運行結(jié)果如下,“開始拖動”一瞬間很快就進入到“正在拖動”的狀態(tài)。
5.DataPicker 日歷選擇器
當(dāng)我們在備忘錄寫每日行程或設(shè)置鬧鐘的時候必不可少需要填寫日期和時間,安卓有提供相應(yīng)的選擇器,幫助我們快速選擇日期和時間,剩下部分就來介紹這些Picker。
DataPicker日歷選擇器可選擇年月日,下圖預(yù)覽可看到就是一個很常見的日歷。
既然是選擇器,那么肯定可以監(jiān)聽到用戶選擇的內(nèi)容,所以每個選擇器固然有對應(yīng)的監(jiān)聽器。現(xiàn)在做這樣的小demo來看監(jiān)聽器的作用,標(biāo)題欄顯示當(dāng)前日期和時間,每當(dāng)用戶在DataPicker上選擇一個日期后,標(biāo)題欄實時變化以顯示當(dāng)前選擇的日期。
先利用系統(tǒng)提供的Calendar類可獲取到當(dāng)前年月日時分,這里注意Calendar計算月是從0開始。初始時標(biāo)題欄顯示當(dāng)前時間。
DataPicker想要注冊監(jiān)聽器OnDateChangedListener,要通過它的一個方法init()并提供四個參數(shù),前三個參數(shù)正是之前獲取的年月日,表示初始時日歷上所顯示的日期,注意月份的計算和Calendar相同,所以不需要加1,第四個參數(shù)是監(jiān)聽器對象。觸發(fā)事件后會返回被用戶選擇的年月日三個參數(shù),再顯示到標(biāo)題上即可。
看看運行后效果吧!
6.DataPickerDialog 對話框形式日歷選擇器
根據(jù)不同的需求,還可以通過對話框的形式選擇日期。方法是直接在代碼中new一個DataPickerDialog對象,再show()出來就完成了。和DataPicker非常相似的,初始化DataPickerDialog的時候需要五個參數(shù),第一個參數(shù)是上下文,然后就是監(jiān)聽器OnDateSetListener對象,之后才是年月日。
此時程序一啟動會先彈出一個對話框,用戶可直接選擇日期,確定后就可以看到剛剛選擇的日期顯示在標(biāo)題上了。
7.TimePicker 時間選擇器
下面來看看可選擇時分的TimePicker 時間選擇器,可在鐘表上先選擇小時的數(shù)值,再選擇分鐘的數(shù)值。
比DataPicker簡單的是,它可以直接通過setOnTimeChangedListener()方法注冊監(jiān)聽器OnTimeChangedListener,就不需要提供其他參數(shù)了。這里同樣地在事件觸發(fā)后讓標(biāo)題顯示被選擇的時分。
運行后:
8.TimePickerDialog 對話框形式時間選擇器
最后一個TimePickerDialog,學(xué)到現(xiàn)在,是不是能很容易掌握了?注冊監(jiān)聽器OnTimeSetListener過程如下:
運行:
好啦,本篇內(nèi)容暫時告一段落,還有一篇的高級控件等你來學(xué)習(xí)哦!