首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 媒体动画 > flex >

UI开发方式对比:JSP、Android、Flex

2013-07-16 
UI开发模式对比:JSP、Android、Flex前一篇文章分析了Java平台下不同类型WEB框架对开发模式的影响,多数Java领

UI开发模式对比:JSP、Android、Flex

前一篇文章分析了Java平台下不同类型WEB框架对开发模式的影响,多数Java领域的WEB框架都是聚焦于服务端MVC的实现,这些框架对View的支持,通常是基于标准的JSP或类似JSP的模板技术如Freemarker或Velocity。JSP或类JSP的模板技术已经是上个世纪的页面技术了,它能跟上时代的发展和技术的进步吗?

我们先看一段典型的JSP页面代码(摘自Struts2样例代码):

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"    pageEncoding="ISO-8859-1"%><%@ taglib prefix="s" uri="/struts-tags" %><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"><title>Hello World!</title></head><body><h2><s:property value="messageStore.message" /></h2><p>I've said hello <s:property value="helloCount" /> times!</p><p><s:property value="messageStore" /></p></body></html>

再看一段Android平台下UI开发的代码(摘自Android开发手册):

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"? ? ? ? ? ? ? android:layout_width="fill_parent" ? ? ? ? ? ? ? android:layout_height="fill_parent"? ? ? ? ? ? ? android:orientation="vertical" >? ? <TextView android:id="@+id/text"? ? ? ? ? ? ? android:layout_width="wrap_content"? ? ? ? ? ? ? android:layout_height="wrap_content"? ? ? ? ? ? ? android:text="I am a TextView" />? ? <Button android:id="@+id/button"? ? ? ? ? ? android:layout_width="wrap_content"? ? ? ? ? ? android:layout_height="wrap_content"? ? ? ? ? ? android:text="I am a Button" /></LinearLayout>

还可以看看Flex UI代码(摘自Flex开发手册):

<?xml version="1.0"?><!-- containers\layouts\VBoxSimple.mxml --><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">    <mx:VBox borderStyle="solid"         paddingTop="10"        paddingBottom="10"         paddingLeft="10"         paddingRight="10">                <mx:Button id="fname" label="Button 1"/>        <mx:Button id="lname" label="Button 2"/>        <mx:Button id="addr1" label="Button 3"/>        <mx:ComboBox id="state">              <mx:ArrayCollection>                 <mx:String>ComboBox 1</mx:String>              </mx:ArrayCollection>                 </mx:ComboBox>    </mx:VBox></mx:Application>

对比上面三段代码,可以看出JSP页面技术与Android及Flex UI技术的差异:

命令式 vs. 声明式:JSP是命令式代码编写方式,而Android及Flex是声明式;组件化:JSP代码的组件能力很差,主要通过标签库tag lib实现展现逻辑的利用,而Android及Flex都有专门设计的组件机制;布局支持:JSP对页面展示的布局没有支持,Android及Flex都有大量的布局组件实现声明式布局;数据组件:JSP没有支持,Android有ContentProvider抽象,Flex则有各种数据对象,用于存取本地或远程数据

声明式和组件化应该是必然的趋势,由此可见JSP技术的落后。但遗憾的是目前Java平台还没有什么技术可以取代JSP:JSF是基于JSP的新一代页面技术,但从设计上看JSF相比Android和Flex还较大差距;GWT之类的框架也可以取代JSP,但GWT走向了纯命令式的相反方向。

?

如果向Android和Flex的开发模式看齐,基于Java平台开发WEB应用的最佳方式应该是HTML+JS+JSON。HTML也是声明式的,本质上和前面Android及Flex的UI技术类似;JS相当于Android中的Java及Flex中的ActionScript,JSON用于客户端与服务端进行数据交换。只是HTML+JS+JSON也有其不足之处:

HTML内建组件(tag)相比Flex及Android的组件,其表现力不够,比如HTML没有布局组件,HTML的table相比Flex的DataGrid组件过于低层;HTML本身的设计并非是用于UI,比如其没有考虑数据绑定机制,也没有数据组件之类的概念;HTML没有组件定制能力,而Android及Flex都设计了自定义组件的机制;

由于存在以上不足,就出现了EasyUI/DWZ等声明式的UI框架,这也是WEB开发模式浅析中建议采用EasyUI/DWZ等框架的理由。

?

回到Java世界,是否可以在服务端设计一种声明式、组件化的页面技术用于取代传统JSP页面技术呢?

?

?

热点排行