📝 ExtJS教程

24篇技术文档
  ExtJS教程

📅  最后修改于: 2020-10-25 11:13:23        🧑  作者: Mango

PDF版本快速指南资源资源求职讨论区ExtJS代表扩展JavaScript。它是一个JavaScript框架,是Sencha的产品,基于YUI(雅虎用户界面)。它基本上是具有现代UI的桌面应用程序开发平台。本教程全面了解了Ext JS。在学习Ext JS时,本参考将带您通过简单实用的方法。听众本教程已为初学者准备,以帮助他们了解ExtJS的概念以构建动态Web UI。先决条件对于本教程,读者应该具...

  Ext.js-概述

📅  最后修改于: 2020-10-25 11:13:51        🧑  作者: Mango

Ext JS是一种流行的JavaScript框架,它提供了丰富的UI,可用于构建具有跨浏览器功能的Web应用程序。 Ext JS基本上用于创建桌面应用程序。它支持所有现代浏览器,例如IE6 +,FF,Chrome,Safari 6 +,Opera 12+等。而Sencha的另一种产品Sencha Touch用于移动应用程序。Ext JS基于MVC / MVVM体系结构。 Ext JS 6的最新版本...

  Ext.js-环境设置

📅  最后修改于: 2020-10-25 11:14:14        🧑  作者: Mango

本地环境设置本节指导您如何在计算机上下载和设置Ext JS。请按照以下步骤设置环境。下载库文件从Senchahttps://www.sencha.com下载Ext JS库文件的试用版。您将从您注册的邮件ID的网站上获得试用版,该版本将是名为ext-6.0.1-trial的压缩文件夹。解压缩该文件夹,您将找到各种JavaScript和CSS文件,这些文件将包含在我们的应用程序中。我们将主要包括以下文...

  Ext.js-命名约定

📅  最后修改于: 2020-10-25 11:14:28        🧑  作者: Mango

命名约定是标识符要遵循的一组规则。它也使代码更易于其他程序员阅读和理解。Ext JS中的命名约定遵循标准的JavaScript约定,这不是强制性的,而是遵循的良好实践。它应遵循驼峰式语法来命名类,方法,变量和属性。如果名称由两个单词组成,则第二个单词将始终以大写字母开头。例如,doLayout(),StudentForm,firstName等。NameConventionClass NameIt ...

  Ext.js-体系结构

📅  最后修改于: 2020-10-25 11:14:49        🧑  作者: Mango

Ext JS遵循MVC / MVVM体系结构。MVC-模型视图控制器体系结构(版本4)MVVM-模型-视图-视图模型(第5版)对于程序来说,此体系结构不是强制性的,但是,最好的做法是遵循此结构,以使您的代码具有高度的可维护性和组织性。Ext JS App的项目结构Ext JS应用程序文件夹将位于您项目的JavaScript文件夹中。该应用程序将包含带有app.js的控制器,视图,模型,存储和实用程...

  Ext.js-第一个程序

📅  最后修改于: 2020-10-25 11:15:05        🧑  作者: Mango

本章列出了在Ext JS中编写第一个Hello World程序的步骤。第1步在我们选择的编辑器中创建一个index.htm页面。如下所示,将所需的库文件包括在html页面的开头部分。索引现场演示说明一旦Ext JS准备好呈现Ext JS元素,就会调用Ext.onReady()方法。Ext.create()方法用于在Ext JS中创建对象。在这里,我们创建一个简单面板类Ext.Panel的对象。Ex...

  Ext.js-类系统

📅  最后修改于: 2020-10-25 11:15:24        🧑  作者: Mango

Ext JS是具有面向对象编程功能的JavaScript框架。 Ext是名称空间,它封装了Ext JS中的所有类。在Ext JS中定义一个类Ext提供了300多个类,我们可以将其用于各种功能。Ext.define()用于定义Ext JS中的类。句法类名称是根据应用程序结构的类的名称。例如,appName.folderName.ClassName studentApp.view.StudentVie...

  Ext.js-容器

📅  最后修改于: 2020-10-25 11:15:38        🧑  作者: Mango

Ext JS中的容器是可以在其中添加其他容器或子组件的组件。这些容器可以具有多种布局,以将组件布置在容器中。我们可以从容器及其子元素中添加或删除组件。 Ext.container.Container是Ext JS中所有容器的基类。Sr.NoDescription1Components inside ContainerThis example shows how to define the comp...

  Ext.js-布局

📅  最后修改于: 2020-10-25 11:15:54        🧑  作者: Mango

布局是元素在容器中的排列方式。它可以是水平的,垂直的或其他任何形式。 Ext JS在其库中定义了不同的布局,但是我们始终可以编写自定义布局。Sr.NoLayout & Description1AbsoluteThis layout allows to position the items using XY coordinates in the container.2AccordionThis la...

  Ext.js-组件

📅  最后修改于: 2020-10-25 11:16:08        🧑  作者: Mango

ExtJS UI由一个或多个称为“组件”的小部件组成。 Ext Js定义了各种UI组件,可以根据您的要求进行自定义。Sr.NoMethods & Description1GridGrid component can be used to show the data in a tabular format.2FormForm widget is to get the data from the us...

  Ext.js-拖放

📅  最后修改于: 2020-10-25 11:16:28        🧑  作者: Mango

拖放功能是添加的强大功能之一,可简化开发人员的任务。本质上,拖动操作是在某些UI元素上的单击手势,同时按住鼠标按钮并移动鼠标。在拖动操作后释放鼠标按钮时,将发生放置操作。句法将拖放类添加到可拖动目标。将拖放目标类添加到可插入目标。例以下是一个简单的示例。现场演示上面的程序将产生以下结果-借助Extjs中的拖放,我们可以将数据从一个网格移动到另一个网格,然后再从网格移动到表格。以下是在表格和表格之间...

  Ext.js-主题

📅  最后修改于: 2020-10-25 11:16:53        🧑  作者: Mango

Ext.js提供了许多在您的应用程序中使用的主题。您可以添加其他主题来代替经典主题,并查看输出的差异。只需替换主题CSS文件即可完成此操作,如前所述。海王星主题考虑您的第一个Hello World应用程序。从应用程序中删除以下CSS。添加以下CSS以使用Neptune主题。若要查看效果,请尝试以下程序。现场演示上面的程序将产生以下结果-酥脆主题考虑您的第一个Hello World应用程序。从应用程...

  Ext.js-自定义事件和侦听器

📅  最后修改于: 2020-10-25 11:17:19        🧑  作者: Mango

事件是在类发生事件时触发的事件。例如,当单击按钮时或呈现元素之前/之后。编写事件的方法使用监听器的内置事件稍后附加事件自定义事件使用侦听器的内置事件Ext JS提供了侦听器属性,用于在Ext JS文件中编写事件和自定义事件。在Ext JS中编写侦听器我们将在面板中添加一个listener属性,从而在之前的程序中添加监听器。现场演示上面的程序将产生以下结果-这样,我们还可以在listeners属性中...

  Ext.js-数据

📅  最后修改于: 2020-10-25 11:17:38        🧑  作者: Mango

数据包用于加载和保存应用程序中的所有数据。数据包具有许多类,但是最重要的类是-模型商店代理模型模型的基类是Ext.data.Model。它代表应用程序中的实体。它将商店数据绑定到视图。它具有后端数据对象到视图dataIndex的映射。在存储的帮助下获取数据。建立模型为了创建模型,我们需要扩展Ext.data.Model类,并且需要定义字段,它们的名称和映射。在这里,名称应与我们在视图中声明的dat...

  Ext.js-字体

📅  最后修改于: 2020-10-25 11:17:52        🧑  作者: Mango

Ext.js提供了使用不同字体包的工具。字体包用于为包中可用的图标添加不同的类。真棒字体Font-Pictos真棒字体ExtJS的新主题Triton具有内置的字体家族font-awesome,它本身包含在框架中,因此,我们对font-awesome样式表不需要任何明确的要求。以下是在Triton主题中使用Font-Awesome类的示例。Triton主题的Font-Awesome当我们使用Trit...