Avalonia 如何创建自定义弹出窗口

Posted 2023-04-12

【中文标题】Avalonia 如何创建自定义弹出窗口

【英文标题】：Avalonia How To Create Custom Popup

【发布时间】：2021-12-15 06:46:17

【问题描述】：

先解释一下：

这是Popup element的源代码

这是使用 Popup DatePicker 和 it's xaml 的示例

我试过在这样的空窗口上使用这个例子

结果如下：

所以我想创建一个确定/取消选择面板并使用 DateTimePicker Pop 并选择您想要的内容并接受或中止选择。

我怎样才能像这样创建一个简单的自定义选择器。

【参考方案1】：

编辑：这是我的DateTimePicker 和截图

点击后

好的，我分析了几个小时的现有代码。答案很简单：

第 1 步：创建一个演示者类来管理您的控件和弹出事件。 （如DatePickerPresenter

namespace AvaloniaTest.Views 
  public class SabriPresenter : PickerPresenterBase
  
  ...

  

第 2 步：在您的窗口或资源中为该演示者创建模板。

<Window xmlns="bla bla bla"
        xmlns:v="using:AvaloniaTest.Views"
        Title="AvaloniaTest">

  <Design.DataContext>
    <vm:MainWindowViewModel/>
  </Design.DataContext>

  <Window.Styles>
    <Style Selector="v|SabriPresenter" >
      <Setter Property="Template">
        <ControlTemplate>
          <Grid Background="AliceBlue">
            <Grid.ColumnDefinitions>
              <ColumnDefinition Width="100"/>
              <ColumnDefinition Width="100"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
              <RowDefinition Height="100"/>
              <RowDefinition Height="20"/>
            </Grid.RowDefinitions>
            <Panel Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2">
              <TextBlock Text="Your content..."/>
            </Panel>
            <Button Grid.Column="0" Grid.Row="0" Content="OK"/>
            <Button Grid.Column="1" Grid.Row="0" Content="Cancel"/>
          </Grid>
        </ControlTemplate>
      </Setter>
    </Style>
  </Window.Styles>
</Window>

第 3 步：随时随地使用此演示者

<Window xmlns="bla bla"
        xmlns:v="using:AvaloniaTest.Views"
        >
  <StackPanel Orientation="Vertical" VerticalAlignment="Center">
    <TextBlock Text="Binding Greeting" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    <Button Content="Popeye"  Name="sabri"/>
    <Popup Name="Popup"
           WindowManagerAddShadowHint="False"
           StaysOpen="False"
           PlacementMode="Bottom"
           PlacementTarget="Binding ElementName=sabri"
           >
      <v:SabriPresenter />
    </Popup>
  </StackPanel>
</Window>

哒哒！