杂志app-UI配制篇

背景

现在公司有需求是关于杂志app,里面每个页面可能有不同的展现方式,不同的内容,不同的操作方式。那么这里就有一个需求就是根据用户定制这些不同的展现方式,不同的内容,不同的操作方式,在我们手机端就能正确的展示这些功能。如果一个应用app所有的UI都已经组件化,那么我只需要把这些组件组合拼装就行了,修改配制文件即可。友好的把配制文件的给服务端或者是产品组,让其很容易地修改配制文件。

应用场景

按照我们定义的XML规范进行,考虑到一些情况,除了一些有特殊需求的app,app之前有相似性,应用app的UI符合已有UI组件的要求,业务逻辑相同或相似,UI和业务逻辑分离。

实现原理

根据配制文件定义相关控件或组件,配制其属性。UI引擎解析配制文件,生成对应的控件或组件模型,在需要的时候添加到当前的VIew上。UI引擎大致分为如下几部分,

1.Builder生成器类,2.Element控件或者组件容器类,3.Controller控制器类,处理业务逻辑和UI,4View普通视图类,5.TableView视图类。

从两个方面来看。

第一方面,从程序运行流程来看。

1.当第一次程序运行起来之后,会用Element基类的扩展类RootElement(XMLBuilder),解析配制文件如XML。

2.Builder生成器类把XML里面的结点通过递归的方法,解析成相应的Element控件或组件容器。

3.最终会成一个树形结构在内存中,内存地址根据RootElement对象来取。

4.程序继续往下走,这时会创建一个Controller业务控制器类,这个Controller是从基础业务控制器继承下来。把RootElement的对象指针传给该Controller.

5.把业务控制器赋值给Window的rootViewController,同时让window可见。

6.让window可见时会加载View,系统回调业务控制类的loadView或者viewDidLoad来渲染UI.此时用视图类递归遍历RootElement,根据RootElement容器提供生成View的方法,生成相应的控件或者是组件,addSubView。此时UI渲染完成,呈现给用户了。

第二方面,从程序运行时来看。

我们知道message与方法的真正实现是在执行阶段绑定的,而非编译阶段。编译器会将消息发送转换成对objc_msgSend方法的调用。objc_msgSend(receiver, selector, arg1, arg2, …);

当用户点击设备屏幕时,IOS捕捉到一系列的触摸,将其打包到UIEvent对象中并放置到应用程序活动事件队列中。单例UIApplication对象管理应用程序,从事件队列中取出最前面的事件并将其分发以便处理。通常,其发送事件给应用程序的主窗口——即聚焦于用户交互的窗口——窗口对象代表窗口再发送事件给初始对象进行处理。

在iOS系统中有个很重要的概念:Responder。基本上所有的UI相关的控件,view和viewcontroller都是继承自UIResponder。事件的分发正是通过由控件树所构成的responder chain(响应链)所进行的。

例如一个简单的Button点击事件。

1.当button被按下的时候,系统接收这到个事件,事件经过传递,分发,最终在应用程序的交互窗口的初始控件对象处理。

2.在ButtonElement里监听到这个被按下的事件,先交给父类处理,然后处理自己的逻辑,。

3.依次在ButtonElement--LabelElement--RootElement--Element这个继承树上进行传递。

4.当传递到根结点时即Element,消息就开始分发,消息的分发是动态绑定的,编译器会将消息发送转换成对objc_msgSend方法的调用,objc_msgSend(receiver, selector, arg1, arg2, …);

5.最终消息会分发到指定的Controller里的方法里去执行。处理自己的业务逻辑。

广告时间:

新浪微博: messageloop亮仔

 

移动App-UI配制篇的更多相关文章

  1. Android开发怎么让自己的APP UI漂亮、大方(配色篇二)

    我们在没有效果图的app开发中有一件事情肯定很头疼:一个按钮的调色改过来改过去,还是很难看,最终只能暂时作罢,浪费了大量的开发时间和精力.开发规范篇见Android开发怎么让自己的APP UI漂亮.大 ...

  2. Android开发怎么让自己的APP UI漂亮、大方(规范篇一)

    首先,笔者是站立在开发者的角度来看UI设计的,欢迎专业人士提供指导,不多说,来看怎么把UI设计和开发高效结合起来~ 一.约定APP开发中的一些规则 1.大部分图标满足HDPI(高清)即可,比如:大众点 ...

  3. 在一个老外微信PM的眼中,中国移动App UI那些事儿

    本文编译自Dan Grover的博客,他现在是腾讯微信的产品经理.以下是他从旧金山搬到广州后的近半年时间里,在试用过微信微博等中国主流移动App后,总结出的中美App在设计理念上的差异,并对中国移动A ...

  4. APP UI设计及切图规范

    APP UI设计及切图规范 1.概述 1.1 编写目的 该文档主要针对移动端开发的视觉设计和开发过程中的工作环节做统一的规划规范,是系统进入UI设计的前置文档.部分内容来自网络收集修编,转载请注明由 ...

  5. APP UI设计相关的一些链接

    安卓app设计规范整理和Android APP设计篇 http://www.25xt.com/appdesign/6536.html APP UI面试题:iOS和安卓的ui设计有什么区别 http:/ ...

  6. APP UI自动化测试思路总结

    python+appium自动化测试系列就要告一段落了,本篇博客咱们做个小结. 首先想要说明一下,APP自动化测试可能很多公司不用,但也是大部分自动化测试工程师.高级测试工程师岗位招聘信息上要求的,所 ...

  7. 【如何快速的开发一个完整的iOS直播app】(原理篇)

    原文转自:袁峥Seemygo    感谢分享.自我学习 目录 [如何快速的开发一个完整的iOS直播app](原理篇) [如何快速的开发一个完整的iOS直播app](播放篇) [如何快速的开发一个完整的 ...

  8. iOS:app直播---采集篇

    [如何快速的开发一个完整的iOS直播app](采集篇) 转载自简书@袁峥Seemygo:http://www.jianshu.com/p/c71bfda055fa 前言 开发一款直播app,首先需要采 ...

  9. iOS:app直播---原理篇

    [如何快速的开发一个完整的iOS直播app](原理篇) 转载自简书@袁峥Seemygo:http://www.jianshu.com/p/7b2f1df74420   一.个人见解(直播难与易) 直播 ...

随机推荐

  1. 《编程之美》学习笔记——指挥CPU占用率

    问题: 写一个程序.让用户来决定Windows任务管理器(Task Manager)的CPU占用率(单核). 有下面几种情况: 1.CPU占用率固定在50%,为一条直线 2.CPU的占用率为一条直线, ...

  2. 解决打包时IsCmdBld.exe出错的问题

    1.查看环境变量是否配置了 2.查看是否是使用administrator登陆的,要求使用administrator登陆否则可能会出现权限不足的现象

  3. java--内部类访问final成员

    局部类只能访问外包方法中的final成员.位于方法内部的局部类,可以访问局部类之外,外包方法之内的所以变量和方法,但是生命周期不同,延长生命周期的办法就是将变量设置为final类型. 1)从程序设计语 ...

  4. 【译】在Asp.Net中操作PDF – iTextSharp - 操作图片

    原文 [译]在Asp.Net中操作PDF – iTextSharp - 操作图片 作为我的iTextSharp系列的文章的第七篇,开始探索使用iTextSharp在PDF中操作图片,理解本篇文章需要看 ...

  5. Flex中怎么给表格中的滚动栏定位

    1.问题背景 假设表格中的字段过多,会出现滚动栏,在将滚动栏滚到一定的位置时,又一次刷新表格.滚动栏会回到原处,原来查看的字段还得继续滚动,才干查看到. 2.实现实例 <? xml versio ...

  6. Win32 Windows编程 十二

    一.对话框 1.对话框的分类 2.对话框的基本使用方式 3.对话框资源 4.有模式对话框的使用 5. 无模式对话框的使用 5.1 加入对话框资源 5.2 定义窗体处理函数 BOOL CALLBACK ...

  7. UVA 1524 - Hot or Cold?(数学)

    UVA 1524 - Hot or Cold? 题目链接 题意:给一个一元n次方程,带入x表示时间,f(x)表示温度,如今要求[s, e]的平均温度 思路:平均温度就是 总温度/ (e - s),画出 ...

  8. traceroute工作原理

      traceroute, 也就是 trace route,跟踪路由.这个程序最早是Van Jacobson实现的.源代码在网上能够找到,只是我还没有去找.基本的原理是IP路由过程中对数据包TTL(T ...

  9. redisTemplate 操作

    redisDao封装类-其他dao集成他 package com.ffcs.wlan.dao.common; import javax.annotation.Resource; import org. ...

  10. ubuntu 14.04 使用极点五笔输入法

    相比12.04在外观改变不是非常大,但当中细节有些许变化,特别输入法非常不大好用,为此,我们使用fcitx输入法,使用我喜欢的五笔拼音,安装步骤例如以下: 方法一: 最新的方法非常easy: 安装14 ...