当前位置：首页 > news >正文

WPF篇（14）-ProgressBar进度条+Calendar日历控件+DatePicker日期控件

news 2025/7/30 10:47:23

ProgressBar进度条

ProgressBar进度条通常在我们执行某个任务需要花费大量时间时使用，这时可以采用进度条显示任务或线程的执行进度，以便给用户良好的使用体验。

ProgressBar类定义

public class ProgressBar : RangeBase
{public static readonly DependencyProperty IsIndeterminateProperty;public static readonly DependencyProperty OrientationProperty;public ProgressBar();public bool IsIndeterminate { get; set; }public Orientation Orientation { get; set; }public override void OnApplyTemplate();protected override AutomationPeer OnCreateAutomationPeer();protected override void OnMaximumChanged(double oldMaximum, double newMaximum);protected override void OnMinimumChanged(double oldMinimum, double newMinimum);protected override void OnValueChanged(double oldValue, double newValue);}

ProgressBar自身只有两个属性，分别是IsIndeterminate和Orientation 。

IsIndeterminate属性：如果为true，表示以动画从左到右滑动的方式展示进度效果。
Orientation属性：表示进度条的方式，水平时从左至右增长，垂直时从下到上增长。

ProgressBar案例

前端

    <StackPanel VerticalAlignment="Center"><ProgressBar x:Name="_ProgressBar" IsIndeterminate="False"  Value="50" Minimum="0" Maximum="100" Orientation="Horizontal" Height="10" Margin="15"/><TextBlock x:Name="_TextBlock" Text="50%" HorizontalAlignment="Center"/></StackPanel>

后端

 public partial class MainWindow{public MainWindow(){InitializeComponent();Loaded += (s, e) =>{Task.Factory.StartNew(() =>{for (int i = 0; i <= 100; i++){Dispatcher.Invoke(() => {_TextBlock.Text = $"{i}%";_ProgressBar.Value = i;});Task.Delay(25).Wait();}});};}}

在这里插入图片描述

Calendar日历控件

Calendar提供一个日历界面，供用户选择日期，它继承于Control基类。

属性成员

DisplayDateStart：获取或设置可在日历中的第一个日期。
CalendarItemStyle：获取或设置CalendarItem的样式
CalendarDayButtonStyle：获取或设置CalendarDayButton的样式
CalendarButtonStyle ：获取或设置CalendarButton的样式
BlackoutDates：获取标记为不可选择的日期的集合。
DisplayMode：获取或设置一个值，该值指示是否日历显示月、年或十年。
DisplayDateEnd：获取或设置可在日历中的日期范围内的最后日期。
IsTodayHighlighted：获取或设置一个值，该值指示是否突出显示当前日期。默认true。
SelectedDate：获取或设置当前选定的日期。[重要]
SelectedDates：获取选定日期的集合。
SelectionMode：获取或设置一个值，指示允许包含什么样的选择。如果是多选的号，就可以从SelectedDates属性获取所有已选的日期。
DisplayDate：获取或设置要显示的日期。
FirstDayOfWeek：获取或设置在一天中被视为周的开始。

事件成员

SelectedDatesChanged：开启多选后，当所选集合的元素数量发生变化时引发。
DisplayDateChanged：DisplayDate属性被修改后引发。
SelectionModeChanged：SelectionMode属性（选择模式）发生改变后引发。
DisplayModeChanged：DisplayMode属性（显示模式）发生改变后引发。

Calendar示例

前端代码

    <StackPanel HorizontalAlignment="Center" Margin="30"><Calendar x:Name="_Calendar" HorizontalAlignment="Left" VerticalAlignment="Top"Margin="0,15" DisplayDateStart="2020/1/1 00:00:00"DisplayDateEnd="2030/1/1 00:00:00"SelectionMode="MultipleRange"/><Button Content="选择" Click="Button_Click"/></StackPanel>

后端代码

        private void Button_Click(object sender, RoutedEventArgs e){var list = _Calendar.SelectedDates;var current = _Calendar.SelectedDate;MessageBox.Show($"当前日期数量:{list.Count},当前日期：{current}");}

在这里插入图片描述

DatePicker日期控件

DatePicker与Calender在某些属性上很相似，只是为了方便显示和操作，DatePicker将Calender进行了封装。

属性成员

BlackoutDates：获取或设置为不可选择的日期的标记集合。不常用。
DisplayDateStart：获取或设置要显示的第一个日期。
DisplayDateEnd：获取或设置要显示的最后日期。
DisplayDate：获取或设置要显示的日期。
CalendarStyle：获取或设置呈现日历时所使用的样式。
IsTodayHighlighted：获取或设置一个值，该值指示是否将突出显示当前日期。
IsDropDownOpen：获取或设置一个值，该值指示Calendar 下拉列表是打开还是关闭。
SelectedDateFormat：获取或设置用于显示所选的日期的格式。
Text：获取DatePicker显示文本，或设置选定的日期
FirstDayOfWeek：获取或设置在一天中被视为周的开始。
SelectedDate：获取或设置当前选定的日期。
HasEffectiveKeyboardFocus：获取一个值，该值指示DatePicker 是否具有焦点。

事件成员

CalendarClosed：DatePicker下拉列表关闭时引发此事件
CalendarOpened：DatePicker下拉列表打开时引发此事件
SelectedDateChanged：SelectedDate属性发生改变时引发此事件
DateValidationError：当Text属性不是日期形式的字符串时引发此事件

DatePicker示例

前端代码

    <StackPanel HorizontalAlignment="Center" Margin="30" VerticalAlignment="Center"><StackPanel Orientation="Horizontal" Margin="10"><TextBlock Text="开始日期" VerticalAlignment="Center" Margin="10,0"/><DatePicker x:Name="_DatePickerStart" VerticalAlignment="Center" Width="120"/></StackPanel><StackPanel Orientation="Horizontal" Margin="10"><TextBlock Text="结束日期" VerticalAlignment="Center" Margin="10,0"/><DatePicker x:Name="_DatePickerEnd" VerticalAlignment="Center" Width="120"/></StackPanel><Button Content="查询" Click="Button_Click" Margin="10,0"/></StackPanel>

后端代码

        private void Button_Click(object sender, RoutedEventArgs e){var selectedDate = $"查询日期:{_DatePickerStart.SelectedDate} {_DatePickerEnd.SelectedDate}\r\n";var text = $"文本值:{_DatePickerStart.Text} {_DatePickerEnd.Text}";MessageBox.Show($"{selectedDate} {text}");}