HarmonyOSAPP組件分享(三)
51CTO和華為官方合作共建的鴻蒙技術(shù)社區(qū)
HarmonyOS APP-Picker體驗(yàn)與分享
今天主要分享Picker的組件,這個(gè)組件提供了可滑動(dòng)選擇器,允許用戶在可選范圍進(jìn)行選擇。這里我們創(chuàng)建了好幾個(gè)選擇器,設(shè)置了其中的樣式和一些效果。
第一個(gè)就是一個(gè)簡單的范圍選擇,首先我們在xml中創(chuàng)建Picker對象進(jìn)行樣式布局,然后我們在來到Java中設(shè)置取值范圍,通過創(chuàng)建Picker對象并且實(shí)例化然后獲取在xml中的id值,然后在設(shè)置選擇器的取值范圍,代碼如下:
- Picker picker = (Picker) findComponentById(ResourceTable.對象id);
- picker.setMinValue(0);//設(shè)置最小取值范圍
- picker.setMaxValue(6); //設(shè)置最大取值范圍
這樣我們就完成了第一種的效果了。
這里還有一種格式化Picker的顯示
通過Picker的setFormatter(Formatter formatter)方法,用戶可以將Picker選項(xiàng)中顯示的字符串修改為特定的格式。
我們這里還可以設(shè)置輪模式,進(jìn)行循環(huán)滑動(dòng),在Java代碼中添加以下代碼即可:
- boolean isWheel = picker.isWheelModeEnabled(); // 獲取當(dāng)前是否是選擇輪模式
- picker.setWheelModeEnabled(!isWheel);
這里就可以顯示第二種的效果了,我們還可以在xml中設(shè)置樣式,使其外觀美化,可以根據(jù)自己的想法進(jìn)行顏色和字體的搭配。
代碼還有很多不完善的地方,歡迎指教,謝謝。
完整代碼地址:
https://gitee.com/jltfcloudcn/jump_to/tree/master/jltf_Picker_component
HarmonyOS APP-TabList和Tab體驗(yàn)與分享
效果呈現(xiàn)
點(diǎn)擊上面“jltfvideo”可以換頁面
布局中的代碼
- <?xml version="1.0" encoding="utf-8"?>
- <DirectionalLayout
- xmlns:ohos="http://schemas.huawei.com/res/ohos"
- ohos:height="match_parent"
- ohos:width="match_parent"
- ohos:background_element="#444444"
- ohos:orientation="vertical">
- <TabList
- ohos:id="$+id:jltftab_list"
- ohos:weight="1"
- ohos:top_margin="10vp"
- ohos:tab_margin="24vp"
- ohos:tab_length="140vp"
- ohos:text_size="20fp"
- ohos:height="36vp"
- ohos:width="match_parent"
- ohos:layout_alignment="center"
- ohos:orientation="horizontal"
- ohos:text_alignment="center"
- ohos:normal_text_color="#999999"
- ohos:selected_text_color="#FFFFFF"
- ohos:selected_tab_indicator_color="#FFFFFF"
- ohos:selected_tab_indicator_height="2vp"/>
- <ScrollView
- ohos:id="$+id:tab_jltfcontent"
- ohos:height="match_parent"
- ohos:width="match_parent"
- ohos:padding="10vp"
- ohos:weight="9">
- </ScrollView>
- </DirectionalLayout>
完整代碼地址:
https://gitee.com/jltfcloudcn/jump_to/tree/master/jltf_TabList_and_Tab_component
51CTO和華為官方合作共建的鴻蒙技術(shù)社區(qū)