stingray 页面布局与设计
前言
前面我们已经了解了系统中的HTML组件，现在我们就可以开始用这些组件来设计页面了，他们就像是一块块小积木，我们要盖起高楼大厦。
两种页面容器组件
我们将关联性较强的多个HTML组件放到一个容器组件中便于统一处理，这就行成了一个区块。多个区块顺序放到一个页面中，变组成了一个页面。基本上就是这个样子：
区块的设计重在熟练掌握这两个容器组件：
- Dynamic Container - 相对定位，高度自适应
- Static Container - 绝对定位，需要指定高度
使用WebEditor制作页面
通过DevToolBar创建新页面或者编辑已有的页面。DevToolBar不显示的问题 - 使用Developer模式运行。使用Applist页面讲解基本使用。
使用Sublime Text开发页面
同样这里使用Applist页面进行讲解基本使用，我们有个基本的对比。开发过程演示讲解。
两种方式的对比
- 直观性，所见即所得
- 操作难易程度
- 调试，问题排查
- 代码格式化
- 开发速度
未来页面设计系统构想
使用Angularjs重新构建前端部分，没错，就是重构我们的系统。
- VRM - 只负责ajax请求的处理，只返回json数据
- html - 视图部分将独立出来
- javascript - JS也将独立出来
- BootStrap - 引入css框架，简化布局
- 通用模块组件化
后端开发培训
下一节我们将介绍后端开发：stingray后端开发
stingray 页面布局与设计的更多相关文章
- APP界面设计之页面布局的22条基本原则
移动 APP 页面布局(Layout)是我们设计 app 界面的时候,最主要的设计任务.一个 app 的好与不好,很大部分取决于移动 APP 页面布局的合理性. 下图为 APP 最原始的布局模型. 页 ...
- APP界面设计与页面布局的23条基本原则
一个App的好与不好,很大部分取决于移动App页面布局的合理性,优秀的布局顾名思义就是对页面的文字.图形或表格等进行排版.设计. 优秀的布局,需要对页面信息进行完整的考虑,既要考虑用户需求.用户行为, ...
- TMS WEB CORE直接从HTML&CSS设计的页面布局
TMS WEB CORE直接从HTML&CSS设计的页面布局 TMS WEB CORE支持DELPHI IDE中拖放控件,生成HTML UI.这种方式适合DELPHI和C++ BUILDER的 ...
- UI设计，使用 线框图（页面示意图或页面布局图）
在进行页面框架设计的时候,尝试画个 线框图(页面示意图或页面布局图)吧.
- Xamarin+Prism开发详解五：页面布局基础知识
说实在的研究Xamarin到现在,自己就没设计出一款好的UI,基本都在研究后台逻辑之类的!作为Xamarin爱好者,一些简单的页面布局知识还是必备的. 布局常见标签: StackLayout Abso ...
- CSS3与页面布局学习总结（四）——页面布局大全
一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...
- 如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites]
如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites] 一.布局页面介绍[Abo ...
- CSS3与页面布局学习笔记（四）——页面布局大全(负边距、双飞翼、多栏、弹性、流式、瀑布流、响应式布局)
一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...
- CSS3与页面布局学习总结（四）——页面布局大全BFC、定位、浮动、7种垂直居中方法
目录 一.BFC与IFC 1.1.BFC与IFC概要 1.2.如何产生BFC 1.3.BFC的作用与特点 二.定位 2.2.relative 2.3.absolute 2.4.fixed 2.5.z- ...
随机推荐
- 【k8s】搭建步骤
搭建步骤 基础概念:https://www.cnblogs.com/sxdcgaq8080/p/10640879.html ====================================== ...
- python测试开发django-42.auth模块登陆认证
前言 在开发一个网站时,经常会用到用户的注册和登陆相关的账号管理功能,auth模块是Django提供的标准权限管理系统,可以提供用户身份认证, 用户组和权限管理. 像用户注册.用户登录.用户认证.注销 ...
- YII框架分析笔记2：组件和事件行为管理
Yii是一个基于组件.用于开发大型 Web 应用的高性能 PHP 框架.CComponent几乎是所有类的基类,它控制着组件与事件的管理,其方法与属性如下,私有变量$_e数据存放事件(evnet,有些 ...
- java用正则方法验证文件名是否合法
Java中用到文件操作时,经常要验证文件名是否合法. 用File类的createNewFile()方法的确很管用.但当要批量验证时,效率上就会有问题.正则匹配的开销比创建文件少了很多. 那么一个合法的 ...
- @Transactional事务几点注意
这里面有几点需要大家留意:A. 一个功能是否要事务,必须纳入设计.编码考虑.不能仅仅完成了基本功能就ok.B. 如果加了事务,必须做好开发环境测试(测试环境也尽量触发异常.测试回滚),确保事务生效.C ...
- 你真的懂Handler.postDelayed()的原理吗?
转载自http://www.dss886.com/2016/08/17/01/ 阅读之前先问大家一个问题:Handler.postDelayed()是先delay一定的时间,然后再放入messag ...
- MVC的Ajax异步请求
@using (Ajax.BeginForm("GetTime","order",new AjaxOptions() { Confirm="你确认这么 ...
- linux中的通配符、元字符、转义符
linux中的通配符.元字符.转义符 linux中的通配符元字符转义符 shell命令的构成 通配符 元字符meta 转义符 example reference shell命令的构成 每条linux命 ...
- POJ 1719 Shooting Contest（二分图匹配）
POJ 1719 Shooting Contest id=1719" target="_blank" style="">题目链接 题意:给定一个 ...
- REST构架风格介绍之二：CRUD
转载自:Todd Wei http://www.cnblogs.com/weidagang2046/archive/2009/05/09/1453065.html 上一节我们通过两个例子初步体 ...