Hybrid框架UI重构之路：六、前端那点事儿（Javascript）

上文回顾 :Hybird框架UI重构之路:五.前端那点事儿(HTML.CSS) 这里讲述在开发的过程中,一些JS的关键点. 换肤对于终端的换肤,我之前一篇文章有说了我的想法. 请查看:http://www.cnblogs.com/lovesong/p/4122262.html iscroll的问题 1.使用iscroll的页面里面有表单元素,当键盘弹出再缩回后,页面拖不到最顶地方. 这个在android上总出现,使用的iscroll版本是4.2.5. 这原来是个很棘手的问题,导致了有inp…

Hybrid框架UI重构之路：五、前端那点事儿（HTML、CSS）

上文回顾 :Hybird框架UI重构之路:四.分而治之这里讲述在开发的过程中,一些HTML.CSS的关键点. 单页模式的页面结构在单页模式中,弱化HTML的概念,把HTML当成一个容器,BODY中显示的主体内容才是页面,一个HTML容器中可以存放1个或者多个页面,每个页面放置于section中.而一个页面(section)中必有主体内容(content),也有可能包含头部内容.底部内容,甚至一些侧滑菜单等. 所以,以我们通常看到的一个移动应用的界面中包含了顶部Title和主体内容的页面代码如…

Hybrid框架UI重构之路：四、分而治之

上文回顾:Hybird框架UI重构之路:三.工欲善其事,必先利其器上一篇文章有说到less.grunt这两个工具,是为了css.js分模块使用的.UI框架提供给使用者的时候,是一个大的xxx.js.xxx.css,但在开发时候,必须划分模块. CSS模块划分 1.variables.less 这里面是一些样式的变量.函数例: 字体: @baseFontSize: 20px; 圆角: .rounded-corners (@radius: 5px) { border-radius: @radiu…

Hybrid框架UI重构之路：三、工欲善其事，必先利其器

上文回顾:Hybird框架UI重构之路:二.事出有因工欲善其事,必先利其器,事是重构的目标,器是开发环境. 这篇文章将讲述重构时的UI框架的目录结构,且需要使用的开发工具. 目录结构 demo : 开发框架的模板(单页模式) demo-muti : 开发框架的模板(多页模式) demo-scene : 示例模板.一个完整的示例,目的是给使用者稍作修改就可以使用在项目上. demo-template : 给使用者使用的开发模板. demo-whole : 可在PC上演示的示例模板 dist :…

Hybrid框架UI重构之路：二、事出有因

上文回顾:Hybird框架UI重构之路:一.师其长技以自强一切的重构都是有原因的,或许为了更快速度.更好体验.更快捷开发等,于是就有了自己的开发目标,简单看看未重构前UI("中国移动式"风格). 上一篇文章说明调查了这么多类似框架,对比了他们的特点,而比对自身UI,也是存在可优化的地方,于是有了下面几点目标(仅仅UI框架方面,不涉及原生部分). (1)规范开发 1.SVN版本控制.之前的UI框架部分是没有进行svn版本控制的,于是会导致个问题——有些文件在多次修改后,连当初的开发者都…

Hybrid框架UI重构之路：一、师其长技以自强

这两年在支撑公司的Hybrid框架的运维发展,让人确认这种移动开发方式确实是一条不错的路.混合应用这种开发方式降低开发难度,极大的提高开发效率,最重要的一点效果可以接近原生应用.框架的本身是需要持续不断发展的,这里开始我讲述我重构Hybird框架的UI的这三个月(2014-11——2015-1),而在重构之前,预先调查了目前所了解的几个混合应用的框架,师其长技以自强. PS:Hybrid应用是web页面与原生壳(Android.IOS)的结合最后打成安装包的应用. 重构的前奏曲: ApiCl…

移动端前端框架UI库

移动端前端框架UI库(Frozen UI.WeUI.SUI Mobile) Frozen UI 自述:简单易用,轻量快捷,为移动端服务的前端框架. 主页:http://frozenui.github.io/ 开发团队:QQVIP FD Team Github:https://github.com/frozenui/frozenui Demo:http://frozenui.github.io/frozenui/demo/index.html WeUI 自述:WeUI是一套同微信原生视觉体验一致的…

quickhybrid】如何实现一个Hybrid框架

章节目录 [quickhybrid]如何实现一个跨平台Hybrid框架 [quick hybrid]架构一个Hybrid框架 [quick hybrid]H5和Native交互原理 [quick hybrid]JSBridge的实现 [quick hybrid]H5和原生的职责划分 [quick hybrid]API的分类:短期API.长期API [quick hybrid]API规划 [quick hybrid]API多平台支撑的实现 [quick hybrid]组件(自定义)API的实现 […

【quickhybrid】架构一个Hybrid框架

前言虽然说本系列中架构篇是第一章,但实际过程中是在慢慢演化的第二版中才有这个概念, 经过不断的迭代,演化才逐步稳定明确目标首先明确需要做成一个什么样的框架? 大致就是: 一套API规范(统一Android与iOS),所有API异步调用(防止阻塞) 提供大部分原生功能的API(包括很多常用的功能给H5使用) 原生需要能调用到H5中注册的方法(用关于原生主动通知) 部分API需要支持H5环境(譬如alert需要在Android.iOS.浏览器中同时运行) API类别需要包括事件监听(如网络变化…

【quickhybrid】如何实现一个Hybrid框架

Android Studio重构之路，我们重新来了解一下Google官方的Android开发工具

Android Studio重构之路,我们重新来了解一下Google官方的Android开发工具记得我的第一篇博客就是写Android Studio,但是现在看来还是有些粗糙了,所有重构了一下思路,覆写了一篇 Google主推-Android开发利器--Android Studio,这可能是最全的AS教程! Android Studio,自Google2013年发布以来,就倍受Android开发者的喜爱,我们本书,就是基于Android Studio来进行案例演示的,大家都知道,Android…

（转）Android项目重构之路:界面篇

在前一篇文章<Android项目重构之路:架构篇>中已经简单说明了项目的架构,将项目分为了四个层级:模型层.接口层.核心层.界面层.其中,最上层的界面,是变化最频繁的一个层面,也是最复杂最容易出问题的一个层面,如果规划不好,很容易做着做着,又乱成一团了. 要规划好界面层,至少应该遵循几条基本的原则: 保持规范性:定义好开发规范,包括书写规范.命名规范.注释规范等,并按照规范严格执行: 保持单一性:布局就只做布局,内容就只做内容,各自分离好:每个方法.每个类,也只做一件事情: 保持简洁性:保持代…

工作流,WEB框架,UI组件网络收集整理

工作流,WEB框架,UI组件网络收集整理在博客园上逛了好多年,随手收录了一些工作流,WEB开发框架,UI组件,现在整理一下与大家分享. 由于个人能力与精力有限,望各位园友在评论中补充,我将全部整理到正文: ✔ 工作流篇 RoadFlow工作流(收费): http://www.cqroad.cn/WorkFlow 驰骋工作流引擎 ccflow https://www.oschina.net/p/ccflow YbSof…

day06-初识Vuetify框架UI框架和使用域名访问本地项目

本项目的笔记和资料的Download,请点击这一句话自行获取. day01-springboot(理论篇) :day01-springboot(实践篇) day02-springcloud(理论篇一) :day02-springcloud(理论篇二) :day02-springcloud(理论篇三) :day02-springcloud(理论篇四) : day03-springcloud(Hystix,Feign) :day03-springcloud(Zuul网关) day04-项目搭建…

Seata RPC 模块的重构之路

简介: RPC 模块是我最初研究 Seata 源码开始的地方,因此我对 Seata 的 RPC 模块有过一些深刻研究,在我研究了一番后,发现 RPC 模块中的代码需要进行优化,使得代码更加优雅,交互逻辑更加清晰易懂,本着 "让天下没有难懂的 RPC 通信代码" 的初衷,我开始了 RPC 模块的重构之路. RPC 模块是我最初研究 Seata 源码开始的地方,因此我对 Seata 的 RPC 模块有过一些深刻研究,在我研究了一番后,发现 RPC 模块中的代码需要进行优化,使得代码更加优雅…

Semantic UI – 完全语义化的前端界面开发框架

Semantic UI 是一个 UI 库,使前端开发更简单,更容易学习.Semantic UI 介绍了许多界面元素.在大多数情况下,只有你需要的元素建立一个自定义的构建可能是最好的. UI 组件分为四大类,范围从最小到最大的范围分为:用户界面 UI 元素集合,UI 模块和用户界面视图. 您可能感兴趣的相关文章特别推荐:10套精美的免费网站后台管理系统模板 SlimerJS – Web开发人员可编写 JS 控制的浏览器 Parallax.js – 自适应智能设备方向的视差效果插件 Chanc…

使用 CodeIgniter 框架快速开发 PHP 应用(六)

原文:使用 CodeIgniter 框架快速开发 PHP 应用(六) 简化使用 Session 和安全理论说得够多了! 现在让我们开始写我们自己的应用. 在这一章里,我们将会大致描述一下我们要建立的一个应用系统,而且我们分析一些会影响到网站系统的的基本问题也就是会话管理和安全.在这一章,我们将会见到:.如何使你的网页安全.如何使用 CI 的会话类开始用 CI 设计一个实际的网站我们已经看过 CI 安装时生成的welcome页以及它内部动作中控制器文件和视图文件的动作流程. 实际上这就是CI的'H…

微服务框架surging学习之路——序列化（转载https://www.cnblogs.com/alangur/p/10407727.html）

微服务框架surging学习之路——序列化 1.对微服务的理解之前看到在群里的朋友门都在讨论微服务,看到他们的讨论,我也有了一些自己的理解,所谓微服务就是系统里的每个服务都可以自由组合.自由组合这个就很厉害了,这样一来,每个服务与服务之间基本的物理耦合为0,横向扩展整个系统就会非常非常灵活. surging的厉害之处也恰恰是可以做到这些,所以surging 是.net core 里面一个非常不错的微服务框架. 2.surging的序列化方式 2.1 json.Net surging 使…

基于Vue的Quasar Framework 介绍这个框架UI组件很全面

基于Vue的Quasar Framework 介绍这个框架UI组件很全面基于Vue的Quasar Framework 中文网http://www.quasarchs.com/ quasarframework/quasar: Quasar Frameworkhttps://github.com/quasarframework/quasar Quasar(发音为/kweɪ.zɑɹ/)是MIT许可的开源框架(基于Vue),可帮助Web开发人员创建:响应式网站PWA(Progressive Web…

我的UI启蒙之路

为什么叫UI启蒙之路呢? 我没有学过美术,也不懂设计,但是有的时候也许就是一种命中注定吧,让我知道了UI,并且一发不可收拾的爱上了它. 具体情况是这样的: 我毕业于电力学校,是一名不折不扣的工科生,专业并非自己所选,全是因为高考分数不够被调剂的. 因此大学时的我非常的努力,每天除了上课要么就是在自习室要么就是在学生会,总之怎么好我就怎么做. 努力的回报还是很明显的,大三时我凭借着专业第一的成绩.各种证书以及党员的身份,成功的被一家宁波的国企面试上. 这家国企有自己的行政楼.住宿楼.食堂和两个大的…

（转）Android项目重构之路:实现篇

前两篇文章Android项目重构之路:架构篇和Android项目重构之路:界面篇已经讲了我的项目开始搭建时的架构设计和界面设计,这篇就讲讲具体怎么实现的,以实现最小化可用产品(MVP)的目标,用最简单的方式来搭建架构和实现代码. IDE采用Android Studio,Demo实现的功能为用户注册.登录和展示一个券列表,数据采用我们现有项目的测试数据,接口也是我们项目中的测试接口. 项目搭建根据架构篇所讲的,将项目分为了四个层级:模型层.接口层.核心层.界面层.四个层级之间的关系如下图所示:…

Hybrid框架安全隐患分析

Hybrid框架安全隐患分析目前我司移动端项目中各种app如雨后春笋般生根发芽层出不穷.而利用Hybrid框架确实可以减轻一部分移动端压力.并且做到灵活发版.但是其中的安全问题往往让人忽略. 针对Android端的目前的Hybrid项目.WebView引起的安全问题和漏洞等问题.下面做一个讨论.并针对相应的攻击方式采取措施,避免App中招. 我司现有的Hybrid中多数都没有考虑到安全性的问题.鉴于此,这里引入框架安全.给出攻击代码和解决方案.致力于把移动端Hybrid更加健壮. WebVie…

使用Typescript重构axios(十六)——请求和响应数据配置化

0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三)--实现基础功能:处理get请求url参数 4.使用Typescript重构axios(四)--实现基础功能:处理post请求参数 5.使用Typescript重构axios(五)--实现基础功能:处理请求的header 6.使用Typescript重构axios(六)--实现基础功能:获取响应数据…

web前端面试试题总结---javascript篇

JavaScript 介绍js的基本数据类型. Undefined.Null.Boolean.Number.String. ECMAScript 2015 新增:Symbol(创建后独一无二且不可变的数据类型 ) 介绍js有哪些内置对象? Object 是 JavaScript 中所有对象的父对象数据封装类对象:Object.Array.Boolean.Number 和 String 其他对象:Function.Arguments.Math.Date.RegExp.Error 参考:http:…

【转发】网易邮箱前端技术分享之javascript编码规范

网易邮箱前端技术分享之javascript编码规范发布日期:2013-11-26 10:06 来源:网易邮箱前端技术中心作者:网易邮箱点击:533 网易邮箱是国内最早使用ajax技术的邮箱.早在2004年就推出了基于ajax引擎的极速风格邮箱,到2012年极速风格已经发展到第五版.最近两年HTML5+CSS3以及移动终端技术方兴未艾,网易邮箱也紧跟技术发展趋势推出了iphone,ipad适配版的邮箱.在这么多年开发邮箱webmail过程中,邮箱前端团队积累了不少心得体会,我们开发了很多基础…

前端试题本（Javascript篇）

JS1. 下面这个JS程序的输出是什么:JS2.下面的JS程序输出是什么:JS3.页面有一个按钮button id为 button1,通过原生的js如何禁用?JS4.页面有一个按钮button id为 button1,通过原生的js 设置背景色为红色?JS5.处理a.html文件时,以下哪行伪代码可能导致内存越界或者抛出异常()JS6.下面的代码结果是JS7.下面的代码结果是JS8.考察this(测试环境是浏览器,Node环境中全局对象有所不同)JS9.var和函数的声明提前JS10.给基本类型…