dengkengcong7964-CSDN博客

转载前端框架沉思录（上）

这是一个前端框架满天飞的时代，你还没有学会其中的一个，新的又出现了。更糟糕的是，你花大力气所学习到的内容可能已经过时了。虽说学习是一辈子的事，但在软件开发领域，你不能太盲目，你必需要有明辨是非的能力以及快速学习的能力。明辨是非有助于淘汰那些不值得学习的目标，快速学习可以避免学完就过时的尴尬。对于大部分人而言，这些能力是难以在短期内习得的，这需要长期的实践、思考与总结。本人使用过不少框架，...

2017-07-25 18:27:00 97

转载 xmlplus 组件设计系列之十 - 网格（DataGrid）

这一章我们要实现是一个网格组件，该组件除了最基本的数据展示功能外，还提供排序以及数据过滤功能。数据源为了测试我们即将编写好网格组件，我们采用如下格式的数据源。此数据源包含两部分的内容，分别是表头数据集和表体数据集。网格组件实例最终的列数由表头数据集的长度决定。// 10-01var data = { gridColumns: ['name', 'power'], ...

2017-05-05 10:53:00 93

转载 xmlplus 组件设计系列之九 - 树（Tree）

树形组件是一种具有层级结构的组件，广泛应用于各种场景。本章会实现一个简单的树形组件，尽管功能有限，但你可以通过扩展它来实现自己所需要的树形组件。数据源树形组件的数据源可以是 JSON 格式的数据对象，也可以是具有 XML 结构的数据或者是其它的具有层级结构的数据。本章将采用具有如下 JSON 格式的数据对象。// 09-01{ name: 'My Tree', ...

2017-05-02 15:35:00 83

转载 xmlplus 组件设计系列之八 - 分隔框（DividedBox）

分隔框（DividedBox）是一种布局类组件，可以分为两种，其中一种叫水平分隔框（HDividedBox），另一种叫垂直分隔框（VDividedBox）。水平分隔框会将其子级分为两列，而垂直分隔框则会将其子级分为两行。列与列之间以及行与行之间一般都会有一条可以拖动的用以改变子级组件大小的分隔条。下面仅以垂直分隔框为例来介绍此类组件是如何设计以及实现的。成品组件用例按照以往的设计经...

2017-04-30 10:23:00 78

转载 xmlplus 组件设计系列之七 - 路由（ViewStack）

在浏览器端，对路由的理解一般是根据不同的 URL 完成页面的切换。在服务器端，则是根据不同的 URL 请求回馈相关的页面。在本章，我们广义的组件路由的定义：根据接收到的不同命令，组件对象呈现出不同的子级页面。在这里将介绍与路由相关的一个组件，即视图栈 ViewStack。视图栈初步该组件在《文档》部分的最后一个章节《延迟实例化》已经出现过了。这里将对一些细节部分进行解读。下面再次给...

2017-04-28 22:45:00 117

转载 xmlplus 组件设计系列之六 - 下拉刷新（PullRefresh）

“下拉刷新”由著名设计师 Loren Brichter 设计，并应用于 Twitter 第三方应用 Tweetie 中。2010年4月，Twitter 收购 Tweetie 开发商 Atebits 后，该专利归 Twitter 所有。这一章我们就来看看如何实现一个简单的下拉刷新组件。目标组件分析和前面在设计组件时的做法一样，我们先想想看最终的成品组件是如何使用的，这需要点想像力。下...

2017-04-27 22:08:00 126

转载 xmlplus 组件设计系列之五 - 选项卡（Tabbar）

这一章将设计一个选项卡组件，选项卡组件在手持设备上用的比较多，下面是一个示意图：选项卡组成在具体实现之前，想像一下目标组件是如何使用的，对于设计会有莫大的帮助。通过观察，可以将选项卡组件分为容器部分和子项部分，正如下面的 XML 结构所展示的。<Tabbar id="tabbar"> <TabItem id="h...

2017-04-26 11:48:00 74

转载 xmlplus 组件设计系列之四 - 列表（List）

列表是极其常用的一种组件，是许多组件系统的必须包含的。列表可以做的很简单，只显示简洁的文本。列表也可以做的很复杂，用于展示非常丰富的内容。列表的组成列表离不开列表项以及包含列表项的容器。下面是最简单的列表组件，它包含一个列表项组件 Item 以及一个列表项容器组件 List。// 04-01Item: { xml: "<li id='item'/>"},...

2017-04-25 11:31:00 172

转载 xmlplus 组件设计系列之三 - 文本框（TextBox）

文本框是页面中最常用的输入组件，这一章就来看看各种文本框组件的设计与使用。原生的文本框原生的文本框组件非常简单，它只包含一个 input 元素，下面是它的一个使用示例。// 03-01Index: { xml: "<input id='index' type='text'/>", fun: function (sys, items, opts) {...

2017-04-24 10:52:00 145

转载 xmlplus 组件设计系列之二 - 按钮（Button）

除了图标组件以外，按钮也许是最简单的组件了，这章就来看看如何定义按钮组件。使用原生按钮组件在 xmlplus 中，HTML 元素也以组件的方式存在。所以，你可以直接通过使用 button 标签或者 input 标签来使用按钮组件。如下面的示例所示：// 02-01Index: { xml: `<div id='index'> &l...

2017-04-23 09:38:00 205

转载 xmlplus 组件设计系列之一 - 图标（ICON）

网页上使用的图标分可为三种：文件图标、字体图标和 SVG 图标。对于文件图标，下面仅以 PNG 格式来说明。PNG 图标对于 PNG 图标的引用，有两种方式。一种是直接由 HTML 元素 img 的 src 属性给出。下面是一个简单的示例。// 01-01Icon: { css: `#icon { width: 68px; height: 68px; }`, x...

2017-04-22 10:37:00 211

转载 xmlplus 组件设计系列之零 - 简介（Introduction）

xmlplus 介绍xmlplus 是一个设计非常独特 JavaScript 框架，用于快速开发前后端项目。基于组件设计在 xmlplus 中，组件是基本的构造块。评价组件设计好坏的一个重要标准是封装度。基于 xmlplus 设计的组件具有极高的封装度。下面是一个简单的组件示例：Widget: { css: "#widget{ color: red; }", xm...

2017-04-21 23:18:00 62

转载 hello,cnblogs

hello,cnblogs转载于:https://www.cnblogs.com/qudou/p/6746444.html

2017-04-21 22:51:00 55

dengkengcong7964的博客