qhmes/yy-admin-master/YY.Admin/Controls/DateTimeListPicker.xaml

<UserControl x:Class="YY.Admin.Controls.DateTimeListPicker"
             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"
             xmlns:hc="https://handyorg.github.io/handycontrol"
             x:Name="Root"
             mc:Ignorable="d"
             d:DesignHeight="32" d:DesignWidth="220">

    <UserControl.Resources>
        <!-- 时/分/秒 列表项样式：紧凑高亮，鼠标悬浮浅蓝 -->
        <Style x:Key="DTLP_TimeListBoxItemStyle" TargetType="ListBoxItem">
            <Setter Property="Padding" Value="0"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBoxItem">
                        <Border x:Name="Bd" Background="{TemplateBinding Background}" Padding="0">
                            <ContentPresenter HorizontalAlignment="Stretch"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="Bd" Property="Background" Value="#EAF3FF"/>
                            </Trigger>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="Bd" Property="Background" Value="#1E88E5"/>
                                <Setter Property="Foreground" Value="White"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- 时/分/秒 列表通用样式 -->
        <Style x:Key="DTLP_TimeListBoxStyle" TargetType="ListBox">
            <Setter Property="BorderThickness" Value="1,0,0,0"/>
            <Setter Property="BorderBrush" Value="#EEEEEE"/>
            <Setter Property="Width" Value="56"/>
            <Setter Property="Height" Value="200"/>
            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden"/>
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
            <Setter Property="ItemContainerStyle" Value="{StaticResource DTLP_TimeListBoxItemStyle}"/>
        </Style>

        <!-- 文本框右侧日历图标按钮 -->
        <Style x:Key="DTLP_IconToggleStyle" TargetType="ToggleButton">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="Cursor" Value="Hand"/>
            <Setter Property="Focusable" Value="False"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Border Background="{TemplateBinding Background}" Padding="2">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="#F2F6FA"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>

    <Grid>
        <!-- 顶部：TextBox + 日历图标按钮（合一外观） -->
        <Grid>
            <hc:TextBox x:Name="PART_TextBox"
                        Text="{Binding DisplayText, ElementName=Root, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                        hc:InfoElement.Placeholder="{Binding Placeholder, ElementName=Root}"
                        Padding="6,4,28,4"
                        VerticalContentAlignment="Center"
                        KeyDown="OnTextBoxKeyDown"
                        LostFocus="OnTextBoxLostFocus"/>

            <ToggleButton x:Name="PART_Toggle"
                          HorizontalAlignment="Right" VerticalAlignment="Center"
                          Width="24" Height="24" Margin="0,0,4,0"
                          Style="{StaticResource DTLP_IconToggleStyle}"
                          IsChecked="{Binding IsDropDownOpen, ElementName=Root, Mode=TwoWay}">
                <Path Width="14" Height="14" Stretch="Uniform" Fill="#888888"
                      Data="M19,4H17V3a1,1,0,0,0-2,0V4H9V3A1,1,0,0,0,7,3V4H5A2,2,0,0,0,3,6V20a2,2,0,0,0,2,2H19a2,2,0,0,0,2-2V6A2,2,0,0,0,19,4Zm0,16H5V10H19ZM5,8V6H7V7A1,1,0,0,0,9,7V6h6V7a1,1,0,0,0,2,0V6h2V8Z"/>
            </ToggleButton>
        </Grid>

        <!-- 弹出层 -->
        <Popup x:Name="PART_Popup"
               IsOpen="{Binding IsDropDownOpen, ElementName=Root, Mode=TwoWay}"
               PlacementTarget="{Binding ElementName=PART_TextBox}"
               Placement="Bottom" VerticalOffset="2"
               StaysOpen="False"
               AllowsTransparency="True"
               PopupAnimation="Fade">
            <Border Background="White"
                    BorderBrush="#DCDCDC" BorderThickness="1"
                    Padding="8"
                    SnapsToDevicePixels="True">
                <Border.Effect>
                    <DropShadowEffect Color="#80000000" BlurRadius="10" ShadowDepth="2" Opacity="0.25"/>
                </Border.Effect>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>

                    <!-- 上：日历 + 时/分/秒三列 -->
                    <Grid Grid.Row="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>

                        <Calendar x:Name="PART_Calendar" Grid.Column="0"
                                  SelectedDate="{Binding PendingDate, ElementName=Root, Mode=TwoWay}"
                                  DisplayDate="{Binding PendingDate, ElementName=Root, Mode=OneWay}"
                                  Margin="0,0,4,0"/>

                        <ListBox x:Name="PART_HourList" Grid.Column="1"
                                 Style="{StaticResource DTLP_TimeListBoxStyle}"
                                 ItemsSource="{Binding Hours, ElementName=Root}"
                                 SelectedItem="{Binding PendingHour, ElementName=Root, Mode=TwoWay}">
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding StringFormat={}{0:00}}"
                                               TextAlignment="Center" Padding="0,4"
                                               FontSize="13"/>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>

                        <ListBox x:Name="PART_MinuteList" Grid.Column="2"
                                 Style="{StaticResource DTLP_TimeListBoxStyle}"
                                 ItemsSource="{Binding Minutes, ElementName=Root}"
                                 SelectedItem="{Binding PendingMinute, ElementName=Root, Mode=TwoWay}">
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding StringFormat={}{0:00}}"
                                               TextAlignment="Center" Padding="0,4"
                                               FontSize="13"/>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>

                        <ListBox x:Name="PART_SecondList" Grid.Column="3"
                                 Style="{StaticResource DTLP_TimeListBoxStyle}"
                                 ItemsSource="{Binding Seconds, ElementName=Root}"
                                 SelectedItem="{Binding PendingSecond, ElementName=Root, Mode=TwoWay}">
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding StringFormat={}{0:00}}"
                                               TextAlignment="Center" Padding="0,4"
                                               FontSize="13"/>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </Grid>

                    <!-- 下：此刻 / 确定 -->
                    <Border Grid.Row="1" BorderThickness="0,1,0,0" BorderBrush="#EEEEEE" Margin="0,6,0,0" Padding="0,6,0,0">
                        <DockPanel LastChildFill="False">
                            <Button DockPanel.Dock="Left" Content="此刻"
                                    Click="OnNowClick"
                                    Background="Transparent" BorderThickness="0"
                                    Foreground="#1E88E5" Cursor="Hand"
                                    Padding="4,2" FontSize="12"
                                    ToolTip="一键回填当前时间"/>
                            <Button DockPanel.Dock="Right" Content="确定"
                                    Click="OnConfirmClick"
                                    Background="#1E88E5" Foreground="White"
                                    BorderThickness="0"
                                    Padding="16,4" Cursor="Hand" FontSize="12"/>
                        </DockPanel>
                    </Border>
                </Grid>
            </Border>
        </Popup>
    </Grid>
</UserControl>