• 【Harmony OS】【FAQ】鸿蒙问题合集2

     1、问题描述：

    swiper嵌套子组件，子组件里面有PanGesture，有冲突swiper消费了滑动手势，该如何解决？

    demo如下：

    1. // @ts-nocheck
    2.  
    3. @Entry
    4.  
    5. @Component
    6.  
    7. struct PanGestureExample {
    8.  
    9.   @State offsetX: number = 0
    10.  
    11.   @State offsetY: number = 0
    12.  
    13.   build() {
    14.  
    15.     Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceBetween }) {
    16.  
    17.       Text('PanGesture offset:\nX: ' + this.offsetX + '\n' + 'Y: ' + this.offsetY)
    18.  
    19.     }
    20.  
    21.     .height(100).width(200).padding(20).border({ width: 1 }).margin(80)
    22.  
    23.     .translate({ x: this.offsetX, y: this.offsetY, z: 5 })
    24.  
    25.     .gesture(
    26.  
    27.     PanGesture({})
    28.  
    29.       .onActionStart((event: GestureEvent) => {
    30.  
    31.         console.info('Pan start')
    32.  
    33.       })
    34.  
    35.       .onActionUpdate((event: GestureEvent) => {
    36.  
    37.         this.offsetX = event.offsetX
    38.  
    39.         this.offsetY = event.offsetY
    40.  
    41.       })
    42.  
    43.       .onActionEnd(() => {
    44.  
    45.         console.info('Pan end')
    46.  
    47.       })
    48.  
    49.     )
    50.  
    51.   }
    52.  
    53. }

    解决方案：

    建议在PhotoView的父组件Swiper上设置priorityGesture属性，默认情况下，子组件优先于父组件识别手势，当父组件配置priorityGesture时，父组件优先于子组件进行识别。参考如下代码：

    1. Swiper()
    2.  
    3. ...
    4.  
    5. .priorityGesture(
    6.  
    7. TapGesture()
    8.  
    9.   .onAction(() => {
    10.  
    11.   }), GestureMask.IgnoreInternal
    12.  
    13. )

    2、问题描述：

    eTS scroll 组件，设置scrollable(ScrollDirection.Horizontal)时，为什么横向滚动滚动条不显示？

    demo如下：

    1. @Entry
    2.  
    3. @Component
    4.  
    5. struct scrollerPage {
    6.  
    7.   scroller: Scroller = new Scroller()
    8.  
    9.   private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
    10.  
    11.   build() {
    12.  
    13.     Stack({ alignContent: Alignment.TopStart }) {
    14.  
    15.       Scroll(this.scroller) {
    16.  
    17.         Row({ space: 20 }) {
    18.  
    19.           Row().width(150).height(50).backgroundColor(0xAFEEEE)
    20.  
    21.           Row().width(150).height(50).backgroundColor(0x00FFFF)
    22.  
    23.         }.width("200%").height(52).border({ width: 1 }).margin({ top: 20 })
    24.  
    25.       }
    26.  
    27.       .scrollable(ScrollDirection.Horizontal).scrollBar(BarState.On)
    28.  
    29.       .scrollBarColor(Color.Red).scrollBarWidth(30)
    30.  
    31.       .onScroll((xOffset: number, yOffset: number) => {
    32.  
    33.         console.info(xOffset + ' ' + yOffset)
    34.  
    35.       })
    36.  
    37.       .onScrollEdge((side: Edge) => {
    38.  
    39.         console.info('To the edge')
    40.  
    41.       })
    42.  
    43.       .onScrollEnd(() => {
    44.  
    45.         console.info('Scroll Stop')
    46.  
    47.       })
    48.  
    49.     }.width('100%').height('100%').backgroundColor(0xDCDCDC)
    50.  
    51.   }
    52.  
    53. }

    解决方案：

    横向的Scroll是没有滑动条显示的，如果需要可以用ScrollBar组件自定义

    js中类似于scrollview是list和list-item组件联合使用，示例如下：

    1、对应hml中遍历js中定义的imageList数据：

    1. <list class="text_container">
    2.  
    3. <list-item type="listItem" for="{{imageList}}">
    4.  
    5.   <image class="img" src="{{$item.value}}">image>
    6.  
    7. list-item>
    8.  
    9. list>

    2、对应js中的imageList定义：

    1. data: {
    2.  
    3. imageList: [{value: "/common/1.jpg"}, {value: "/common/2.jpg"}, {value: "/common/3.jpg"}, {value: "/common/4.jpg"}],
    4.  
    5. }

    3、可将步骤1中image标签改为div等标签自行定义

    4、默认为纵向，横向、纵向属性分别如下：

    1. style="flex-direction:row"
    2.  
    3. style="flex-direction:column"

    3、问题描述：

    设备的DVID有什么方式可以校验是否是真实的设备吗？

    解决方案：

    DVID不是某个设备的ID，是指由同一个鸿蒙账号的多个设备组成一个超级终端后的虚拟ID

    相关参考链接：文档中心

     

    欲了解更多更全技术文章，欢迎访问https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh 

  • 相关阅读:
    halcon 车牌识别
    拆解现货黄金隔夜利息计算公式
    【工具软件】mediamtx——网页、vue3项目中播放 rtsp 视频流（支持265转码）
    聚类算法模型评价指标
    spring framework notes
    【建议背诵】软考高项考试案例简答题汇总~（10）
    mysql的基本知识点
    常用文件名后缀一览
    分层架构理论基础
    知识图谱（Knowledge Graph）- Neo4j 5.10.0 使用 - CQL - 太极拳传承谱系表
  • 原文地址：https://blog.csdn.net/weixin_44708240/article/details/126155023