WPF中Popup控件的使用

一、Popup控件的主要属性

Popup表示具有内容的弹出窗口,其主要属性为:

  1. Child:获取或设置 Popup控件的内容。
  2. IsOpen:获取或设置一个值,该值指示Popup 是否可见
  3. Placement:获取或设置 Popup 控件打开时的控件方向,并指定Popup 控件在与屏幕边界重叠时的控件行为
  4. PlacementTarget:获取或设置当打开 Popup 控件时该控件相对于其放置的元素。
  5. PopupAnimation:获取或设置Popup 控件的打开和关闭动画。
  6. StaysOpen:获取或设置一个值,该值指示当 Popup 控件焦点不再对准时,是否关闭该控件。

Popup主要事件为:

  1. Opened:当IsOpen 属性更改为 true 时发生。

    private void PopupOpening(object sender, EventArgs e) {     //Code to execute when Popup opens } 
  2. Closed:当IsOpen 属性更改为 false 时发生。

    private void PopupClosing(object sender, EventArgs e) {     //Code to execute when Popup closes } 

二、Popup控件使用

我们使用Popup实现一个功能:当文本框获取到焦点时,弹出下拉框,里面选择水果种类,具体效果如下图所示:

20220619_224733_ (1)

相关的界面代码为:

  <Window.Resources>         <x:Array x:Key="MyArray" Type="system1:String">             <system1:String>西瓜</system1:String>             <system1:String>葡萄</system1:String>             <system1:String>芒果</system1:String>             <system1:String>猕猴桃</system1:String>         </x:Array>     </Window.Resources>     <Grid Margin="20">         <Grid.ColumnDefinitions>             <ColumnDefinition Width="*"></ColumnDefinition>             <ColumnDefinition Width="100"></ColumnDefinition>         </Grid.ColumnDefinitions>         <TextBox Grid.Column="0"  Height="30" BorderThickness="1"                   VerticalContentAlignment="Center"                  Padding="10,0"                  x:Name="TestTextBox"                  ToolTip="{StaticResource MyArray}">         </TextBox>         <Button Grid.Column="1" Content="搜索" Margin="10,0" Height="30" Click="ButtonBase_OnClick"></Button>         <Popup Grid.Column="0"                AllowsTransparency="True"                PopupAnimation="Slide"                PlacementTarget="{Binding ElementName=TestTextBox}"                Placement="Bottom"                Width="{Binding ElementName=TestTextBox, Path=ActualWidth}"                IsOpen="{Binding ElementName=TestTextBox, Path=IsKeyboardFocused, Mode=OneWay}">             <ListBox ItemsSource="{Binding ElementName=TestTextBox, Path=ToolTip}"                      SelectedItem="{Binding ElementName=TestTextBox, Path=Text, Mode=OneWayToSource}"></ListBox>         </Popup>     </Grid> 

为了,让Popup控件能够跟随目标控件移动,需要增加一个工具类,具体如下所示:

 public class PopupHelper     {         /// <summary>         /// 附加属性:跟随放置控件而移动         /// </summary>         public static readonly DependencyProperty PopupPlacementTargetProperty = DependencyProperty.RegisterAttached("PopupPlacementTarget", typeof(DependencyObject), typeof(PopupHelper), new PropertyMetadata(null, OnPopupPlacementTargetChanged));          public static DependencyObject GetPopupPlacementTarget(DependencyObject obj)         {             return (DependencyObject)obj.GetValue(PopupPlacementTargetProperty);         }         public static void SetPopupPlacementTarget(DependencyObject obj, DependencyObject value)         {             obj.SetValue(PopupPlacementTargetProperty, value);         }          private static void OnPopupPlacementTargetChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)         {             if (d is System.Windows.Controls.Primitives.Popup pop && e.NewValue is DependencyObject placementTarget)             {                 var window = Window.GetWindow(placementTarget);                 if (window != null)                 {                     window.LocationChanged += delegate                     {                         var mi = typeof(System.Windows.Controls.Primitives.Popup).GetMethod("UpdatePosition", System.Reflection.BindingFlags.NonPublic | System.Reflection.BindingFlags.Instance);                         mi?.Invoke(pop, null);                     };                 }             }         }     } 

该附加属性的使用如下所示:

 <Popup local:PopupHelper.PopupPlacementTarget="{Binding ElementName=TestTextBox}"></Popup> 

商匡云商
Logo
注册新帐户
对比商品
  • 合计 (0)
对比
0
购物车