HarmonyOS鸿蒙Next中OpenHarmony用了Tabs组件后，里面的触摸事件失灵，左右平移不了，换其他容器则可以

Tabs() { TabContent(){ UImageView({ area:$areaLink, prjNo:‘16ecce1a50a74a65bcdc5d33039a30f4’ }) } } .scrollable(false) .animationDuration(0) .barWidth(0) .barHeight(0) .width(‘100%’) .width(‘100%’) .backgroundColor(’#f00’)

yuanlaile 1楼

楼主，代码功能验证正常。可以参考下这个帖子的回复，OpenHarmony API9 3.2.10.6 Beta5版本的UI问题优先配置，看下配置后是否有问题。

https://developer.huawei.com/consumer/cn/forum/topic/0204112730338050484?fid=0102683795438680754&pid=0304112979861103887

更多关于HarmonyOS鸿蒙Next中OpenHarmony用了Tabs组件后，里面的触摸事件失灵，左右平移不了，换其他容器则可以的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

itying888 2楼

没有配置下面，你是配置了才正常吗？

"metadata": [       
  {         
    "name": "ArkTSPartialUpdate",         
    "value": "true"       
  }     
]

htzhanglong 3楼

直接左右拖动是移动不了的（BUG），但是先上下拖动再左右拖动是可以移动的，

yuanlaile 4楼

旧框架上是有问题的，新框架已经修复，

nodeper 5楼

DEMO:

BUG: 直接左右拖动是移动不了的(不是我的问题)，先上下拖动再左右是可以移动的。


```python
[@Entry](/user/Entry)
[@Component](/user/Component)
struct IndexPage {
  [@State](/user/State) isLoginPage:boolean = true;
  [@State](/user/State) isLoading:boolean = false;
  build() {
    Stack() {
      Tabs() {
        TabContent(){
          ImageView()
        }
      }
      .scrollable(false)
      .animationDuration(0)
      .barWidth(0)
      .barHeight(0)
      .width('100%')
      .width('100%')
      .backgroundColor('#f00')
    }
  }
}

[@Component](/user/Component)
struct ImageView {
  [@State](/user/State) containerWidth:number = 0.0;
  [@State](/user/State) containerHeight:number = 0.0;
  [@State](/user/State) imageOffsetX:number = 0.0;
  [@State](/user/State) imageOffsetY:number = 0.0;
  [@State](/user/State) imageScale:number = 1.0;
  [@State](/user/State) imageWidth:number = 1.0;
  [@State](/user/State) imageHeight:number = 1.0;
  private startImageOffsetX:number = 0.0;
  private startImageOffsetY:number = 0.0;
  build(){
    Stack({alignContent:Alignment.TopStart}) {
      Stack({alignContent:Alignment.TopStart}) {
        Image($r("app.media.login_dialog"))
          .size({width:this.imageWidth, height:this.imageHeight})
          .onComplete(this.Image_onComplete.bind(this))
      }
      .translate({x:this.imageOffsetX, y:this.imageOffsetY})
      .scale({x:this.imageScale, y:this.imageScale, centerX: 0,centerY: 0})
    }
    .width('100%')
    .height('100%')
    .gesture(
      GestureGroup(GestureMode.Exclusive,
        PanGesture({fingers:1, distance:20})
          .onActionStart(this.PanGesture_onActionStart.bind(this))
          .onActionUpdate(this.PanGesture_onActionUpdate.bind(this))
        )
      )
    .onAreaChange((_, newValue)=>{
      this.containerWidth = newValue.width as number;
      this.containerHeight = newValue.height as number;
    })
  }
  private Image_onComplete(e:{width:number, height:number}){
    const sw = (this.containerWidth - 20.0) / px2vp(e.width);
    const sh = (this.containerHeight - 20.0) / px2vp(e.height);
    const scale = sw < sh ? sw : sh;
    this.imageWidth = px2vp(e.width);
    this.imageHeight = px2vp(e.height);
    this.imageOffsetX = (this.containerWidth - this.imageWidth * scale) / 2.0;
    this.imageOffsetY = (this.containerHeight - this.imageHeight * scale) / 2.0;
    this.imageScale = scale;
  }
  private PanGesture_onActionStart(){
    this.startImageOffsetX = this.imageOffsetX;
    this.startImageOffsetY = this.imageOffsetY;
  }
  private PanGesture_onActionUpdate(e:GestureEvent){
    this.imageOffsetX = this.startImageOffsetX + e.offsetX;
    this.imageOffsetY = this.startImageOffsetY + e.offsetY;
  }
}

app.media.login_dialog: