DevExpress——PopupContainer的需求實現

專案中有這樣一個需求，即就是頁面上已經佈局好了，但突然需要加一點東西，且不能影響整體的佈局，那怎麼解決呢？建議您考慮使用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；

}

點選確定事件，拿到選擇的日期值進行之後的計算。最終在專案中的效果如下圖所示：

實現效果

都讀到這了，點個關注再走唄！