前言:
在看这边文章前,可以建议看下:图形界面操作系统发展史——计算机界面发展历史回顾
从CS到BS,现在的前端开发,其实也是GUI开发范畴。现今
各平台的UI开发概况
HTML&CSS,Winform&WPF,Universal Windows APP,JAVA GUI, Android,iOS……
不一而足,先让我们看看
JAVA GUI
我觉得java是最好学的语言。也是像我这种非科班出生的,踏入码农行业的敲门砖(看C c++ 学了一年,也就hello word,会写几个demo界面)。
做java开发,从AWT/Swing、SWT/JFace,这个有IBM的大佬总结,传送门:https://www.ibm.com/developerworks/cn/java/j-gui/
我觉得,无论是c还是java,还是 后面的hmlt ,UI开发 总可以借鉴基本的 Swing Class 树
Object *Component Container *JComponent *AbstractButton JButton JMenuItem JCheckBonMenuItem JMenu JRadioButonMenuItem *JToggleButton JCheckBox JRadioButton Box Filler JColorChooser JComboBox JDesktopIcon JFileChooser JInternalFrame JLabel JLayeredPane JDesktopPane JList JMenuBar JOptionPane JPanel JPopupMenu JProgressBar JRootPane JScrollBar JScrollPane JSeparator JSlider JSplitPane JTabbedPane JTable JTableHeader *JTextComponent JEditorPane FrameEditorPane JTextPane JTextArea JtextField JPasswordField JToolBar JToolTip JTree JViewport ScrollableTabViewport Panel Applet JApplet Window Dialog JDialog Frame JFrame JWindow
Windows桌面应用程序开发Winform&WPF
Winform是XP时代的Windows 桌面程序开发技术。
采用C#语言开发UI和逻辑,没有使用标签语言写UI。
采用事件驱动方法。
Winform现在基本被淘汰了。
Winform是上一代的主流桌面应用程序开发开发技术,这个我从来没有用过,现在也基本不再使用了。
WPF是新一代微软图形界面开发技术。它是随着Windows Vista推出的。.NET Framework 3.0的一部分。它提供了统一的编程模型、语言和框架,真正做到了分离界面设计人员与开发人员的工作;同时它提供了全新的多媒体交互用户图形界面。
采用XAML标签式语言开发UI,可以在Expression Blend可视化设计开发。美工也可以轻易上手。XAML支持DataBind, Data(Item)Template, Style, Storyboard, Rescoure,自定义控件等技术,开发速度快。
支持事件驱动(Code behind)或者数据驱动(MVVM)开发模式
使用GC回收垃圾,XMAL和C#将编译成CLR中间运行语言,效率比较低,占用内存大
WPF的技术理念非常先进,开发过程也非常友好,也可以做出极为绚丽的界面,可是开发出来的应用体积较大,运行效率比较低,占用内存大,所以没有普及开来。(大部分我们常见的桌面应用都是C&C++开发)但是因为开发效率高,所以很多企业内部经常使用该技术。
Windows 10上的通用应用Universal WIndows APP(UWP)
Universal Windows App(UWP)也就是通用Window App 是微软最新的图形应用开发技术,它是基于WPF技术演进而来的。
UWP继承了所有WPF的优点,还可以使用C++和HTML&Javascript来开发,和WPF编译成中间代码不同,UWP直接将代码编译成机器码直接运行,极大的提高了效率。一次开发编译,可以同时在Windows 10,Windows 10 Mobile, XBOX,物联网IoT设备等其他Windows平台上运行
采用和iOS APP一样的沙盒机制,一样也有电话本,传感器,地图,推送等API。
采用响应式布局,可以适配任何分辨率等。
大量使用异步API,保证界面响应为最高级别。
我开发UWP并不多,但是我接触WPF的时间够长,所以UWP上手毫无压力。相比WPF运行在.NET运行时里,UWP是可以编译成Native Code运行,所以UWP运行效率更高,UI更为流畅。它是目前微软最为主推的开以技术。
Android
android开发,主要一xml来做界面(当然蛋疼手工写也可以。
一个界面xml对于一个active,active与active 桥接intent ,
但是,我更加喜欢iOS的界面开发模式(storybord,所以这里略过。
不过我觉得会ios开发的,上手android开发业不难
iOS
iOS应用是基于Cocoa框架上的,早期的Cocoa是用来开发Mac 应用的,后来加入了Cocoa touch层API用于iOS。
采用XIB或者Storyboard可视化搭建UI,也可以使用手写纯代码来开发UI。
采用Objective C 或者 Swift语言开发逻辑。
在Iphone5 加入多种分辨率后,苹果引入了Autolayout自动布局,它是一种基于约束的,描述性的布局系统。
默认严格遵守MVC设计模式,现以也可以使用MVVM开发框架。
采用ARC实现了自动内存管理。
iOS开发技术还有许多要点,这里就省略了,相信看到这篇文章的人都比较熟悉。
各平台UI开发小结
从上面可以看出,对于UI构建,都是采用类HTML语言。一个HTML标签表示一个View元素。它即可以当其他View的容器,也可以当内容或者数据的容器。可以用独立的Style文件来表示样式,也可以直接放在标签的属性里面。每个标签都可以有Name或者id属性来让js或者其他语言直接操作。
iOS其实也和上面的UI开发范式差不多,Storyboard内部其实也是一个XML文件,只不过我们不能直接编辑,只能可视化设计和通过代码操作。
Web界面的开发HTML&CSS
Web界面是以HTML标签的形式构建UI,它是HTML语言的最基本的单位。
用尖括号包围的关键词如
来表示UI元素,通常是成对出现。
如果需要在容器标签里放其他HTML单位,需要放在标签对里面。
一些HTML元素属性,放在第一个HTML标签里。以键值对的形式存在,比如type = 'text'。
使用Form来提交表单,Http(HTTPS)协议和服务器通讯。
通常通过CSS来控制HTML元素的外观。
通常通过Javescript来控制HTML元素。采用Ajax技术异步通信,实现局部刷新等。
这里就不给示例了,总是来说前端Web开发博大精深,新的技术框架层出不穷,当一个前端工程师也不容易。
从backbone,angular,到现在react+redux ,层出不穷,疲于奔命。你学了ie,还有firefox,还有chrome,……
一如前端深似海。
但是,前端的好处就是,统一GUI开发。我并不喜欢RN的开发模式,觉得还是
html+css+js 自己定制webkit壳,然后,你想怎么玩就怎么玩。(俗话中webapp……
吃饭去了,不扯了……