翻譯|產(chǎn)品更新|編輯:龔雪|2024-04-10 11:01:36.553|閱讀 131 次
概述:本文將為大家介紹日程安排組件DHTMLX Scheduler v7.0的新版亮點,歡迎下載最新版組件體驗!
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
DHTMLX Scheduler是一個類似于Google日歷的JavaScript日程安排控件,日歷事件通過Ajax動態(tài)加載,支持通過拖放功能調(diào)整事件日期和時間,事件可以按天、周、月三個種視圖顯示。
備受關(guān)注的DHTMLX Scheduler 7.0版本日前正式發(fā)布了,如果說之前的日程組件主要更新關(guān)注的是項目內(nèi)部結(jié)構(gòu),那么這次的新版本則在用戶界面方面有重大改進。
首先,這個主要更新顯著增強了樣式功能,包括重寫的Scheduler主題、簡化的使用CSS變量的主題自定義、更新的默認Terrace主題、新的Dark主題以及其他有用的更改。此外還可以看到更新的Agenda視圖,它提供了一種顯示即將發(fā)生事件列表的新方法等。
主題在現(xiàn)代JavaScript庫的樣式功能中起著至關(guān)重要的作用,但主題的重要性不僅在于使web應(yīng)用更具視覺吸引力,因為它們還有助于實現(xiàn)個性化用戶體驗、增強可訪問性、品牌一致性等目標。使用JavaScript庫中包含的主題,web開發(fā)人員可以獲得必要的靈活性,以更少的時間和精力定制UI以滿足各種項目需求。
在v7.0中,Terrace主題經(jīng)歷了一次徹底的改革,實現(xiàn)與現(xiàn)代設(shè)計標準一致的、充滿活力的外觀。
Terrace主題目前已經(jīng)更新,更容易定制和解決許多視覺問題。
在近年來的頂級設(shè)計趨勢中,您可能會在列表中找到一個暗黑主題(或暗黑模式)。深色主題不僅給UI帶來了現(xiàn)代的外觀,還有助于減少眼睛疲勞,提高可訪問性,增強對內(nèi)容的關(guān)注,并延長移動設(shè)備的電池壽命。因此如果在使用DHTMLX構(gòu)建的JavaScript調(diào)度日歷中缺少此功能,那么有一個好消息要告訴您,在7.0版本中,我們在DHTMLX Scheduler組件的可用內(nèi)置主題列表中添加了dark選項。
在這個版本中引入了對CSS變量的支持,標志著主題自定義的重大進步。CSS變量(也稱為自定義屬性)提供了一種更動態(tài)、更有效的樣式化方法,您可以用更少的時間和精力自定義現(xiàn)有的Scheduler主題。
您可以通過更改幾個關(guān)鍵變量輕松地修改Scheduler的外觀,在整個應(yīng)用程序中更改顏色、字體和其他樣式元素現(xiàn)在可以通過更少的代碼更改來完成。
下面是一個快速示例,向您展示新樣式化方法的好處。對于開發(fā)人員來說,一個常見的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,您只需重新定義負責(zé)事件顏色的CSS變量:
.manager_event {
--dhx-scheduler-event-background: #009966;
--dhx-scheduler-event-color: black;
}
現(xiàn)在可以跨Scheduler更快地更改顏色、字體和其他樣式元素。例如,更改JavaScript調(diào)度日歷的配色方案就像重新定義一組顏色變量一樣簡單。這一變化簡化了自定義,確保了靈活、可擴展的主題開發(fā),從而使開發(fā)人員能夠輕松地創(chuàng)建更個性化的用戶體驗。
Agenda視圖是JavaScript調(diào)度庫中包含的五個基本選項之一,用于跟蹤所有計劃的安排。對于7.0版本,開發(fā)團隊推出了一個完全重新設(shè)計的Agenda視圖,新的議程視圖的工作原理類似于Google Calendar和其他類似工具中使用的列表視圖。
雖然舊的議程視圖現(xiàn)在已棄用,但如果在項目中需要,它仍然可用。
更多產(chǎn)品更新,歡迎立即咨詢“在線客服”!
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請郵件反饋至chenjj@ke049m.cn
文章轉(zhuǎn)載自:慧都網(wǎng)