问题现象
当应用在直板手机查看时，布局显示正常；从PC设备打开应用，布局会出现截断、错位、遮挡等异常现象。
背景知识
一多适配布局方面提供的两种布局方式：
- 自适应布局：当外部容器大小发生变化时，元素可以根据相对关系自动变化以适应外部容器变化的布局能力。自适应布局能力可以实现界面显示随外部容器大小连续变化。
- 响应式布局：当外部容器大小发生变化时，元素可以根据断点、栅格或特定的特征（如屏幕方向、窗口宽高等）自动变化以适应外部容器变化的布局能力。当前响应式布局能力有3种：
- 断点：将窗口宽度划分为不同的范围（即断点），监听窗口尺寸变化，当断点改变时同步调整页面布局。
- 媒体查询：媒体查询支持监听窗口宽度、横竖屏、深浅色、设备类型等多种媒体特征，当媒体特征发生改变时同步调整页面布局。
- 栅格布局：栅格组件将其所在的区域划分为有规律的多列，通过调整不同断点下的栅格组件的参数以及其子组件占据的列数等，实现不同的布局效果。
响应式布局可以实现界面随外部容器大小有不连续变化，通常不同特征下的界面显示会有较大的差异。
问题定位
- 需要确认页面布局异常是留白较多，内容稀疏的问题，还是布局错乱的问题。如果是页面留白较多的问题，建议检查页面自适应组件是否设置了自适应布局能力，若有相关组件属性设置则说明仅采用了自适应布局组件进行了部分布局适配。
- 仅使用自适应布局会导致页面尺寸过大时，留白较多等问题；此时需要搭配响应式布局来解决留白过多的问题。
- 如果页面布局错乱，可能是未采用响应式布局。
- 建议检查代码在UIAbility的onWindowStageCreate生命周期回调中，是否通过窗口对象获取启动时的应用窗口宽度并注册回调函数监听窗口尺寸变化。可参考官网响应式布局断点案例。
- 由于监听窗口尺寸变化有多种方式，我们还需要确认代码中是否有采用媒体查询来进行监听应用窗口尺寸变化。
- 还需确定的是，代码是否采用了栅格布局来进行布局适配。
分析结论
- 仅采用自适应布局组件进行开发，会导致页面在PC窗口下显示内容稀疏，留白过多的问题。
- 未采用响应式布局，会导致页面位置错乱，组件拉伸，变形等问题。
修改建议
推荐采用自适应布局结合响应式布局，采用具有自适应能力的组件结合windowSizeChange方法监听窗口尺寸变化，或者采用响应式布局中的媒体查询和栅格布局并结合断点功能一起使用，来实现不同的布局效果。不同断点下页面组件采用不同的尺寸和布局方式。具体示例可参考：响应式布局。