HarmonyOS 鸿蒙Next 【Bug】DevEco的Previewer在纵横向切换时显示错误（与GridContainer相关）

HarmonyOS 鸿蒙Next 【Bug】DevEco的Previewer在纵横向切换时显示错误（与GridContainer相关） 这个问题来自于《ArkUI应用开发训练营》的第二篇——前端实战篇。对应第二篇的第7节课——2-7、综合示例-图文列表单元素。课程页面见下图。

cke_4184.png

我现在遇到了一个bug。如题，我跟随课程使用ArkTS开发范式编写页面。我遇到了一个问题。下面我简述一下我的问题经过。

课程中利用了GridContainer去实现web开发中的响应式布局。目的是去优化当手机横屏时的UI显示问题。我也照做了，但我发现IDE中Previewer横屏时并不会占满一行。我先面放两张图对比一下：

cke_12135.png

cke_55155.png

我一开始以为我自己编写代码是有哪里写错了。但我反复校验发现我写的内容与课程内容一致。所以，我怀疑是IDE本身出现了bug。于是，为了验证猜想，我将代码发布到支持api 8的远程模拟器的去测试。结果一切正常！具体详见下图：

cke_800.png

cke_74390.png

我想说的是，模拟器才是正确的效果，而Previewer中所示的内容是错的！

故，我想问，有没有人知道：

  1. 这个问题是我的问题？还是IDE本身的问题？
  2. 这个问题应该怎么处理？
  3. 我们我们应该怎么反馈这个问题？需不需要反馈日志文件？

写在最后，本人使用的编程工具配置信息如下：

DevEco Studio 3.1 Canary1Build Version: 3.1.0.101, built on November 29, 2022
Runtime version: 11.0.13+7-b1751.21 amd64
VM: Dynamic Code Evolution 64-Bit Server VM by JetBrains s.r.o.
Windows 10 10.0
GC: G1 Young Generation, G1 Old Generation
Memory: 2048M
Cores: 20
Registry: external.system.auto.import.disabled=true
Non-Bundled Plugins: org.intellij.gitee (2021.2.2)

更多关于HarmonyOS 鸿蒙Next 【Bug】DevEco的Previewer在纵横向切换时显示错误（与GridContainer相关）的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

你好，教程场景预览使用的是 P40 的设备分辨率哦，你这边预览配置的是 P50P 的分辨率，使用 useSizeType 属性时，需要配置下 lg 在横屏预览时就能正常显示了，参考下图配置下哈：

11.png

更多关于HarmonyOS 鸿蒙Next 【Bug】DevEco的Previewer在纵横向切换时显示错误（与GridContainer相关）的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


那么我可以进一步问一下吗？华为官方文档中，有没有对于各种华为机型的宽高进行统计呢？

https://consumer.huawei.com/cn/phones/mate50-pro/specs/, 在这里可以看到设备的规格参数哦，

你好，问题已在分析中哈

针对HarmonyOS鸿蒙Next中DevEco的Previewer在纵横向切换时显示错误（与GridContainer相关）的问题，以下提供直接的专业解答：

DevEco Previewer在处理GridContainer组件的纵横向切换时，可能由于布局重新计算或组件状态同步不及时导致显示错误。这类问题通常与组件的重新渲染机制或布局管理器的处理逻辑有关。

解决此类问题的关键在于确保GridContainer在屏幕方向变化时能够正确重新布局其内部的子组件。你可以检查以下几点：

  1. 布局参数：确保GridContainer及其子组件的布局参数（如行列数、边距等）在屏幕方向变化时能够正确更新。
  2. 组件状态：验证组件状态在切换过程中是否保持一致，避免状态丢失或不一致导致的显示问题。
  3. 预览器版本：确认你使用的DevEco Previewer是否为最新版本，有时软件更新会修复此类bug。

如果上述检查后问题依旧存在，可能是DevEco Studio或鸿蒙系统的已知问题，需要等待官方修复。此时，你可以考虑绕过该问题，如避免在需要频繁切换屏幕方向的场景中使用GridContainer，或者暂时使用静态布局替代。

如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html

回到顶部