项目中有这样一个需求,即就是页面上已经布局好了,但突然需要加一点东西,且不能影响整体的布局,那怎么解决呢?建议您考虑使用PopupContainerEdit控件,具体需求如下:

打开网易新闻 查看更多图片

需求界面

需求实现:

  • 新建一个form页面,然后在页面上拖拽一个CheckEdit、PopupContainerEdit、PopupContainerControl控件,在PopupContainerControl面板上添加选择日期的控件DateEdit,添加了两个按钮SimpleButton。效果如下图所示:

打开网易新闻 查看更多图片

页面布局

  • 设置PopupContainerEdit的两个属性,一个PopupControl属性选择PopupContainerControl,设置Visiable属性为false。
  • 设置CheckBox的选择事件,代码写为:

private void CheckEdit1_CheckStateChanged(object sender, EventArgs e){ if (this.checkEdit1.CheckState == CheckState.Checked) { this.popupContainerEdit1.Visible = true; return; } this.popupContainerEdit1.Visible = false;}

  • 设置PopupContainerEdit的点击事件,更新日期的选择格式

void popupContainerEdit1_Click(object sender, EventArgs e){ this.dateEdit_start.Visible = true; this.dateEdit_start.Properties.ShowToday = false; this.dateEdit_start.Properties.ShowMonthHeaders = false; this.dateEdit_start.Properties.VistaCalendarInitialViewStyle = DevExpress.XtraEditors.VistaCalendarInitialViewStyle.YearView; this.dateEdit_start.Properties.VistaCalendarViewStyle = DevExpress.XtraEditors.VistaCalendarViewStyle.YearView; this.dateEdit_start.Properties.Mask.EditMask = "yyyy/MM/dd"; this.dateEdit_start.Properties.Mask.UseMaskAsDisplayFormat = true; this.dateEdit_end.Visible = true; this.dateEdit_end.Properties.ShowToday = false; this.dateEdit_end.Properties.ShowMonthHeaders = false; this.dateEdit_end.Properties.VistaCalendarInitialViewStyle = DevExpress.XtraEditors.VistaCalendarInitialViewStyle.YearView; this.dateEdit_end.Properties.VistaCalendarViewStyle = DevExpress.XtraEditors.VistaCalendarViewStyle.YearView; this.dateEdit_end.Properties.Mask.EditMask = "yyyy/MM/dd"; this.dateEdit_end.Properties.Mask.UseMaskAsDisplayFormat = true;}

  • 点击确定事件,拿到选择的日期值进行之后的计算。最终在项目中的效果如下图所示:

打开网易新闻 查看更多图片

实现效果

都读到这了,点个关注再走呗!