DHTMLX Scheduler是一個(gè)類(lèi)似于Google日歷的JavaScript日程安排控件，日歷事件通過(guò)Ajax動(dòng)態(tài)加載，支持通過(guò)拖放功能調(diào)整事件日期和時(shí)間，事件可以按天、周、月三個(gè)種視圖顯示。

備受關(guān)注的DHTMLX Scheduler 7.0版本日前正式發(fā)布了，如果說(shuō)之前的日程組件主要更新關(guān)注的是項(xiàng)目?jī)?nèi)部結(jié)構(gòu)，那么這次的新版本則在用戶(hù)界面方面有重大改進(jìn)。

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

主題更新

主題在現(xiàn)代JavaScript庫(kù)的樣式功能中起著至關(guān)重要的作用，但主題的重要性不僅在于使web應(yīng)用更具視覺(jué)吸引力，因?yàn)樗鼈冞€有助于實(shí)現(xiàn)個(gè)性化用戶(hù)體驗(yàn)、增強(qiáng)可訪問(wèn)性、品牌一致性等目標(biāo)。使用JavaScript庫(kù)中包含的主題，web開(kāi)發(fā)人員可以獲得必要的靈活性，以更少的時(shí)間和精力定制UI以滿(mǎn)足各種項(xiàng)目需求。

更新Terrace主題

在v7.0中，Terrace主題經(jīng)歷了一次徹底的改革，實(shí)現(xiàn)與現(xiàn)代設(shè)計(jì)標(biāo)準(zhǔn)一致的、充滿(mǎn)活力的外觀。

Terrace主題目前已經(jīng)更新，更容易定制和解決許多視覺(jué)問(wèn)題。

全新的暗黑主題

在近年來(lái)的頂級(jí)設(shè)計(jì)趨勢(shì)中，您可能會(huì)在列表中找到一個(gè)暗黑主題（或暗黑模式）。深色主題不僅給UI帶來(lái)了現(xiàn)代的外觀，還有助于減少眼睛疲勞，提高可訪問(wèn)性，增強(qiáng)對(duì)內(nèi)容的關(guān)注，并延長(zhǎng)移動(dòng)設(shè)備的電池壽命。因此如果在使用DHTMLX構(gòu)建的JavaScript調(diào)度日歷中缺少此功能，那么有一個(gè)好消息要告訴您，在7.0版本中，我們?cè)?a target="_blank">DHTMLX Scheduler組件的可用內(nèi)置主題列表中添加了dark選項(xiàng)。

使用CSS變量自定義主題

在這個(gè)版本中引入了對(duì)CSS變量的支持，標(biāo)志著主題自定義的重大進(jìn)步。CSS變量(也稱(chēng)為自定義屬性)提供了一種更動(dòng)態(tài)、更有效的樣式化方法，您可以用更少的時(shí)間和精力自定義現(xiàn)有的Scheduler主題。

您可以通過(guò)更改幾個(gè)關(guān)鍵變量輕松地修改Scheduler的外觀，在整個(gè)應(yīng)用程序中更改顏色、字體和其他樣式元素現(xiàn)在可以通過(guò)更少的代碼更改來(lái)完成。

下面是一個(gè)快速示例，向您展示新樣式化方法的好處。對(duì)于開(kāi)發(fā)人員來(lái)說(shuō)，一個(gè)常見(jiàn)的Scheduler定制案例是更改事件顏色。在以前版本的Scheduler組件中，它需要更新特定的樣式，如下所示：

/*event in day or week view*/
.dhx_cal_event.manager_event div{
background-color: #009966 !important;
color: black !important;
}
/*multi-day event in month view*/
.dhx_cal_event_line.manager_event{
background-color: #009966 !important;
color: black !important;
}
/*event with fixed time, in month view*/
.dhx_cal_event_clear.manager_event{
color: black !important;
}

使用DHTMLX Scheduler v7.0，您只需重新定義負(fù)責(zé)事件顏色的CSS變量：

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

現(xiàn)在可以跨Scheduler更快地更改顏色、字體和其他樣式元素。例如，更改JavaScript調(diào)度日歷的配色方案就像重新定義一組顏色變量一樣簡(jiǎn)單。這一變化簡(jiǎn)化了自定義，確保了靈活、可擴(kuò)展的主題開(kāi)發(fā)，從而使開(kāi)發(fā)人員能夠輕松地創(chuàng)建更個(gè)性化的用戶(hù)體驗(yàn)。

新的Agenda（議程）視圖設(shè)置

Agenda視圖是JavaScript調(diào)度庫(kù)中包含的五個(gè)基本選項(xiàng)之一，用于跟蹤所有計(jì)劃的安排。對(duì)于7.0版本，開(kāi)發(fā)團(tuán)隊(duì)推出了一個(gè)完全重新設(shè)計(jì)的Agenda視圖，新的議程視圖的工作原理類(lèi)似于Google Calendar和其他類(lèi)似工具中使用的列表視圖。

雖然舊的議程視圖現(xiàn)在已棄用，但如果在項(xiàng)目中需要，它仍然可用。

更多產(chǎn)品更新，歡迎立即咨詢(xún)“在線(xiàn)客服”！