长图自动滚动查看,有人知道如何实现吗?

长图自动滚动查看

HarmonyOS
2024-05-26 15:21:11
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
cbaby

本文主要将一张长图使用Image和Scroll配合定时器实现自动滚动查看。

使用的核心API

定时器

核心代码解释

1.使用Image展示图片

Image($r('app.media.img')) 
  .width(550)

2.使用Scroll实现滚动查看。

Scroll(this.scroller){ 
  Image($r('app.media.img')) 
    .width(550) 
}.width(50) 
.scrollable(ScrollDirection.Horizontal) 
.scrollBar(BarState.Off)

3.使用定时器间隔滚动:

setInterval(()=>{ 
  // 点击后滑动到指定位置,即下滑100.0vp的距离 
  let xOffset: number = this.scroller.currentOffset().xOffset; 
  if (xOffset>500) { 
    xOffset = 0 
  } 
  this.scroller.scrollTo({ xOffset: xOffset+10, yOffset: 0 }) 
},10)

适配的版本信息

  •  IDE版本:4.0.1.501
  •  SDK版本:4.0.10.8
分享
微博
QQ
微信
回复
2024-05-27 20:23:46
相关问题
如何实现http连接,有人知道
2696浏览 • 1回复 待解决
过长文字如何滚动显示,有人知道?
2673浏览 • 1回复 待解决
如何实现振动,有人知道
2438浏览 • 2回复 待解决
如何实现镂空效果,有人知道?
1472浏览 • 1回复 待解决
如何实现图片预览,有人知道
2030浏览 • 1回复 待解决
有人知道如何实现图文混排
2137浏览 • 1回复 待解决
如何实现翻页功能,有人知道
3132浏览 • 1回复 待解决
热重载该如何实现有人知道
1621浏览 • 1回复 待解决
如何实现防截屏功能,有人知道
3065浏览 • 1回复 待解决
如何获取windowStage,有人知道
1979浏览 • 1回复 待解决
弧形进度条实现有人知道方法
1586浏览 • 1回复 待解决
有人知道JS menu如何隐藏
5624浏览 • 1回复 待解决
如何发送短信,有人知道?
3188浏览 • 1回复 待解决
如何跳出ForEach,有人知道
3295浏览 • 1回复 待解决
$$语法如何使用?有人知道
1836浏览 • 1回复 待解决
如何保存faultLogger ,有人知道
1855浏览 • 1回复 待解决
IP地址如何转化,有人知道
1594浏览 • 1回复 待解决
如何查询设备类型?有人知道
1424浏览 • 1回复 待解决
ArkTS要如何使用this,有人知道
1721浏览 • 1回复 待解决
如何获取组件高度,有人知道
3310浏览 • 1回复 待解决
如何获取系统电量,有人知道
3167浏览 • 1回复 待解决
有人知道关于页demo
1735浏览 • 1回复 待解决
深色模式如何屏蔽?有人知道
1300浏览 • 1回复 待解决