网站的导航栏下拉菜单在 UWP 中不起作用

Question

我目前正在开发一个 UWP 应用程序，我的页面之一是在应用程序中显示一个网站。但是，我在 导航栏的下拉列表 方面遇到了一些问题。

此应用程序要在触摸屏设备上运行，问题来了。当我尝试运行本地计算机上的应用程序时，当我 将鼠标悬停在 上时，下拉列表成功显示。如下图：

但是当我在触摸屏设备上尝试应用程序时，下拉列表没有显示，页面被导航到导航栏中的 "main title" 页面。

我想知道是不是因为我在触摸屏上尝试时，我选择了导航栏中的 "main title"，它被认为是 on clicked 事件 因此它没有执行我在 本地计算机上运行并将鼠标悬停在 导航栏上时所做的操作。

这是我在 .xaml 下的代码：

<Page
x:Class="CitiKiosk_v2.Views.WebsitePage"
x:Name="pageRoot"
DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:CitiKiosk_v2.Views"
xmlns:common="using:CitiKiosk.Common"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">


<Grid>
    <Grid.ChildrenTransitions>
        <TransitionCollection>

        </TransitionCollection>
    </Grid.ChildrenTransitions>
    <ProgressRing Height="64"
                  Width="64"
                  Name="WebViewLoadProgressRing"
                  HorizontalAlignment="Center"
                  VerticalAlignment="Center"
                  IsActive="True"
                  Foreground="White" />

    <WebView Name="webView"
             Margin="0,0,0,20"
             Tapped="webView_Tapped"
             Source="http://www.nyp.edu.sg/schools/sit.html"
             NavigationStarting="webView_NavigationStarting"
             NavigationCompleted="webView_NavigationCompleted"
             PointerMoved="webView_PointerMoved"
             IsDoubleTapEnabled="False" 
             IsHoldingEnabled="False" 
             IsRightTapEnabled="False" 
             IsTapEnabled="False"
             FlowDirection="RightToLeft" />

    <CommandBar IsSticky="True"
                Name="WebViewCommandBar"
                Background="{StaticResource CitiKioskBackgroundBrush}"
                HorizontalAlignment="Stretch"
                VerticalAlignment="Bottom">

        <CommandBar.Transitions>
            <TransitionCollection>

            </TransitionCollection>
        </CommandBar.Transitions>



            <AppBarButton Icon="Back"
                          Label="Back"
                          IsCompact="True"
                          Foreground="White"
                          IsEnabled="{Binding CanGoBack,ElementName=webView}"
                          Name="WebViewBackButton"
                          Click="WebViewBackButton_Click"/>
            <AppBarButton Icon="Forward"
                          Label="Forward"
                          IsCompact="True"
                          Foreground="White"
                          IsEnabled="{Binding CanGoForward,ElementName=webView}"
                          Name="WebViewForwardButton"
                          Click="WebViewForwardButton_Click"
                          Margin="0 0 1500 0"/>

            <AppBarButton Icon="Refresh"
                          Label="Refresh"
                          IsCompact="True"
                          Name="WebViewRefreshButton"
                          Foreground="White"

                          Click="WebViewRefreshButton_Click"/>

    </CommandBar>

    <ProgressBar Name="WebViewProgressBar"
                 HorizontalAlignment="Stretch" 
                 Height="10"                      
                 VerticalAlignment="Bottom" 
                 IsIndeterminate="True" 
                 Foreground="White"
                 FontWeight="Bold"/>



</Grid>

这个有什么办法可以解决吗？谢谢！

Answer 1

现在问题是，您正在使用 webview。黄金法则是 webview 你无法控制渲染的内容。问题是，如果你想显示 website，你可以使用 webview，但是如果你不是网站。

问题是，有两个事件 hover over 和 click，当您将鼠标悬停在网站的导航栏上时，会调用 hover over 事件并显示下拉吃下。现在，当您在按钮上 tap(touch device) 时，您正在调用按钮的 click 事件，因此它被导航但不提供下拉列表。

遗憾的是，您的应用级别无法处理此问题。网站的开发者需要处理或定义触摸事件和鼠标事件的特定行为。

网站的导航栏下拉菜单在 UWP 中不起作用

Website's navigation bar's drop-down isn't working in UWP

navigationbar

web

uwp

dropdown