二、分類說明
④Picker
Picker提供了滑動選擇器,允許用戶從預(yù)定義范圍中進行選擇。
Picker的自有XML屬性見下表:
| 屬性名稱 | 屬性描述 | 使用案例 |
|---|---|---|
| element_padding | 文本和Element之間的間距Element必須通過setElementFormatter接口配置 | ohos:element_padding="10" |
| max_value | 最大值 | ohos:max_value="10" |
| min_value | 最小值 | ohos:min_value="10" |
| value | 當前值 | ohos:value="10" |
| normal_text_color | 未選中的文本顏色 | ohos:normal_text_color="#A8FFFFFF" |
| normal_text_size | 未選中的文本大小 | ohos:normal_text_size="10" |
| selected_text_color | 選中的文本顏色 | ohos:selected_text_color="#A8FFFFFF" |
| selected_text_size | 選中的文本大小 | ohos:selected_text_size="10" |
| selector_item_num | 顯示的項目數(shù)量,條數(shù) | ohos:selector_item_num="10" |
| selected_normal_text_margin_ratio | 已選文本邊距與常規(guī)文本邊距的比例,取值需>0.0f,默認值為1.0f | ohos:selected_normal_text_margin_ratio="0.5" |
| shader_color | 著色器顏色 | ohos:shader_color="#A8FFFFFF" |
| top_line_element | 選中項的頂行 | ohos:top_line_element="#FFFFFFFF" |
| bottom_line_element | 選中項的底線 | ohos:bottom_line_element="#FFFFFFFF" |
| wheel_mode_enabled | 選擇輪是否循環(huán)顯示數(shù)據(jù) | ohos:wheel_mode_enabled="true" |
⑤DatePicker
DatePicker主要供用戶選擇日期。
DatePicker的自有XML屬性見下表:
| 屬性名稱 | 屬性描述 | 使用案例 |
|---|---|---|
| date_order | 顯示格式,年月日 | ohos:date_order="day-month-year" 表示日期以日-月-年的格式顯示 |
| ohos:date_order="month-day-year" 表示日期以月-日-年的格式顯示 | ||
| ohos:date_order="year-month-day" 表示日期以年-月-日的格式顯示 | ||
| ohos:date_order="year-day-month" 表示日期以年-日-月的格式顯示 | ||
| ohos:date_order="day-month" 表示日期以日-月的格式顯示 | ||
| ohos:date_order="month-day" 表示日期以月-日的格式顯示 | ||
| ohos:date_order="year-month" 表示日期以年-月的格式顯示 | ||
| ohos:date_order="month-year" 表示日期以月-年的格式顯示 | ||
| ohos:date_order="only-year" 表示只顯示年份 | ||
| ohos:date_order="only-month" 表示只顯示月份 | ||
| ohos:date_order="only-day" 表示只顯示日期 | ||
| day_fixed | 日期是否固定 | ohos:day_fixed="true" |
| month_fixed | 月份是否固定 | ohos:month_fixed="true" |
| year_fixed | 年份是否固定 | ohos:year_fixed="true" |
| max_date | 最大日期(long類型) | ohos:max_date="1234567" |
| min_date | 最小日期(long類型) | ohos:min_date="1234567" |
| text_size | 文本大小(float類型) | ohos:text_size="30" |
| normal_text_size | 未選中文本的大小(float類型) | ohos:normal_text_size="30" |
| selected_text_size | 選中文本的大小(float類型) | ohos:selected_text_size="30" |
| normal_text_color | 未選中文本的顏色 | ohos:normal_text_color="#A8FFFFFF" |
| selected_text_color | 選中文本的顏色 | ohos:selected_text_color="#A8FFFFFF" |
| operated_text_color | 操作項的文本顏色 | ohos:operated_text_color="#A8FFFFFF" |
| selected_normal_text_margin_ratio | 已選文本邊距與常規(guī)文本邊距的比例,取值需>0.0f,默認值為1.0f | ohos:selected_normal_text_margin_ratio="0.5" |
| selector_item_num | 顯示的項目數(shù)量 | ohos:selector_item_num="10" |
| shader_color | 著色器顏色 | ohos:shader_color="#A8FFFFFF" |
| top_line_element | 選中項的頂行 | ohos:top_line_element="#FFFFFFFF" |
| bottom_line_element | 選中項的底線 | ohos:bottom_line_element="#FFFFFFFF" |
| wheel_mode_enabled | 選擇輪是否循環(huán)顯示數(shù)據(jù) | ohos:wheel_mode_enabled="true" |
⑥ProgressBar
ProgressBar用于顯示內(nèi)容或操作的進度。
ProgressBar的自有XML屬性見下表:
| 屬性名稱 | 屬性描述 | 使用案例 |
|---|---|---|
| divider_lines_enabled | 是否使用分割線 | ohos:divider_lines_enabled="true" |
| divider_lines_number | 分割線數(shù)量 | ohos:divider_lines_number="1" |
| infinite | 是否使用不確定模式 | ohos:infinite="true" |
| infinite_element | 不確定模式圖樣配置前提:infinite需設(shè)置為true | ohos:infinite_element="$media:media_src" |
| max | 最大值 | ohos:max="1" |
| max_height | 最大高度 | ohos:max_height="100" |
| max_width | 最大寬度 | ohos:max_width="100" |
| min | 最小值 | ohos:min="1" |
| orientation | 排列方向horizontal(水平方向),vertical(垂直方向) | ohos:orientation="horizontal" |
| progress | 當前進度 | ohos:progress="10" |
| background_instruct_element | 背景 | ohos:background_instruct_element="#000000" |
| progress_width | 進度條寬度 | ohos:progress_width="100" |
| progress_color | 進度條顏色 | ohos:progress_color="#FF262626" |
| progress_element | 進度條背景 | ohos:progress_element="#000000" |
| progress_hint_text | 進度提示文本 | ohos:progress_hint_text="test" |
| progress_hint_text_alignment | 進度提示文本對齊方式left、top、right、bottom、horizontal_center、vertical_center、center | 可以設(shè)置取值項如表中所列,也可以使用“|”進行多項組合。ohos:progress_hint_text_alignment="top" |
| progress_hint_text_color | 進度提示文本顏色 | ohos:progress_hint_text_color="#FFFFFFFF" |
| vice_progress | 當前副進度 | ohos:vice_progress="1" |
| vice_progress_element | 副進度條背景 | ohos:vice_progress_element="#000000" |
| step | 進度的步長;若step設(shè)置為10,進度值則為10的倍數(shù)。 | ohos:step="1" |
| progress_hint_text_size | 進度提示文本大小 | ohos:progress_hint_text_size="100" |
⑦RoundProgressBar
RoundProgressBar繼承自ProgressBar,擁有ProgressBar的屬性,在設(shè)置同樣的屬性時用法和ProgressBar一致,用于顯示環(huán)形進度。
RoundProgressBar的自有XML屬性見下表:
| 屬性名稱 | 屬性描述 | 使用案例 |
|---|---|---|
| start_angle | 圓形進度條的起始角度 | ohos:start_angle="10" |
| max_angle | 圓形進度條的最大角度 | ohos:max_angle="360.0" |
⑧TabList、Tab
Tablist可以實現(xiàn)多個頁簽欄的切換,Tab為某個頁簽。子頁簽通常放在內(nèi)容區(qū)上方,展示不同的分類。頁簽名稱應(yīng)該簡潔明了,清晰描述分類的內(nèi)容。
Tablist的自有XML屬性見下表:
| 屬性名稱 | 屬性描述 | 使用案例 |
|---|---|---|
| fixed_mode | 固定所有頁簽并同時顯示 | ohos:fixed_mode="true" |
| orientation | 頁簽排列方向horizontal(水平排列),vertical(垂直排列) | ohos:orientation="horizontal" |
| normal_text_color | 未選中的文本顏色 | ohos:normal_text_color="#FFFFFFFF" |
| selected_text_color | 選中的文本顏色 | ohos:selected_text_color="#FFFFFFFF" |
| selected_tab_indicator_color | 選中頁簽的顏色 | ohos:selected_tab_indicator_color="#FFFFFFFF" |
| selected_tab_indicator_height | 選中頁簽的高度 | ohos:selected_tab_indicator_height="100" |
| tab_indicator_type | 頁簽指示類型 | ohos:tab_indicator_type="invisible" 表示選中的頁簽無指示標記 |
| ohos:tab_indicator_type="bottom_line" 表示選中的頁簽通過底部下劃線標記 | ||
| ohos:tab_indicator_type="left_line" 表示選中的頁簽通過左側(cè)分割線標記 | ||
| ohos:tab_indicator_type="oval" 表示選中的頁簽通過橢圓背景標記 | ||
| tab_length | 頁簽長度 | ohos:tab_length="100" |
| tab_margin | 頁簽間距 | ohos:tab_margin="100" |
| text_alignment | 文本對齊方式left、top、right、bottom、horizontal_center、vertical_center、center、start、end | 可以設(shè)置取值項如表中所列,也可以使用“|”進行多項組合 ohos:text_alignment="center" |
| text_size | 文本大小 | ohos:text_size="100" |
TabList常用接口
| 方法 | 方法說明 |
|---|---|
| getSelectedTab | 返回選中的Tab |
| getSelectedTabIndex | 返回選中的Tab的位置索引 |
| getTabCount | 獲取Tab的個數(shù) |
| getTabAt | 獲取某個Tab |
| removeTab | 移除某個位置的tab |
| setOrientation | 設(shè)置橫或豎方向 |
⑨PageSlider
PageSlider是用于頁面之間切換的組件,它通過響應(yīng)滑動事件完成頁面間的切換。
常用方法表
| 方法 | 方法說明 |
|---|---|
| setProvider(PageSliderProvider provider) | 設(shè)置Provider,用于配置PageSlider的數(shù)據(jù)結(jié)構(gòu) |
| addPageChangedListener(PageChangedListener listener) | 響應(yīng)頁面切換事件 |
| removePageChangedListener(PageChangedListener listener) | 移除頁面切換的響應(yīng) |
| setOrientation(int orientation) | 設(shè)置布局方向 |
| setPageCacheSize(int count) | 設(shè)置要保留當前頁面兩側(cè)的頁面數(shù) |
| setCurrentPage(int itemPos) | 設(shè)置當前展示頁面 |
| setCurrentPage(int itemPos, boolean smoothScroll) | 設(shè)置當前展示界面,并確定是否需要平滑滾動 |
| setSlidingPossible(boolean enable) | 是否啟用頁面滑動 |
| setReboundEffect(boolean enabled) | 是否啟用回彈效果 |
| setReboundEffectParams(int overscrollPercent, float overscrollRate,int remainVisiblePercent) | 配置回彈效果參數(shù) |
| setPageSwitchTime(int durationMs) | 設(shè)置頁面切換時間 |
⑩PageSliderIndicator
PageSliderIndicator,需配合PageSlider使用,指示在PageSlider中展示哪個界面。
未完待續(xù)...