Question

在WebView中，我使用WP 8.1加载HTML元素。每当内容超出WebView高度时，滚动都没有问题。我的问题是我在WebView的顶部有XAML元素，它们必须与WebView滚动一起滚动。

源码：

<ScrollViewer>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid VerticalAlignment="Top" >
<StackPanel x:name="xamlelement" Margin="15 20 0 0">
<textblock/>
  -------
  -------
  -------
</StackPanel>
</Grid>
<Grid x:Name="testgrid" Grid.Row="1">
<WebView Margin="0 30 0 0"  x:Name="msgContent" >
</WebView>
</Grid>
</Grid>
</ScrollViewer>

每当WebView元素＆＃34; msgContent＆＃34;我想要stackpanel＆＃34; xamlelement＆＃34;与WebView一起滚动。

Answer 1

这里的问题是我们可以通过这2个步骤禁用webview滚动

1）设置过度隐藏到加载到webview的html内容

2）设置webview的高度等于加载的html内容。

但是当我们尝试在webview中移动时，evnets不会传递给父滚动查看器元素

Answer 2

WebView提供了InvokeScript方法，该方法使用特定参数从当前加载的HTML执行指定的脚本函数。当WebView的LoadCompleted事件发生时，我正在调用禁用滚动的JavaScript。查看下面给出的完整代码。

string DisableScrollingJs = @"function RemoveScrolling()
                          {
                              var styleElement = document.createElement('style');
                              var styleText = 'body, html { overflow: hidden; }'
                              var headElements = document.getElementsByTagName('head');
                              styleElement.type = 'text/css';
                              if (headElements.length == 1)
                              {
                                  headElements[0].appendChild(styleElement);
                              }
                              else if (document.head)
                              {
                                  document.head.appendChild(styleElement);
                              }
                              if (styleElement.styleSheet)
                              {
                                  styleElement.styleSheet.cssText = styleText;
                              }
                          }";

void webView_LoadCompleted(object sender, NavigationEventArgs e)
{
  webView.InvokeScript("eval", new[] { DisableScrollingJs });
}

来自codeproject。

ScrollViewer中的WebView带有XAML元素标题

2 个答案: