R3 2023版本在Kendo UI for jQuery套件中引入了許多改進(jìn)，其中包括多個(gè)主題上的新組件、特性和改進(jìn)。其中一個(gè)重要的新增功能是DockManager組件，本文將話一些時(shí)間與大家討論一下它的功能！

P.S：Kendo UI for jQuery提供了在短時(shí)間內(nèi)構(gòu)建現(xiàn)代Web應(yīng)用程序所需的一切，從眾多UI子控件中選擇，并將它們組合起來(lái)，創(chuàng)建酷炫響應(yīng)式的應(yīng)用程序，同時(shí)能最大限度的加快開(kāi)發(fā)時(shí)間。

Kendo UI for jQuery R3 2023新版下載

DockManager簡(jiǎn)介

Kendo UI for jQuery DockManager組件旨在幫助用戶在Web上重新創(chuàng)建桌面體驗(yàn)，在桌面應(yīng)用程序中復(fù)制dock(以及它們各自的行為)。

它提供了一組豐富的功能來(lái)幫助您顯示內(nèi)容，面板很好地分開(kāi)，可以很容易地通過(guò)固定或拖動(dòng)它們到所需的位置來(lái)重新排列。

我們將在下面的一個(gè)小型集成項(xiàng)目中更多地討論DockManager的實(shí)際應(yīng)用程序。

組件清單

在我們開(kāi)始之前，羅列出了參與項(xiàng)目的Kendo UI組件：

• Kendo UI DockManager (surprise, surprise)
• Kendo Icons

項(xiàng)目攻略

讓我們從顯示帶有幾個(gè)空面板的DockManager開(kāi)始：

在解決方案資源管理器面板中放置一些內(nèi)容：

使用TreeView組件，您可以像使用Visual Studio一樣模擬項(xiàng)目的結(jié)構(gòu)。還可以使用上面的文本框搜索文件或文件夾，并且可以將工具欄中的按鈕想到的任何操作相關(guān)聯(lián)。您還將看到根據(jù)TrueView的項(xiàng)目顯示的Kendo UI圖標(biāo)，但如果您喜歡其他圖標(biāo)庫(kù)，請(qǐng)隨意使用 - 組件將很好地處理它們。

我們繼續(xù)添加一個(gè)ContextMenu。

需要在TreeView中添加、重命名或刪除項(xiàng)？“Add”部分下的“New File”菜單項(xiàng)將添加一個(gè)新的HTML文件，并在左側(cè)面板中打開(kāi)它，新文件夾在所選節(jié)點(diǎn)下添加一個(gè)帶有文件夾圖標(biāo)的項(xiàng)目。

選擇“Delete”選項(xiàng)將從項(xiàng)目樹(shù)中刪除項(xiàng)目，選擇“Rename” 選項(xiàng)將顯示一個(gè)輸入，您可以在其中輸入節(jié)點(diǎn)的新文本。節(jié)點(diǎn)和輸入之間的轉(zhuǎn)換很容易通過(guò)TreeView的模板選項(xiàng)完成，所以不要忘記檢查它。

雙擊文件將在左側(cè)面板中打開(kāi)相關(guān)的虛擬內(nèi)容。

您可以通過(guò)向服務(wù)器發(fā)出請(qǐng)求來(lái)獲取更有意義的內(nèi)容來(lái)增強(qiáng)這一部分，“Add”部分也可以通過(guò)打開(kāi)一個(gè)帶有不同預(yù)定義的文件擴(kuò)展名列表的對(duì)話框來(lái)增強(qiáng)—. cshtml, .html, .cs等。

至此我們結(jié)束解決方案資源管理器部分，在“Console”面板中，有一個(gè)簡(jiǎn)單的Kendo UI Console（控制臺(tái)），它記錄了DockManager的事件發(fā)生。

在服務(wù)器資源管理器面板中，我們有另一個(gè)樹(shù)視圖和工具欄，同樣類似于在Visual Studio中所擁有的。您可以在這里將Toolbar按鈕綁定到服務(wù)器端操作，或者將該面板用于完全不同的目的。

Telerik_KendoUI產(chǎn)品技術(shù)交流群：726377843    歡迎一起進(jìn)群討論