文章目錄

• 一、布局中設置拖動條 Slider 組件
• 二、代碼中控制拖動條 Slider 組件

一、布局中設置拖動條 Slider 組件

---

注意該 Slider 組件與 進度條 Progressbar 組件的區別 , Progressbar 不能拖動 , 只有顯示功能 ;

布局中設置的 Slider 拖動條 :

<?xml version="1.0" encoding="utf-8"?> <DirectionalLayoutxmlns:ohos="http://schemas.huawei.com/res/ohos"ohos:height="match_parent"ohos:width="match_parent"ohos:orientation="vertical"><Sliderohos:id="$+id:button"ohos:height="match_content"ohos:width="match_parent"ohos:layout_alignment="horizontal_center"ohos:top_margin="200"ohos:orientation="horizontal"ohos:min="0"ohos:max="100"ohos:progress="66"ohos:background_element="#000000"ohos:progress_color="#00FF00"ohos:text="更新當前進度值"ohos:text_size="100"/><Buttonohos:id="$+id:button"ohos:height="match_content"ohos:width="match_content"ohos:top_margin="200"ohos:layout_alignment="horizontal_center"ohos:text="更新當前進度值按鈕"ohos:text_size="50"/><Textohos:id="$+id:text"ohos:height="match_content"ohos:width="match_content"ohos:top_margin="200"ohos:background_element="$graphic:background_ability_main"ohos:layout_alignment="horizontal_center"ohos:text="當前進度值 : 66"ohos:text_size="100"/></DirectionalLayout>

Slider 相關標簽屬性說明 :

設置拖動條方向 : ohos:orientation=“horizontal” , 水平方向 ;

設置最小值 : ohos:min=“0” , 0 ;

設置最大值 : ohos:max=“100” , 100 ;

設置當前值 : ohos:progress=“66” , 66 ;

設置背景顏色 : ohos:background_element="#000000" , 黑色 ;

設置進度條顏色 : ohos:progress_color="#00FF00" , 綠色 ;

純布局效果展示 :

二、代碼中控制拖動條 Slider 組件

---

代碼中控制拖動條 Slider 組件 :

界面中有 Slider , Button , Text 三個組件, 點擊按鈕 , 將 Slider 中的進度值顯示到 Text 組件中 ;

package com.example.slider.slice;import com.example.slider.ResourceTable; import ohos.aafwk.ability.AbilitySlice; import ohos.aafwk.content.Intent; import ohos.agp.components.Button; import ohos.agp.components.Component; import ohos.agp.components.Slider; import ohos.agp.components.Text;public class MainAbilitySlice extends AbilitySlice {@Overridepublic void onStart(Intent intent) {super.onStart(intent);super.setUIContent(ResourceTable.Layout_ability_main);// 獲取布局文件中的拖動條 SliderSlider slider = (Slider) findComponentById(ResourceTable.Id_slider);// 獲取布局文件中的按鈕 ButtonButton button = (Button) findComponentById(ResourceTable.Id_button);// 獲取布局文件中的文本 TextText text = (Text) findComponentById(ResourceTable.Id_text);// 設置按鈕點擊事件button.setClickedListener(new Component.ClickedListener() {@Overridepublic void onClick(Component component) {// 獲取當前屬性值int progress = slider.getProgress();text.setText("當前進度值 : " + progress);}});}@Overridepublic void onActive() {super.onActive();}@Overridepublic void onForeground(Intent intent) {super.onForeground(intent);} }

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的【鸿蒙 HarmonyOS】UI 组件 ( 拖动条 Slider 组件 )的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。