文章目录
一、布局中设置 ProgressBar、RoundProgressBar 进度条
二、代码中设置 ProgressBar、RoundProgressBar 进度条
三、完整代码示例
四、GitHub 地址
一、布局中设置 ProgressBar、RoundProgressBar 进度条
ProgressBar 进度条组件分为两种 , ① 圆形进度条 RoundProgressBar , ② 直线型进度条 ProgressBar ;
布局设置代码 :
<?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"> <!-- 直线进度条 --> <ProgressBar ohos:id="$+id:progressbar" ohos:height="match_content" ohos:width="match_parent" ohos:top_margin="200" ohos:layout_alignment="horizontal_center" ohos:min="0" ohos:max="100" ohos:progress="66" ohos:vice_progress="88"/> <!-- 圆形进度条 --> <RoundProgressBar ohos:id="$+id:roundprogressbar" ohos:height="400" ohos:width="400" ohos:top_margin="200" ohos:layout_alignment="horizontal_center" ohos:min="0" ohos:max="100" ohos:progress="66"/> </DirectionalLayout>
进度条属性简介 :
最小值 : ohos:min=“0”
最大值 : ohos:max=“100”
当前进度 : ohos:progress=“66”
顶部边距 : ohos:top_margin=“200”
布局对齐 : ohos:layout_alignment=“horizontal_center”
宽度 : ohos:width=“400”
高度 : ohos:height=“400”
纯布局效果 :
二、代码中设置 ProgressBar、RoundProgressBar 进度条
获取直线进度条 ProgressBar 组件 , 并设置最大值 , 最小值 , 当前第一进度 , 当前第二进度 ;
// 获取 XML 布局中的 ProgressBar 按钮 ProgressBar progressBar = (ProgressBar) findComponentById(ResourceTable.Id_progressbar); // 设置最大值最小值 progressBar.setMaxValue(100); progressBar.setMinValue(0); // 设置当前进度 progressBar.setProgressValue(20); // 设置第二进度值 progressBar.setViceProgress(80);
获取圆形进度条 RoundProgressBar 组件 , 并设置最大值 , 最小值 , 当前第一进度 , 当前第二进度 ;
// 获取 XML 布局中的 RoundProgressBar 按钮 RoundProgressBar roundProgressBar = (RoundProgressBar) findComponentById(ResourceTable.Id_roundprogressbar); // 设置最大值最小值 roundProgressBar.setMaxValue(20); roundProgressBar.setMinValue(0); // 设置当前进度 roundProgressBar.setProgressValue(10); // 设置第二进度 roundProgressBar.setViceProgress(15);