Question

我有一个弹出窗口，当用户更改数据时，我希望在内容加载时完全无法访问它。我通过在加载数据之前显示的Z-Index中的最高点处具有ProgressRing的网格以及之后隐藏来实现其他控件。

问题在于弹出窗口呈现在其他所有内容之上，这使得它仍然可以访问。即使将页面的“IsEnabled”属性设置为“False”，也可以使其中的控件保持可见。

以下是问题的屏幕截图：

它看起来像什么：

（Combobox是互动的）

它应该是什么样的：

（ComboBox不是交互式的）

关于如何解决这个问题的任何想法？

Answer 1

不确定我是否理解正确，但您可以尝试使用flyout内容的 IsHitTestVisible 和 Opacity 属性。我已经举了一个简单的例子，它是如何工作的 - 页面的XAML：

<Page.Resources>
    <local:NullableToBool x:Key="NullConverter"/>
</Page.Resources>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Width="400" Height="200">
    <ProgressRing Width="100" Height="100" Margin="50" HorizontalAlignment="Left" VerticalAlignment="Center" Visibility="Visible"
                  IsActive="{x:Bind TheButton.IsChecked, Mode=OneWay, Converter={StaticResource NullConverter}}"/>
    <Button Content="Show flyout" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="50">
        <Button.Flyout>
            <Flyout>
                <Border Background="Gray" IsHitTestVisible="{x:Bind IsActive, Mode=OneWay}" Opacity="{x:Bind FlyoutOpacity, Mode=OneWay}">
                    <ToggleButton Margin="20" x:Name="TheButton" IsChecked="False" Click="TheButton_Click" Content="Doing smth" Width="100"/>
                </Border>
            </Flyout>
        </Button.Flyout>
    </Button>
</Grid>

和背后的代码：

public class NullableToBool : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        return value is bool ? (bool)value : false;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

public sealed partial class MainPage : Page, INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;
    private void RaiseProperty(string name) => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));

    private bool isActive = true;
    public bool IsActive
    {
        get { return isActive; }
        set { isActive = value; RaiseProperty(nameof(IsActive)); }
    }

    private double flyoutOpacity = 1.0;
    public double FlyoutOpacity
    {
        get { return flyoutOpacity; }
        set { flyoutOpacity = value; RaiseProperty(nameof(FlyoutOpacity)); }
    }

    public MainPage()
    {
        this.InitializeComponent();
    }

    private async void TheButton_Click(object sender, RoutedEventArgs e)
    {
        IsActive = false;
        FlyoutOpacity = 0.1;
        await Task.Delay(3000);
        IsActive = true;
        FlyoutOpacity = 1.0;
        (sender as ToggleButton).IsChecked = false;
    }
}

Answer 2

如果您只想在ProgressRing显示时阻止UI。您可以使用Template10中的ModalDialog。

几乎每个应用程序都需要显示某种形式的模态对话框 - 一个阻止与应用程序其余部分交互的UI元素，直到用户解除它或某个应用程序任务完成为止。

叠加在弹出窗口上方

2 个答案: