wpf自定义日历组件库

前言

---

最近在做公司的C#上位机项目，上周没活干，就自定义封装了一个日历组件库，通过vs打包成.dll文件，可以直接引入并使用

组件库版本：.Net Framework 8.0

1.组件库引入

---

引入命名空间，指定程序集，并给这个引用起一个别名myDateControl，方便在xaml里调用

xmlns:myDateControl="clr-namespace:nofun.control;assembly=CustomDate"

使用组件库中的CustomDate控件， 把这个日历组件放入Popup弹窗控件中，并且通过Border控件来控制弹窗的开闭

<Border
    x:Name="EndDateBorder"
    Grid.Column="3"
    Background="Transparent"
    MouseLeftButtonDown="OpenDatePopup_Click"
    Style="{StaticResource BorderStyle}">
    <Grid>
        <TextBlock
            x:Name="endDateText2"
            Margin="12,0,0,0"
            HorizontalAlignment="Left"
            Style="{StaticResource TextBlockStyle}"
            Text="结束日期">
        </TextBlock>

        <Path Style="{StaticResource Triangle}">
        </Path>
    </Grid>
</Border>

<Popup
    x:Name="EndDatePopup"
    Closed="EndDatePopup_Closed"
    Placement="Bottom"
    PlacementTarget="{Binding ElementName=EndDateBorder}"
    VerticalOffset="5">
    <myDateControl:CustomDate x:Name="MyCalendar" />
</Popup>

2.编写控件逻辑

---

给Popup弹窗控件绑定事件

// 打开和关闭弹窗
private void OpenDatePopup_Click(object sender, MouseButtonEventArgs e)
{
    EndDatePopup.IsOpen = !EndDatePopup.IsOpen;
}
// 关闭弹窗后重置日历控件的视图
private void EndDatePopup_Closed(object sender, EventArgs e)
{
    MyCalendar.ResetData();
}

日历控件中有一个选择日期后会触发的事件，在外部给这个事件订阅获取选中日期的方法

private void MainWindow_Loaded(object sender, RoutedEventArgs e)
{
 // 订阅方法
 MyCalendar.DateSelected += MyCalendar_PropertyChanged;
 // 点击控件外部时，自动关闭弹窗
 this.PreviewMouseDown += (s, e) =>
 {
     if (EndDateBorder.IsMouseOver || EndDatePopup.IsMouseOver) return;
     if (EndDatePopup.IsOpen && !EndDatePopup.IsMouseOver)
     {
         EndDatePopup.IsOpen = false;
     }
 };
}
// 获取日历控件中返回的日期数据
private void MyCalendar_PropertyChanged(object? sender, string selectedDate)
{
     endDateText2.Text = selectedDate;
     endDateText2.FontSize = 16;
     EndDatePopup.IsOpen = false;   
}

---

源码地址：https://github.com/code-cxz/Wpf_CustomDate.git