| 网站首页 | 文章中心 | 电子书下载 | 矢量图库 | 视频教程 | 素材下载 | 程序代码下载 | JS代码 | 论坛 | 
常用软件类：
 |杀毒安全 |联络聊天 |网络软件 |多媒体类 |系统工具 |图形图像 |系统工具 |应用软件 |行业软件
开发设计类：
 |动画制作 |图像处理 |3D设计 |操作系统 |站长学院 |网络相关 |WEB设计 |数据库类 |程序开发
基于Java的界面布局DSL的设计与实现

作者：佚名    文章来源：网络    点击数：    更新时间：2007-9-17
收藏此文到百度搜藏 百度搜藏| 新浪VIvi| 365key| Younote| 搜狐 | 博采中心| 你好BLOG| 亿友网摘| 网摘博客| POCO网摘| 和讯网摘|
　


　　我们还可以构建出 h_seq 和 v_seq 这样的布局样式，它们分别为把一组给定的布局元素横向顺序排列和纵向顺序排列，其实现如下：

public Component h_seq(Component[] cps) {
int len = cps.length;
if(len == 1) return cps[0];
return beside(cps[0], h_seq(slice(cps, 1, len)), 1.0/len);
}

public Component v_seq(Component[] cps) {
int len = cps.length;
if(len == 1) return cps[0];
return above(cps[0], v_seq(slice(cps, 1, len)), 1.0/len);
}

　　其中 slice 方法有 3 个参数，一个为布局元素数组，另外两个为区间的起止位置，该方法把给定布局元素数组中指定起止位置的区间部分作为一个新的布局元素数组返回。这两个方法的实现都比较简单直接。下面是两个应用例子：

Component[] cps = new Component[]
{ Button().title(“1”), Button().title(“2”), Button().title(“3”) };
h_seq(cps).at(0,0,300,60).in(C)
v_seq(cps).at(0,0,150,200).in(C)

　　在 center、h_seq、v_seq 这些布局样式的基础上，我们可以定义出更加高阶的样式来，比如，给定一布局元素序列，我们希望它们在给定的布局空间中按照 N 行、M 列排列。我们称之为 block，其实现如下：

public Component block (Component[] cps, int N, int M) {
Component[][] fcps = formalize(cps, N, M);
Component[] rows = new Component[fcps.length];
for(int i = 0; i ＜ fcps.length; i++) {
rows[i] = h_seq(fcps[i]);
}
return v_seq(rows);
}

　　其中 formalize 是一个工具方法，它把一个给定的布局元素数组规范化为 N 行 M 列的形式，如果不足则用 Empty 组件补齐。

　　如果希望在 block 中，每个元素都可以指定一些横向和纵向的留白，则可以定义一个 block_with_margin 布局样式，其实现如下：

public Component block_with_margin(Component[] cps, int N, int M,
float hRatio, float vRatio) {
Component[] ncps = new Component[cps.length];
for(int i=0; i＜cps.length; i++) {
ncps[i] = center(cps[i], hRatio, vRatio);
}
return block(ncps, N, M);
}

　　好了，现在我们来看一个稍微复杂一些的例子，我们将使用前面制作的一些布局样式构建一个迷你计算器的外观，如下图所示：

　　对应的描述代码如下：

Component[] cs = new Component[]{
Button().title("0"),
Button().title("1"),
Button().title("2"),
Button().title("+"),
Button().title("3"),
Button().title("4"),
Button().title("5"),
Button().title("-"),
Button().title("6"),
Button().title("7"),
Button().title("8"),
Button().title("*"),
Button().title("9"),
Button().title("="),
Button().title("%"),
Button().title("/")
};
Component opLayout = block(cs,4,4);
above( above( TextField(),
beside( Button().title("Backspace"), Button().title("C"),0.5), 0.5),
block(cs,4,4), 0.3).at(0,0,300,200).in(C);

　　如果我们现在希望将所有数字以及操作按钮按照横向和纵向各 2% 进行留白，我们所要做的仅仅是一行的改动，就是把：

Component opLayout = block(cs,4,4);

　　更改为：

Component opLayout = block_with_margin(cs, 4, 4, 0.02, 0.02);


　　这意味着什么呢？这意味着我们可以直接使用布局语言进行界面制作，我们可以直接针对布局进行编程，我们所写出来的界面代码就是我们的布局规格说明。

　　从上面的介绍中，读者可以看出，我们的界面布局语言可以非常方便地定义出一些常见的布局样式，还可以把这些样式组合成更为复杂的一些高阶布局样式，并且这种组合是没有任何限制的。此外，这些布局样式的定义描述方式是和界面设计者头脑中所使用的一些布局词汇和规则贴近的。通过使用界面布局语言，界面设计者完全可以摆脱那些呆板、机械又难以定制和扩展的布局管理器，可以轻松地把头脑中的布局创意直接描述出来，逐步形成自己的布局样式库，充分享受这种创造性的工作所带来的乐趣。

上一页  [1] [2] [3] 下一页


  • 上一篇文章：

  • 下一篇文章： 没有了
    • 相关文章