中文教程

移动web应用开发-Sencha Touch篇(1)

这里希望通过我自己的学习经历,给大家写出最通俗,最方便的HTML5框架使用指南。

2016年,更加关注移动web应用相关开发,重心也放到了基于HTML5的移动app开发。从今天开始将展开Sencha Touch的学习之旅。

Sencha Touch是一款移动web应用开发框架,界面美观,接近原生。

万事开头难,今天我们先来进行文件下载和开发环境的配置。

ExtJS 如何动态加载JavaScript创建窗体

JavaScript不需要编译即可运行,这让JavaScript构建的应用程序可以变得很灵活。我们可以根据需要动态从服务器加载JavaScript脚本来创建和控制UI来与用户交互。下面结合Ext JS来说明如何从服务器上动态加载JS脚本来动态创建窗体。

1 项目结构:

项目结构如下:其中GetJSUI一般处理程序用来从数据库表中抓取UI配置,并返回到客户端;Contents文件夹下用HTML文件和JS库等。


Sencha ExtJS 6 Widget Grid 入门

最近由于业务需要,研究了一下Sencha ExtJS 6 ,虽然UI和性能上据相关资料说都有提升,但是用起来确实不太顺手,而且用Sencha cmd工具进行测试和发布,很多内部细节都是隐藏的,出了问题不好跟踪。更奇葩的是明明在sencha app watch上运行很好,但是sencha app build后会出现异常。即使是这样,但Sencha ExtJS 6 在UI控件和编程模式上确实比较强大。下面介绍一个 Widget Grid 用法,可以在表格grid中进行列样式渲染,是一个比较强大的功能:


Sencha ExtJS 6 入门

Sencha Ext JS号称是目前世界上最先进和最强大的、支持多平台多设备的JavaScript应用程序开发框架。首先看一下Ext JS的发展简史。


ExtJS最新技巧

Grid水印

Ext JS的Grid是一个便于在布局中显示信息的伟大工具。有些用户可能会希望将这些信息打印为会议资料或宣传材料,而且会希望在打印的时候,能添加水印以便进行版权保护、保密或作为品牌的一种方式。

这个很容易实现,只要在Ext JS的Grid中为它指定一个样式就行了,而这只需要一些简单的CSS技巧。

实现这种效果的关键是修改单元格的样式,并在Grid中插入不透明且不会遮盖Grid内容的背景。

聚合内容