关于bindsheet在横屏、2in1下显示不正常的情况及解决方案##ArkTS##

之前好奇自己的app在平板或者横屏状态下是什么效果，就通过模拟器跑了一下，发现除了惨不忍睹的UI页面以外，通过半模态bindsheet去显示的一些内容显示不出来了，这个bindsheet对应的组件只在页面最下面显示了一点点，无法显示正常。当时也没太在意，以为只是我UI布局的问题。

今天在进行多端适配的时候，再次出现了这个问题，如图所示：

对于我的项目来说，bindsheet是一个很重要的部分，项目中很多地方都要到了这个半模态来显示 我在四种状态下，同时打开了这个模态框，可以看到，移动端和折叠屏态是正常的，其中折叠屏下还是在页面中间弹出的，这一点我倒是没想到……但是在2in1和平板下，这个模态框就显示不出来了，我找了好久……发现就是只有一点点，就是我第一张图里红色框框出来的部分。 从代码角度来说，4种状态下使用的都是同一套代码，那么应该不是代码的问题，但是这个bindsheet也不可以通过position来固定位置，那么到底是哪里的问题呢？ 在仔细阅读bindsheet相关文档后，我发现了一个叫preferType的属性 说明如下：

说明：半模态在不同窗口所支持的显示类型：1. 宽度 < 600vp：底部。2. 600vp <= 宽度 < 840vp：底部、居中、跟手。默认居中样式。3. 宽度 >= 840vp：底部、居中、跟手。默认跟手样式。

那么现在在平板和2in1模式下，宽度是肯定超过了840vp，也就是说，当前是跟手模式。我手头也没有平板更没有……PC，所以没办法测试具体跟手模式是啥，既然找到了问题，只要改一下就可以，代码如下：

    .bindSheet($$this.zxform, this._Zxform(), {
      height: this.bindheight,
      backgroundColor: Color.White,
      onWillDismiss:()=>{
        this.bindheight = 510;
        this.zxform = false;
      },
      preferType:SheetType.CENTER
    })

不过实测下，虽然设置了CENTER，但是在手机端，仍然还是从底部升起的，所以我怀疑移动端是固定了从底部升起，这个设置只对宽度大于等于840vp的情况下有效

总体来说，今天体验一多开发（一次开发，多端部署）的感觉就是，写法很灵活，可以获取屏幕宽度后通过if来条件渲染，也可以通过响应式和自适应的写法，这种写法和web网页的响应式开发很像。但是要注意的是，尽量在初始开发的时候就考虑到多端的问题，否则改起来会很累……