日程安排組件DHTMLX Scheduler v7.0新版亮點 - 擁有多種全新的主題

DHTMLX Scheduler是一個類似於Google日曆的JavaScript日程安排控件,日曆事件通過Ajax動態加載,支持通過拖放功能調整事件日期和時間,事件可以按天、周、月三個種視圖顯示。

備受關注的DHTMLX Scheduler 7.0版本日前正式發佈了,如果說之前的日程組件主要更新關注的是項目內部結構,那麼這次的新版本則在用戶界面方面有重大改進。

首先,這個主要更新顯著增強了樣式功能,包括重寫的Scheduler主題、簡化的使用CSS變量的主題自定義、更新的默認Terrace主題、新的Dark主題以及其他有用的更改。此外還可以看到更新的Agenda視圖,它提供了一種顯示即將發生事件列表的新方法等。

主題更新

主題在現代JavaScript庫的樣式功能中起着至關重要的作用,但主題的重要性不僅在於使web應用更具視覺吸引力,因爲它們還有助於實現個性化用戶體驗、增強可訪問性、品牌一致性等目標。使用JavaScript庫中包含的主題,web開發人員可以獲得必要的靈活性,以更少的時間和精力定製UI以滿足各種項目需求。

更新Terrace主題

在v7.0中,Terrace主題經歷了一次徹底的改革,實現與現代設計標準一致的、充滿活力的外觀。

DevExpress WinForms v23.2新版產品圖集

Terrace主題目前已經更新,更容易定製和解決許多視覺問題。

全新的暗黑主題

在近年來的頂級設計趨勢中,您可能會在列表中找到一個暗黑主題(或暗黑模式)。深色主題不僅給UI帶來了現代的外觀,還有助於減少眼睛疲勞,提高可訪問性,增強對內容的關注,並延長移動設備的電池壽命。因此如果在使用DHTMLX構建的JavaScript調度日曆中缺少此功能,那麼有一個好消息要告訴您,在7.0版本中,我們在DHTMLX Scheduler組件的可用內置主題列表中添加了dark選項。

DevExpress WinForms v23.2新版產品圖集

使用CSS變量自定義主題

在這個版本中引入了對CSS變量的支持,標誌着主題自定義的重大進步。CSS變量(也稱爲自定義屬性)提供了一種更動態、更有效的樣式化方法,您可以用更少的時間和精力自定義現有的Scheduler主題。

您可以通過更改幾個關鍵變量輕鬆地修改Scheduler的外觀,在整個應用程序中更改顏色、字體和其他樣式元素現在可以通過更少的代碼更改來完成。

下面是一個快速示例,向您展示新樣式化方法的好處。對於開發人員來說,一個常見的Scheduler定製案例是更改事件顏色。在以前版本的Scheduler組件中,它需要更新特定的樣式,如下所示:

使用DHTMLX Scheduler v7.0,您只需重新定義負責事件顏色的CSS變量:

.manager_event {
--dhx-scheduler-event-background: #009966;
--dhx-scheduler-event-color: black;
}

現在可以跨Scheduler更快地更改顏色、字體和其他樣式元素。例如,更改JavaScript調度日曆的配色方案就像重新定義一組顏色變量一樣簡單。這一變化簡化了自定義,確保了靈活、可擴展的主題開發,從而使開發人員能夠輕鬆地創建更個性化的用戶體驗。

DevExpress WinForms v23.2新版產品圖集

新的Agenda(議程)視圖設置

Agenda視圖是JavaScript調度庫中包含的五個基本選項之一,用於跟蹤所有計劃的安排。對於7.0版本,開發團隊推出了一個完全重新設計的Agenda視圖,新的議程視圖的工作原理類似於Google Calendar和其他類似工具中使用的列表視圖。

DevExpress WinForms v23.2新版產品圖集

雖然舊的議程視圖現在已棄用,但如果在項目中需要,它仍然可用。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章