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

Question

先稍微解释一下：

这是Popup element

的源代码

这是使用 Popup 的例子 DatePicker and it's xaml

我试过像这样在空 window 上使用这个例子

这是结果：

所以我想创建一个 OK/Cancel 选择面板并使用 DateTimePicker Pop 和 Select 你想要什么并接受或中止选择。

如何创建这样一个简单的自定义选择器。

Answer 1

编辑：这是我的 DateTimePicker 和屏幕截图

点按后

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

第 1 步：创建演示者 class 以管理弹出窗口的控件和事件。（比如 DatePickerPresenter

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

  }
}

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

<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>

哒哒哒！

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

Avalonia How To Create Custom Popup

avaloniaui

avalonia