c# UWP Webview inside Scrollviewer only not working on Mobile答案

【问题标题】：c# UWP Webview inside Scrollviewer only not working on Mobilec# UWP Webview inside Scrollviewer only not working on Mobile
【发布时间】：2017-01-31 21:39:53
【问题描述】：

有一个奇怪的；我在滚动查看器内使用 webview（所以我可以在 webview 上方有一个 stackpanel 与它一起滚动），我的解决方案在台式电脑和平板电脑上运行良好（同时使用鼠标和触摸）但出于某种原因，在移动设备上电话页面只是不会滚动！不知道为什么。这是我所做的：

<ScrollViewer Grid.Row="1" x:Name="theScrollViewer" HorizontalAlignment="Stretch" 
                  ScrollViewer.VerticalScrollBarVisibility="Hidden"
                  HorizontalScrollBarVisibility="Disabled">
            <WebView ScrollViewer.HorizontalScrollBarVisibility="Hidden" 
                 ScrollViewer.VerticalScrollBarVisibility="Hidden" 
                 Margin="0" x:Name="theWebView" 
                 Height="2000"
                 DefaultBackgroundColor="#ff2E2E2E" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>    
</ScrollViewer>

为了停止 webview 中的滚动，我在加载到 webview 的 CSS 中添加了以下内容：

overflow-x:hidden;
overflow-y: hidden

webview 的 height 属性不会停留在 2000；但我知道滚动查看器中的内容要滚动它需要一个高度属性。无论如何，这在 PC 和平板电脑上与鼠标和触摸完美配合，但在 Windows 10 移动版上它只是不滚动。

有什么想法吗？？

【问题讨论】：

标签： c# webview uwp scrollviewer

【解决方案1】：

无论如何，这在 PC 和平板电脑上与鼠标和触控完美配合，但在 Windows 10 移动版上却无法滚动。

我认为问题在于您的 Webview 不会将操作事件传递给其父 ScrollViewer。

在PC上，我们可以通过在ScrollBar中拖动Thumb或滚动鼠标滚轮来滚动ScrollViewer，ScrollViewer可以检测到这两个交互。

但是在手机上，我们只能通过滑动ScrollViewer内的内容区域来滚动ScrollViewer，因为你的WebView会填满ScrollViewer的全部内容，滑动手势会被@987654331捕捉到首先@而不是再次处理ScrollViewer，现在你的WebView有足够的高度来容纳网页内容，WebView的默认滚动功能也将不起作用。

这里有个建议：WebView在手机上运行时，给WebView一个更小的ScrollViewer，你可以通过在空白区域滑动来滚动ScrollViewer。但我认为这不是解决您问题的优雅方案，这可能会使布局变得丑陋。

另一个建议是，您可以尝试在 StackPanel 的右侧创建自己的 Thumb 和 ScrollViewer 内的 WebView 以进行滚动，使 Thumb 可滑动并以编程方式使当Thumb 被翻译时ScrollViewer 滚动。

【讨论】：