wpf:如何弹出用户控件

本文关键字：用户 控件 何弹出 wpf | 更新日期: 2023-09-27 18:30:45

>背景：我有一个使用数据网格来显示数据的项目，数据网格有一个包含用户控件的行详细信息列。用户控件具有一些用于用户输入和显示某些消息的文本框。

问题：我想在单击按钮时弹出用户控件，并且弹出的用户控件与数据网格的行详细信息列中的用户控件具有相同的上下文。这样做的目的是使用户能够轻松地与用户控件交互，因为 rowdetail 单元格的房间是有限的。

usecontrol已经实现，它可以在行细节单元格中正常工作。但是，我不知道如何在不更改其上下文的情况下弹出它，例如数据源，消息已显示在文本框中等。有人可以给我一些建议吗？顺便说一下，我使用 MVVM 模式。

编辑：以下是 RowDetailTemplate：

    <DataTemplate x:Key="RowDetailTemplate">
    <Grid x:Name="RowDetailGrid" HorizontalAlignment="Left" Width="850" Height="355" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="100" />
        </Grid.ColumnDefinitions>
        <my:MyUserControl x:Name="myUserControl" />
        <Button Grid.Row="1" Width="60" Height="25" Content="Pop Up" 
                    Command="{Binding Path=PopupCommand}"/>
        .....
    </Grid>
</DataTemplate>

这是用户控件（上述代码中的MyUserControl）：

<UserControl x:Class="MyProject"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="600">
<Grid>
    <ScrollViewer  Margin="0" HorizontalScrollBarVisibility="Disabled" >
        <StackPanel>
            <ItemsControl Grid.Row="0" ItemsSource="{Binding Output, Mode=OneWay}" FontSize="12">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                            <TextBlock TextWrapping="Wrap" Text="{Binding Path=.}" Foreground="White" />
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
            <DockPanel Grid.Row="1" LastChildFill="True">                    
                <TextBox Text="{Binding Input, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" 
                     TextWrapping="Wrap"
                     BorderBrush="{x:Null}" SelectionBrush="{x:Null}" 
                     BorderThickness="0" Width="Auto">
                    <TextBox.InputBindings>
                        <KeyBinding Command="{Binding Path=TextBoxEnter}" Key="Enter" />
                    </TextBox.InputBindings>
                </TextBox>
            </DockPanel>
        </StackPanel>
    </ScrollViewer>
</Grid>

wpf:如何弹出用户控件

可以使用

Popup控件。 将Popup附加到数据网格的当前行，可能当您单击该按钮时，该按钮是创建弹出窗口并将其作为您所在行中某个单元格的子单元格放置的好地方。
然后，您可以将用户控件添加到弹出窗口，然后"显示"弹出窗口。 这样，弹出窗口和用户控件的数据上下文将从数据网格中的包含行继承。

下面是仅使用 XAML 的 Popup 控件的非常简单的实现：

<StackPanel>
  <CheckBox Name="chk1"/>
  <Popup IsOpen="{Binding IsChecked, ElementName=chk1}">
    <Border Background="White">
      <TextBlock Margin="20" Text="I'm Popped Up!"/>
    </Border>
  </Popup>
</StackPanel>

弹出窗口包含在堆栈面板中，但仅在选中复选框时IsOpen可见。 您可以将用户控件放在弹出窗口中，我在其中放置了边框和文本块。由于弹出窗口是堆栈面板的成员，因此如果它没有自己的数据上下文，它会自动使用堆栈面板的数据上下文。

在您的实例中，我显示的堆栈面板类似于您的 DataGrid 行。

好吧，我只想对Gate Lumas的评论发表评论，但系统不允许我这样做，所以我把它作为答案。

XAML 弹出示例：链接存档 |原始链接

如果下载该示例并查看 Senario1 的 .xaml 和 .cs 文件，您将获得有关如何使用和实现弹出窗口的完美示例。 或者，您可以只浏览网站上的代码，但我发现能够运行示例并与之交互比仅查看代码更有帮助。

相关文章：