Question

我正在xaml中编写一个datepicker样式日历弹出窗口由日期选择器的文本框旁边的日历按钮切换我希望日历在点击/触摸文本框时也会切换

向日期选择器样式添加事件触发器时，日历会在触摸文本框时切换，但仅在鼠标单击时显示并保持打开状态，单击/触摸日期选择器日历按钮时，日历会立即打开和关闭。

<EventTrigger RoutedEvent="TextBox.PreviewMouseDown">
<EventTrigger.Actions>
    <BeginStoryboard x:Name="myBeginStoryboard">
        <Storyboard x:Name="myStoryboard">
            <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="IsDropDownOpen">
                <DiscreteBooleanKeyFrame KeyTime="00:00:00"
                                         Value="True" />
            </BooleanAnimationUsingKeyFrames>
        </Storyboard>
    </BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>

我的问题：

有没有比使用事件触发器更好的方法来实现所需的行为？
触摸控件时日历如何显示和隐藏，而事件触发器仅设置日历可见？
是否可以在xaml中为此属性指定反转的“IsDropDownOpen”值？
或者是否可以在xaml中使用条件语句（如果？）来处理隐藏和显示？

Answer 1

忘掉EventTrigger因为它没有给你足够的控制权。不要使用它，只需在视图模型或代码后面添加bool IsDropDownOpen属性，并将其绑定到DatePicker.IsDropDownOpen属性。这样，您可以随时随地打开和关闭Popup和/或响应任何单个事件或事件集合。例如：

public void TextBoxPreviewMouseDown(object sender, MouseButtonEventArgs e)
{
    IsDropDownOpen = true;
}

private void TextBoxPreviewTouchDown(object sender, TouchEventArgs e)
{
    IsDropDownOpen = true;
}

private void DatePickerSelectedDateChanged(object sender, SelectionChangedEventArgs e)
{
    IsDropDownOpen = false;
}

Answer 2

认为你正在使用错误的事件。您需要深入查看DatePicker中的PART_TextBox事件PreviewMouseLeftButtonUp。下面的代码为您的DatePicker命名为日期您需要为所需的任何其他事件添加此逻辑。

NB如果使用MVVM实践处理，这也会更优雅

    private void PART_TextBox_PreviewMouseLeftButtonUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
    {
        if (Date.IsDropDownOpen)
            Date.IsDropDownOpen = false;
        else
            Date.IsDropDownOpen = true;
    }

Answer 3

使用Blend为datepicker创建一个控件模板“DatePickerControlTemplate1”，然后找到x：Name =“PART_TextBox”。你可以在MouseEnter和MouseLeftButtonDown上使用EventTriggers或在LeftClick上使用InputBinding

                <DatePickerTextBox x:Name="PART_TextBox" Grid.Column="0" Focusable="{TemplateBinding Focusable}" HorizontalContentAlignment="Stretch" Grid.Row="0" VerticalContentAlignment="Stretch" Style="{StaticResource BlueTextBoxStyle}">
                    <TextBox.InputBindings>
                        <MouseBinding Gesture="LeftClick" Command="{Binding ShowCalendarCommand}" />
                    </TextBox.InputBindings>
                    <i:Interaction.Triggers>
                        <i:EventTrigger EventName="MouseEnter">
                            <cmd:EventToCommand Command="{Binding ShowCalendarCommand}" PassEventArgsToCommand="True" />
                        </i:EventTrigger>
                        <i:EventTrigger EventName="MouseLeftButtonDown">
                            <cmd:EventToCommand Command="{Binding ShowCalendarCommand}" PassEventArgsToCommand="True" />
                        </i:EventTrigger>
                    </i:Interaction.Triggers>
                 </DatePickerTextBox>

MVVM XAML：

    <DatePicker IsDropDownOpen="{Binding ShowCalendar}" Template="{StaticResource DatePickerControlTemplate1}"/>

视图模型：

    private bool _showCalendar = false;
    public bool ShowCalendar
    {
        get
        {
            return _showCalendar;
        }
        set
        {
            if (_showCalendar != value)
            {
                _showCalendar = value;
                RaisePropertyChanged(() => ShowCalendar);
            }
        }
    }

    public RelayCommand ShowCalendarCommand { get; private set; }

    ShowCalendarCommand = new RelayCommand(ExecuteShowCalendarCommand);

    private void ExecuteShowCalendarCommand()
    {
        ShowCalendar = true;
    }

不幸的是，由于日历没有焦点，它将关闭，除非你在弹出窗口的DatePicker控件模板中设置StaysOpen =“true”

“PART_Popup”：

    <Popup x:Name="PART_Popup" AllowsTransparency="True" Placement="Bottom" StaysOpen="true" />

单击/触摸PART_Textbox时切换日期选择器日历

3 个答案: