HarmonyOS 使用ScrollBar组件,横向内容很长时,左右滑动,底部滑块不移动
使用ScrollBar组件,横向内容很长时,左右滑动,底部滑块不移动
代码:
private scroller: Scroller = new Scroller()
private designRate: number = 1;
List({ scroller: this.scroller, space: this.gridBreakPoint == 'sm' ? 5 * this.designRate : 12 }) {
ListItem(){
}.width(2000).height(100).linearGradient({
direction: GradientDirection.Left, // 渐变方向
repeating: true, // 渐变颜色是否重复
colors: [[0xff0000, 0.0], [0x0000ff, 0.3], [0xffff00, 0.5]] // 数组末尾元素占比小于1时满足重复着色效果
})
}
.listDirection(Axis.Horizontal)
.scrollBar(BarState.Off)
.edgeEffect(EdgeEffect.Spring)
.padding({ top: 10 })
ScrollBar({ scroller: this.scroller, direction: ScrollBarDirection.Horizontal, state: BarState.On }) {
Text()
.width(16)
.height(5)
.backgroundColor('#FF6257')
.borderRadius(3 * this.designRate)
}
.width(24)
.height(5)
.margin({ top: 7 })
.backgroundColor('rgba(255, 98, 87, 0.31)')
.borderRadius(3)
HarmonyOS
赞
收藏 0
回答 1
待解决
相关问题
HarmonyOS Grid横向滑动
792浏览 • 1回复 待解决
HarmonyOS Scroll 横向滑动时根据滑动的距离触发视图不更新
587浏览 • 1回复 待解决
tabs组件 左右滑动延迟较高
1226浏览 • 1回复 待解决
HarmonyOS Tabs组件嵌套Web组件,导致横向滑动冲突
236浏览 • 1回复 待解决
HarmonyOS Web组件嵌套滚动 当web 内容超过屏幕长度,web底部的内容无法滑动联动
517浏览 • 1回复 待解决
HarmonyOS Scroll 组件内部放不确定高度的内容,如何监听页面滑动到底部,如何监听快要滑动到底部
336浏览 • 1回复 待解决
HarmonyOS 是否有查看大图左右滑动组件
341浏览 • 1回复 待解决
HarmonyOS 滑动条Slider,特殊滑块样式如何实现
177浏览 • 1回复 待解决
HarmonyOS image图片纵向横向滑动
223浏览 • 1回复 待解决
HarmonyOS RN使用ScrollView做横向滚动时和Native的横向滚动冲突
631浏览 • 1回复 待解决
多个横向list如何滑动一个时带动剩余list一起滑动
695浏览 • 1回复 待解决
HarmonyOS Web嵌套滑动时,向上滑动不跟随手指(滑动速度比手指移动速度快)
674浏览 • 1回复 待解决
HarmonyOS 滑动调试音量滑块不显示问题
174浏览 • 1回复 待解决
Tab组件内嵌web view左右滑动切换问题
686浏览 • 1回复 待解决
HarmonyOS Tabs和横向Scroll滑动冲突
394浏览 • 1回复 待解决
HarmonyOS 滑动时组件问题
379浏览 • 1回复 待解决
HarmonyOS 手指左右滑动 Row 组件,也会触发 onclick 方法
526浏览 • 1回复 待解决
HarmonyOS viewpager与子页面横向滑动冲突
465浏览 • 1回复 待解决
HarmonyOS如何屏蔽tab组件里面左右滑动切换的事件
1156浏览 • 1回复 待解决
HarmonyOS List组件如何监听滑动到底部?
1189浏览 • 1回复 待解决
HarmonyOS 如何按需限制设备左右滑动?
237浏览 • 1回复 待解决
HarmonyOS如何禁止页面左右滑动返回
1333浏览 • 1回复 待解决
List 组件使用 scroller 的 scrollTo 控制滑动时,能否取消滑动动画?
2156浏览 • 1回复 待解决
图片放大之后左右移动图片,不能移动出边界,怎么判断边界值
1150浏览 • 1回复 待解决
示例参考如下: