燕山大学——软件用户界面设计（五）UI架构
界面设计中的“设计”与“实现”，本节的UI架构属于“实现”部分。
1.GUI设计模式（Design patterns for GUIs）
（1）视图树（View tree）
①定义：GUI结构是一个视图树。视图是一个对象，显示在屏幕的某个区域，可以是一个控件或者其他元素。
②视图树的使用：
输出：GUI通过改变视图树来改变输出；重绘算法自动重绘受影响的视图
输入：GUI将监听器绑定到视图，来接收键盘和鼠标的输入
布局：自动布局算法通过遍历树来计算视图的位置和大小
③输入处理：
输入处理程序与视图相关联，被称为监听器（listeners）、事件处理程序、订阅器、观察器等
（2）监听模式（Listener Pattern）
①（上面提到的）GUI输入处理是监听模式的一种
②事件源产生一系列离散事件（例如鼠标事件）
③监听器注册对事件源感兴趣的事件，也可以取消订阅
④当一个事件发生时，事件源将事件分发给所有绑定的监听器
（3）模型视图（Model-view）
①目的：分离前后端
输出：由视图树表示
输入：由绑定在视图上的监听器处理
后台（又称模型）：保存用户界面正在展示和编辑的数据
②模型-视图-控制器模式（Model-View-Controller Pattern，简称MVC）
模型（Model）维护应用程序状态
视图（View）显示数据
控制器（Controller）处理输入
③模型视图的优点
[1]责任分离：一个模块只负责一个功能 模型Model-数据 视图View-输入输出
[2]解耦(Decoupling)：视图和模型彼此分离，可以独立修改；模型可以被多个视图复用；多个视图可同时使用同一个模型；视图也可以被其他模型复用
④控制器（Controller）和视图（View）很难分离
[1]控制器需要输出：视图必须给控制器提供功能可视性（eg滚动条的拇指）还要对控制器状态的反馈（eg按下的按钮）
[2]控制器和视图共享的情况下谁来管理选择：必须由视图显示；必须由控制器来更新和使用；通常不应当在模型中选择，有些视图需要独立的选择(例如，同一文档上的两个窗口)，其他视图需要同步选择(例如，表视图和图表视图)
⑤小部件:紧密耦合的视图和控制器
小部件是一个可重用的视图对象，它同时管理输出和输入，有时被称为组件(Java、Flex)或控件(Windows)，例如 滚动条、按钮、菜单条
2.GUI编程方式（Approaches to GUI programming）
面向过程的（procedural）：代码表示，如何得到你想要的
声明式的（declarative）：代码表示，你想得到什么
直接操作（direct manipulation）：直接在操作界面创建你想要的（画图）
①标记语言HTML 声明性地指定视图树
②视图树操作JavaScript 循序渐进地改变视图树
③直接操作HTML编辑 AdobeDreamweaver
优点和缺点：
①说明性编程更简洁，程序员只需知道怎么说，不需要知道如何实现
②说明性编程可能更难调试，不能设置断点，不能单步调试，需要更多的试错
③说明性编程的规范使直接操作的创作工具成为可能，因为说明性编程的规范可以通过工具加载并保存，而过程性（程序性）编程不可以
燕山大学——软件用户界面设计（五）UI架构相关推荐
- 燕山大学——软件用户界面设计（八）原型设计
(1)为什么要使用原型设计? 可以更早的得到反馈 可以有更多实验选择 更容易改变或抛弃不好的原型 (2)原型的保真度 1) 低保真度:忽略细节 高保真度:贴近最终产品 2)保真度的多维度 广度:覆盖功 ...
- 关于Web软件的界面设计——《Web软件用户界面设计指南》
<Web软件用户界面设计指南>,一本小册子,花了不到一天的时间就看完了,但是,得到的东西却是非常多的. 在书里面指出了我们在做Web软件也就是B/S结构的软件的时候应该注意的问题,很多问题 ...
- 软件工程之用户界面设计（UI设计）
用户界面设计是为了满足软件专业化标准化的需求而产生的对软件的使用界面进行美化优化规范化的设计分支.具体包括软件启动封面设计,软件框架设计,按钮设计,面板设计,菜单设计,标签设计,图标设计,滚动条及状态 ...
- uidesigner android控件库,uidesigner(腾讯内部软件原型设计利器UI设计软件)v2.5.5.1官方版-独木成林...
UIDesigner软件在设计界面的时候,交互设计师或者产品经理等常常需要使用一些工具如:Visio.Axure RP.Flash或者OmniGraffle等)制作出静态稿或者原型来表达设计思想. U ...
- php++ui设计课程,UI设计主要学什么？
UI设计是指对软件的人机交互.操作逻辑.界面美观的整体设计:UI设计中文名字叫:用户界面设计.UI设计作为时下热门高薪职业之一,其发展前景不言而喻,应用领域非常广泛,那么UI设计都需要学习什么呢?下面 ...
- UI(用户界面)设计规则和规范
UI(用户界面)设计规则和规范 界面是软件与用户交互最直接的层,界面好坏决定用户对软件第一印象,而且设计良好的界面能够引导用户自己完成相应操作,起到向导作用. 目前流行的界面风格有三种方式:多窗体.单 ...
- 谈谈UI架构设计的演化
谈谈UI架构设计的演化 经典MVC 在1979年,经典MVC模式被提出. 在当时,人们一直试图将纯粹描述思维中的对象与跟计算机环境打交道的代码隔离开来,而Trygve Reenskaug在跟一些人的讨 ...
- 用户界面设计应该用那些软件？
工欲善其事必先利其器,一个好的UI设计师应该有自己的武器,那就是使用熟练的工具,那么哪些工具能够帮助我们设计用户界面呢? 一.Sketch [UI界面设计神器] Sketch Mac版是一 ...
- ui设计设计软件_60秒的UI设计
ui设计设计软件 " UI"代表"用户界面",是用户与事物进行交互的一种方式. 由于每个网站都是用户界面,因此" UI设计"是网站设计的核心 ...
最新文章
- Linux内核之内核同步（三）——自旋锁
- Week04-面向对象设计与继承
- 微信好友数据打包下载--微信数据分析（二）
- 2018年高教社杯全国大学生数学建模竞赛C题解题思路
- ECCV 2018 | OR-CNN行人检测：为‘遮挡’而生
- Java线程 Thread 的6种状态以及转变过程
- java swt 不显示图片_Java SWT按钮图像未刷新
- ux和ui_从UI切换到UX设计
- script 放置最佳位置以及 html 执行顺序
- 内网穿透 --- frp
- CentOS6.5安装与配置Mysql数据库
- Android Context简单说明
- oracle数据库之间数据同步
- xshell5 Xshell6 商业版的破解版
- LM2596DC -DC模块测试记录
- 批量安装windows系统补丁包
- linux常用软件收集
- css语义化命名_为什么我只在生产中使用语义命名
- NLP（八）：文本表示：word2vec原理及其gensim实现
- CC3200使用MQTT协议连接Onenet平台实践