如何在我的网页中垂直排列水平排列的部分，以使我的页面在设备上响应

Posted 2023-05-07

【中文标题】如何在我的网页中垂直排列水平排列的部分，以使我的页面在设备上响应

【英文标题】：How can I arrange horizontally arranged sections, in my web page, as vertically so as to make my page responsive on devices

【发布时间】：2021-11-24 02:00:55

【问题描述】：

我的问题：

我的网页屏幕分辨率比手机屏幕分辨率宽。我正在从要在 WebView 上显示的资产本地尝试它。

这些部分在网格显示中水平排列。 然后当我在手机上看到相同的页面时，中间部分是 已折叠（未显示）。 水平和垂直滚动视图是不可见的，但它应该是不可见的。 应该是这样：水平排列的部分应该 垂直排列以便能够显示每个部分。

我试着把 Horizo​​ntalScrollView 和 VerticalScrollView 和 WebView 放在里面。

我已将 WebView 的分辨率固定为 1000dp * 600dp（layout_width 和 layout_height 分别在我的布局 xml 中）。

现在我可以滚动到屏幕的所有部分，但是点击和拖放在页面上不起作用（拖放由内部的 javascript 管理）。

我尝试使用onInterceptTouchEvent来拦截一些事件，但我会说不推荐使用。

我想完全从网页管理滚动和点击，而不是使用水平滚动视图和滚动视图并在 WebView 上设置高度和宽度。

试图寻求帮助：

How to make a page responsive How can I arrange horizontally ...

【参考方案1】：

下面的链接稍微解决了我的问题。我可以控制何时希望上述滚动条在需要时滚动（或通过在此滚动视图父级内添加填充尺寸以提供滚动区域）。

Prevent scroll of parent scroll view when drag event is happening in its child view, or in some other case where you do not want your scroll view parent to scroll.

还有一个捷径：

scrollView.requestDisallowInterceptTouchEvent(true);

但它提供的控制较少。如果您在此滚动视图父级内添加填充尺寸以提供滚动区域，它可以满足我的需要。