文章目录
一、布局中设置拖动条 Slider 组件
二、代码中控制拖动条 Slider 组件
一、布局中设置拖动条 Slider 组件
注意该 Slider 组件与 进度条 Progressbar 组件的区别 , Progressbar 不能拖动 , 只有显示功能 ;
布局中设置的 Slider 拖动条 :
<?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:orientation="vertical"> <Slider ohos: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"/> <Button ohos: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"/> <Text ohos: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 { @Override public void onStart(Intent intent) { super.onStart(intent); super.setUIContent(ResourceTable.Layout_ability_main); // 获取布局文件中的拖动条 Slider Slider slider = (Slider) findComponentById(ResourceTable.Id_slider); // 获取布局文件中的按钮 Button Button button = (Button) findComponentById(ResourceTable.Id_button); // 获取布局文件中的文本 Text Text text = (Text) findComponentById(ResourceTable.Id_text); // 设置按钮点击事件 button.setClickedListener(new Component.ClickedListener() { @Override public void onClick(Component component) { // 获取当前属性值 int progress = slider.getProgress(); text.setText("当前进度值 : " + progress); } }); } @Override public void onActive() { super.onActive(); } @Override public void onForeground(Intent intent) { super.onForeground(intent); } }