界面控件Kendo UI for jQuery中文教程 - 如何集成全新的DockManager组件

本文主要是介绍界面控件Kendo UI for jQuery中文教程 - 如何集成全新的DockManager组件,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

R3 2023版本在Kendo UI for jQuery套件中引入了许多改进,其中包括多个主题上的新组件、特性和改进。其中一个重要的新增功能是DockManager组件,本文将话一些时间与大家讨论一下它的功能!

P.S:Kendo UI for jQuery提供了在短时间内构建现代Web应用程序所需的一切,从众多UI子控件中选择,并将它们组合起来,创建酷炫响应式的应用程序,同时能最大限度的加快开发时间。

Kendo UI for jQuery R3 2023新版下载(Q技术交流:726377843)

DockManager简介

Kendo UI for jQuery DockManager组件旨在帮助用户在Web上重新创建桌面体验,在桌面应用程序中复制dock(以及它们各自的行为)。

它提供了一组丰富的功能来帮助您显示内容,面板很好地分开,可以很容易地通过固定或拖动它们到所需的位置来重新排列。

我们将在下面的一个小型集成项目中更多地讨论DockManager的实际应用程序。

组件清单

在我们开始之前,罗列出了参与项目的Kendo UI组件:

  • Kendo UI DockManager (surprise, surprise)
  • Kendo UI TreeView
  • Kendo UI ContextMenu
  • Kendo UI Toolbar
  • Kendo UI TextBox
  • Kendo UI TextArea
  • Kendo Icons
项目攻略

让我们从显示带有几个空面板的DockManager开始:

界面控件Kendo UI for jQuery中文教程 - 如何集成全新的DockManager组件

在解决方案资源管理器面板中放置一些内容:

界面控件Kendo UI for jQuery中文教程 - 如何集成全新的DockManager组件

使用TreeView组件,您可以像使用Visual Studio一样模拟项目的结构。还可以使用上面的文本框搜索文件或文件夹,并且可以将工具栏中的按钮想到的任何操作相关联。您还将看到根据TrueView的项目显示的Kendo UI图标,但如果您喜欢其他图标库,请随意使用 - 组件将很好地处理它们。

我们继续添加一个ContextMenu。

界面控件Kendo UI for jQuery中文教程 - 如何集成全新的DockManager组件

需要在TreeView中添加、重命名或删除项?“Add”部分下的“New File”菜单项将添加一个新的HTML文件,并在左侧面板中打开它,新文件夹在所选节点下添加一个带有文件夹图标的项目。

选择“Delete”选项将从项目树中删除项目,选择“Rename” 选项将显示一个输入,您可以在其中输入节点的新文本。节点和输入之间的转换很容易通过TreeView的模板选项完成,所以不要忘记检查它。

双击文件将在左侧面板中打开相关的虚拟内容。

界面控件Kendo UI for jQuery中文教程 - 如何集成全新的DockManager组件

您可以通过向服务器发出请求来获取更有意义的内容来增强这一部分,“Add”部分也可以通过打开一个带有不同预定义的文件扩展名列表的对话框来增强—. cshtml, .html, .cs等。

至此我们结束解决方案资源管理器部分,在“Console”面板中,有一个简单的Kendo UI Console(控制台),它记录了DockManager的事件发生。

界面控件Kendo UI for jQuery中文教程 - 如何集成全新的DockManager组件

在服务器资源管理器面板中,我们有另一个树视图和工具栏,同样类似于在Visual Studio中所拥有的。您可以在这里将Toolbar按钮绑定到服务器端操作,或者将该面板用于完全不同的目的。

这篇关于界面控件Kendo UI for jQuery中文教程 - 如何集成全新的DockManager组件的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/461612

相关文章

Vue3 的 shallowRef 和 shallowReactive:优化性能

大家对 Vue3 的 ref 和 reactive 都很熟悉,那么对 shallowRef 和 shallowReactive 是否了解呢? 在编程和数据结构中,“shallow”(浅层)通常指对数据结构的最外层进行操作,而不递归地处理其内部或嵌套的数据。这种处理方式关注的是数据结构的第一层属性或元素,而忽略更深层次的嵌套内容。 1. 浅层与深层的对比 1.1 浅层(Shallow) 定义

HarmonyOS学习(七)——UI(五)常用布局总结

自适应布局 1.1、线性布局(LinearLayout) 通过线性容器Row和Column实现线性布局。Column容器内的子组件按照垂直方向排列,Row组件中的子组件按照水平方向排列。 属性说明space通过space参数设置主轴上子组件的间距,达到各子组件在排列上的等间距效果alignItems设置子组件在交叉轴上的对齐方式,且在各类尺寸屏幕上表现一致,其中交叉轴为垂直时,取值为Vert

Spring Security 从入门到进阶系列教程

Spring Security 入门系列 《保护 Web 应用的安全》 《Spring-Security-入门(一):登录与退出》 《Spring-Security-入门(二):基于数据库验证》 《Spring-Security-入门(三):密码加密》 《Spring-Security-入门(四):自定义-Filter》 《Spring-Security-入门(五):在 Sprin

JS常用组件收集

收集了一些平时遇到的前端比较优秀的组件,方便以后开发的时候查找!!! 函数工具: Lodash 页面固定: stickUp、jQuery.Pin 轮播: unslider、swiper 开关: switch 复选框: icheck 气泡: grumble 隐藏元素: Headroom

这15个Vue指令,让你的项目开发爽到爆

1. V-Hotkey 仓库地址: github.com/Dafrok/v-ho… Demo: 戳这里 https://dafrok.github.io/v-hotkey 安装: npm install --save v-hotkey 这个指令可以给组件绑定一个或多个快捷键。你想要通过按下 Escape 键后隐藏某个组件,按住 Control 和回车键再显示它吗?小菜一碟: <template

中文分词jieba库的使用与实景应用(一)

知识星球:https://articles.zsxq.com/id_fxvgc803qmr2.html 目录 一.定义: 精确模式(默认模式): 全模式: 搜索引擎模式: paddle 模式(基于深度学习的分词模式): 二 自定义词典 三.文本解析   调整词出现的频率 四. 关键词提取 A. 基于TF-IDF算法的关键词提取 B. 基于TextRank算法的关键词提取

【 html+css 绚丽Loading 】000046 三才归元阵

前言:哈喽,大家好,今天给大家分享html+css 绚丽Loading!并提供具体代码帮助大家深入理解,彻底掌握!创作不易,如果能帮助到大家或者给大家一些灵感和启发,欢迎收藏+关注哦 💕 目录 📚一、效果📚二、信息💡1.简介:💡2.外观描述:💡3.使用方式:💡4.战斗方式:💡5.提升:💡6.传说: 📚三、源代码,上代码,可以直接复制使用🎥效果🗂️目录✍️

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06

Makefile简明使用教程

文章目录 规则makefile文件的基本语法:加在命令前的特殊符号:.PHONY伪目标: Makefilev1 直观写法v2 加上中间过程v3 伪目标v4 变量 make 选项-f-n-C Make 是一种流行的构建工具,常用于将源代码转换成可执行文件或者其他形式的输出文件(如库文件、文档等)。Make 可以自动化地执行编译、链接等一系列操作。 规则 makefile文件

如何在页面调用utility bar并传递参数至lwc组件

1.在app的utility item中添加lwc组件: 2.调用utility bar api的方式有两种: 方法一,通过lwc调用: import {LightningElement,api ,wire } from 'lwc';import { publish, MessageContext } from 'lightning/messageService';import Ca