LWUIT的布局与Style的使用

最新推荐文章于 2021-06-17 16:06:24 发布
最新推荐文章于 2021-06-17 16:06:24 发布
阅读量147 收藏
点赞数
分类专栏： java 文章标签： 招聘 SUN Swing CSS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/seaofforest/article/details/83637738
版权

一、LWUIT的布局

LWUIT一共有五个布局,分别是：

  1. BorderLayout；
  2. BoxLayout；
  3. FlowLayout；
  4. GridLayout；
  5. GroupLayout。

BorderLayout布局

BorderLayout与AWT或Swing中的BorderLayout相同，也是由东、西、南、北、中这五个区域组成。惟一不同的 BorderLayout不是容器Form的默认布局管理器，Form必须显式地指定它自己的布局管理器。下面给出一个示例：


图 1-1 BorderLayout示例

图中显示了5个Button组件，这五个Button组件都是用图片来表示的，它们分别分布在Form的东西南北中五个区域。其中，Form的布局 是BorderLayout。源代码如下:

package com.shen.lwuit;

import java.io.IOException;

import javax.microedition.midlet.MIDlet;
import javax.microedition.midlet.MIDletStateChangeException;

import com.sun.lwuit.Button;
import com.sun.lwuit.Display;
import com.sun.lwuit.Form;
import com.sun.lwuit.Image;
import com.sun.lwuit.layouts.BorderLayout;

public class TestLayout extends MIDlet {
	private Form form;
	private Button butt1,butt2,butt3,butt4,butt5;
	private static Image img1,img2,img3,img4,img5;

	public TestLayout() {
		Display.init(this);
		form = new Form("布局测试");
		form.setLayout(new BorderLayout());	
		TestLayout.getImageFromResource();
		butt1 = new Button("",img1);
		butt2 = new Button("",img2);
		butt3 = new Button("",img3);
		butt4 = new Button("",img4);
		butt5 = new Button("",img5);
	}

	protected void destroyApp(boolean arg0) 
	throws MIDletStateChangeException {

	}

	protected void pauseApp() {
		
	}

	protected void startApp() throws MIDletStateChangeException {
		form.addComponent(BorderLayout.EAST, butt1);
		form.addComponent(BorderLayout.SOUTH, butt2);
		form.addComponent(BorderLayout.WEST, butt3);
		form.addComponent(BorderLayout.NORTH, butt4);
		form.addComponent(BorderLayout.CENTER, butt5);
		form.show();
	}
	
	public static void getImageFromResource(){
		try {
			Image sourceImg = Image.createImage("/mainInterface.png");
			img1 = sourceImg.subImage(0, 0, 50, 45,true);
			img2 = sourceImg.subImage(50, 0, 50, 45, true);
			img3 = sourceImg.subImage(100, 0, 50, 45, true);
			img4 = sourceImg.subImage(0, 45, 50, 45, true);
			img5 = sourceImg.subImage(50, 45, 50, 45, true);
		} catch (IOException e) {
			e.printStackTrace();
		}
	}
}

FlowLayout布局

FlowLayout布局也与AWT或Swing的FlowLayout布局相同，都是将组件从左向右，从上往下的排列，默认布局为居中对齐。在这 里就不做叙述了。

BoxLayout布局

BoxLayout相当于Swing里的BoxLayout布局，它将组件沿X轴或Y轴排列，当沿X轴排列时，只有一行；沿Y轴排列时，只有一列。 BoxLayout布局在LWUIT中被大量使用，下面给出一个示例：


图 1-2 BoxLayout示例

图中显示了四个Button组件，每个Button组件都是图片与文字混合显示的。这些Button组件都是放在容器Form中的，Form的布局 是BoxLayout，并且沿Y轴排列的。源代码如下：

package com.shen.lwuit;

import java.io.IOException;

import javax.microedition.midlet.MIDlet;
import javax.microedition.midlet.MIDletStateChangeException;

import com.sun.lwuit.Button;
import com.sun.lwuit.Display;
import com.sun.lwuit.Form;
import com.sun.lwuit.Image;
import com.sun.lwuit.layouts.BoxLayout;

public class TestLayout1 extends MIDlet {
	private Form form;
	private static Image img1,img2,img3,img4;
	private Button butt1,butt2,butt3,butt4;

	public TestLayout1() {
		Display.init(this);
		form = new Form("BoxLayout测试");
		TestLayout1.getImageFromResource();
		butt1 = new Button("人才招聘",img1);
		butt2 = new Button("科技园区",img2);
		butt3 = new Button("招聘会",img3);
		butt4 = new Button("简  历",img4);
		form.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
		form.addComponent(butt1);
		form.addComponent(butt2);
		form.addComponent(butt3);
		form.addComponent(butt4);
	}

	protected void destroyApp(boolean arg0) throws 
	MIDletStateChangeException {
		// TODO Auto-generated method stub
		
	}

	protected void pauseApp() {
		// TODO Auto-generated method stub
		
	}

	protected void startApp() throws MIDletStateChangeException {
		form.show();
	}

	public static void getImageFromResource(){
		Image sourceImg = null;
		try {
			sourceImg = Image.createImage("/handset2.png");
			img1 = sourceImg.subImage(80, 0, 28, 28,true);
			img2 = sourceImg.subImage(80, 28, 28, 28, true);
			img3 = sourceImg.subImage(80, 56, 28, 28, true);
			img4 = sourceImg.subImage(80, 84, 28, 28, true);
		} catch (IOException e) {
			e.printStackTrace();
		}
		
	}
}

GridLayout布局

LWUIT中的GridLayout与AWT或Swing中的GridLayout布局是一样的，它最大的特点就是要求布局中的每个组件的尺寸是一 样的。在LWUIT中，常常将GridLayout与BoxLayout结合起来进行使用，以构建出更复杂的界面。

GroupLayout布局

LWUIT的GroupLayout与Swing的GroupLayout是一样的。GroupLayout分为水平与垂直两个方向，组件可以同时 沿着两个方向排列。下面是一个示例：

源代码如下：

JComponent panel = new JComponent();
   GroupLayout layout = new GroupLayout(panel);
   panel.setLayout(layout);
 
   layout.setAutoCreateGaps(true);
 
   layout.setAutoCreateContainerGaps(true);
 
   GroupLayout.SequentialGroup hGroup = layout.createSequentialGroup();
 
   hGroup.addGroup(layout.createParallelGroup().
            addComponent(label1).addComponent(label2));
   hGroup.addGroup(layout.createParallelGroup().
            addComponent(tf1).addComponent(tf2));
   layout.setHorizontalGroup(hGroup);
   
   GroupLayout.SequentialGroup vGroup = layout.createSequentialGroup();
 
   vGroup.addGroup(layout.createParallelGroup(Alignment.BASELINE).
            addComponent(label1).addComponent(tf1));
   vGroup.addGroup(layout.createParallelGroup(Alignment.BASELINE).
            addComponent(label2).addComponent(tf2));
   layout.setVerticalGroup(vGroup);

GroupLayout在LWUIT中使用得很少。

二、LWUIT中Style的使用

Style对象用来给特定的组件设置颜色、字体、透明度、边距、内边距（padding）、图片以及边框等。它在LWUIT中的作用相当于CSS在 HTML文件中的作用一样，对LWUIT界面起美化的作用。每个组件都包含一个被选中的对象并且允许Style对象在运行时使用 Component.getSelected()方法与Component.getUnselected()方法对现有的Style样式进行修改。我们经 常使用Style的相关方法对LWUIT界面进行美化。例如，在上面的图1-2中的例子中，向大家展示了一个BoxLayout的示例，在这个例子中的四 个Button组件的边框都是一条黑线，现在，我要通过Style对象来去掉它们的边框，同时，再添加几个按钮，并同样通过Style对象对按钮菜单的样 式进行更改，使其更美观。

下面是对图1-2的例子添加了Style修饰效果后的演示：

其源代码如下：

package com.shen.lwuit;

import java.io.IOException;

import javax.microedition.midlet.MIDlet;
import javax.microedition.midlet.MIDletStateChangeException;

import com.sun.lwuit.Button;
import com.sun.lwuit.Command;
import com.sun.lwuit.Display;
import com.sun.lwuit.Form;
import com.sun.lwuit.Image;
import com.sun.lwuit.layouts.BoxLayout;
import com.sun.lwuit.plaf.Border;
import com.sun.lwuit.plaf.Style;

public class TestStyle extends MIDlet {
	private Form form;
	private static Image img1,img2,img3,img4;
	private Button butt1,butt2,butt3,butt4;
	private Command cmd1,cmd2,cmd3;

	public TestStyle() {
		Display.init(this);
		form = new Form("BoxLayout测试");
		TestStyle.getImageFromResource();
		butt1 = new Button("人才招聘",img1);
		this.setButtonStyle(butt1);
		
		butt2 = new Button("科技园区",img2);
		this.setButtonStyle(butt2);
		butt3 = new Button("招聘会",img3);
		this.setButtonStyle(butt3);
		butt4 = new Button("简  历",img4);
		this.setButtonStyle(butt4);
		form.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
		form.addComponent(butt1);
		form.addComponent(butt2);
		form.addComponent(butt3);
		form.addComponent(butt4);
		
		cmd1 = new Command("确定");
		cmd2 = new Command("取消");
		cmd3 = new Command("退出");
		form.addCommand(cmd1);
		form.addCommand(cmd2);
		form.addCommand(cmd3);
		this.setSoftButtonStyle();
		this.setMenuStyle();
	}

	protected void destroyApp(boolean arg0) throws 
	MIDletStateChangeException {
		// TODO Auto-generated method stub
		
	}

	protected void pauseApp() {
		// TODO Auto-generated method stub
		
	}

	protected void startApp() throws MIDletStateChangeException {
		form.show();
	}
	
	public void setButtonStyle(Button butt){
		Style style = butt.getSelectedStyle();
		style.setFgColor(0xFF0000);
		style.setBgColor(0x000000);
		style.setBgTransparency(30);
		style.setBorder(Border.createEmpty());
	}
	
	public void setSoftButtonStyle(){
       Style style = form.getSoftButtonStyle();
       style.setBgColor(0xFFFF08);
       style.setBgTransparency(30);
	}
	
	public void setMenuStyle(){
		Style style = form.getMenuStyle();
		style.setBgTransparency(40); //设置背景的透明度
	}

	public static void getImageFromResource(){
		Image sourceImg = null;
		try {
			sourceImg = Image.createImage("/handset2.png");
			img1 = sourceImg.subImage(80, 0, 28, 28,true);
			img2 = sourceImg.subImage(80, 28, 28, 28, true);
			img3 = sourceImg.subImage(80, 56, 28, 28, true);
			img4 = sourceImg.subImage(80, 84, 28, 28, true);
		} catch (IOException e) {
			e.printStackTrace();
		}
		
	}
}

好，到这里，我们这一次的关于LWUIT的介绍就接近尾声了，希望有兴趣的读者下去多加练习.

 

原文：

http://express.ruanko.com/ruanko-express_16/webpage/tech-overnight_1.html

seaofforest
关注
专栏目录
Layui布局变化利用style改变布局
weixin_44550209的博客
06-09 3730
作者：李国林 再很多时候，我们在学习MVC或者页面的布局的时候，我们都会有很多的插件来完成，而这些插件都是已经封装好的样式在里面，然而，如果是自己第一次布局，就会有一点是手足无措，因此，我们在搭建页面的时候就会出现很多问题，即使是html里面进行页面布局，有时候也会有一点错误，因为有一些插件已经是封装好的，因此我们是引用他的样式，然后进行里面的样式进行用，但是有一些样式的位置就会有一些是不符合我们...
LWUIT布局设置
03-09
本文将深入探讨LWUIT中提供的七种布局管理器，包括边框布局(BorderLayout)、盒布局(BoxLayout)、流布局(FlowLayout)、网格布局(GridLayout)、组布局(GroupLayout)、坐标布局(CoordinateLayout)和表格布局...
LWUIT.jar LWUIT.jar
11-02
LWUIT.jarLWUIT.jarLWUIT.jarLWUIT.jarLWUIT.jarLWUIT.jar
合理利用style文件，使布局中的代码简洁
ZCJ-阿杰的博客
11-01 367
在我们搭建界面的时候，我们常常可以碰到一种情况，就是，这个界面，所有的布局差不多都一样类似于下面这种: 这个界面，一看，基本上都是一样的格式，一张图片，文字，再加上一张图片，这个时候，很多新手同学可能就开始写了，一个imageView+textView+image，OK 完成，然后在复制粘贴，好，完成了这个界面的搭建，但是，这样一来，你的代码量增加了很多，这样写估计要写200多行代码吧，阿杰...
html中style布局放哪,CSS样式表与格式布局详解
weixin_42124743的博客
06-17 1450
样式表CSS(Cascading Style Sheets 层叠样式表)，作用是美化HTML网页。内联样式表： 例：内联样式表内嵌样式表：必须写在head标签里例：p{ 样式;}hei外部样式表：新建一个CSS文件用来放置样式表 在HTML中 右键--CSS样式--附加样式表例：*{ margin:0px; padding:0px;} //网页边距为0像素 字体间距为0像素.mian /...
LWUIT + ChartComponent 之一实现饼图(PieChart)
hellogv的专栏
12-15 5767
本文来自http://blog.csdn.net/hellogv/     本文源代码下载地址：http://download.csdn.net/source/872671    本文所用的Chart组件为J2me ChartComponent - ver 1.5.2，该组件的下载页面为http://www.beanizer.org/site/index.php/en/Software/J2me-
LWUIT布局详解：七大布局管理器与 BorderLayout应用实例
5. 组合布局(GridLayout)：与GridLayout类似，但允许动态调整行和列的大小，更加灵活。 6. 坐标布局(Coordinate Layout)：允许精确控制每个组件的相对位置和大小，适合复杂的布局需求。 7. 表格布局(TableLayout)...
LWUIT入门教程：使用与组件介绍
" lwuit 使用心得总结" 在移动应用开发领域，LWUIT（ Lightweight UI Toolkit ）是一个重要的组件，尤其对于J2ME平台而言。它由Sun Microsystems（后来被Oracle收购）开发，提供了丰富的用户界面元素和强大的布局...
lwuit_demo_src.rar_DEMO_J2ME lwuit de_LWUIT_lwuit demo
09-22
开发者可以通过研究这些源代码，学习如何初始化LWUIT环境，创建和布局UI组件，处理用户事件，以及自定义组件样式等。 在标签中提到了"demo j2me"，这表明这个示例是针对J2ME平台的。J2ME是Java的一个子集，主要用于...
LWUIT1.3code.rar_LWUIT
09-19
6. **国际化与本地化**：LWUIT 支持多语言和文化环境，方便开发者构建全球化应用。 在"LWUIT1.3源码"中，你可以深入研究其内部实现，理解以下几个关键部分： - **Component类**：这是LWUIT的基础组件类，其他所有...
J2ME文件浏览器（LWUIT版）
12-29
J2ME文件浏览器（LWUIT版），详情请看我的博客。
最新LWUIT_1_5
02-14
LWUIT哦，最新的包，学习学习。非常好用哦
Lwuit精简解说，Lwuit的21条
不抛弃，不放弃
03-08 1030
    虽说标题是精简解说，但总的来说内容还是很多的，如果不想看搅人的英文或繁琐的API，以下的一些文字也许能够作为你的中文精简参考文档，即使你不是做Java开发的（也许将来你会），我想下面的知识也是值得收藏的。如果你不知道一些组件的基本使用方法，或者是布局方式，文中几句话就能得到你所想要的。       本人是做.NET开发的，由于新找的工作，去到公司时，.NET网站已经处于收尾阶段，现在要
lwuit 的ui开发
小科学家的专栏
12-04 210
   一、LWUIT简介Sun公司在2008年的Java One会议上向开发者社区推荐了LWUIT，即Light Weight UI Toolkit。LWUIT是一个轻量级Java ME UI工具包，类似Swing 的MVC架构, 支持多种布局, 皮肤更换, 字体, 触摸屏, 动画效果, Rich控件, 3D集成, Painter, 模式对话框, I18N/L10N等。Sun公司已发布了LWUI...
lwuit研究中
vearyy的专栏
10-16 110
这个gui做界面不错，省时间，不过目前正在研究中文字库，比较麻烦。
轻量级用户界面工具包（LWUIT）简介
Lightweight User Interface Toolkit
11-01 1136
 一般来说，Java ME 让我们能够编写可在支持该平台的众多小型设备中移植的应用程序。虽然基本功能在所有受支持的设备上表现良好，但用户界面仍然是困扰开发者的一个常见问题。由于 javax.microedition.lcdui （Java ME 中的主要用户界面 API）的本地实现在不同设备上差异非常大，因此我们无法保证应用程序拥有设备无关和统一的界面外观。不统一的
J2ME配置Lwuit
邪道少年
01-20 124
[color=green]使用Eclipse加入Lwuit jar包配置方法 [/color] 1.先将以前安装的eclipseme插件卸掉，将eclipse升级成MTJ eclipse，需要下载一个MTJ的jar包，在我博客的附件里也会加载，大家下载一下就可以了，现在很多网上写的博客关于怎么配置Lwuit的详细说明都太简洁，导致配置是有很多的麻烦，我也希望大家不要只配置上花费太多的精力。 ...
解读 LWUIT 之三：LWUIT 控件（上）
Defonds 的专栏
02-21 4759
解读 LWUIT 之三：LWUIT 控件（上） LWUIT 开发指南下载 作者写的 HelloForm 源代码下载 作者写的 HelloLabel 源代码下载 作者写的 HelloButton 源代码下载          LWUIT 开发指南花了比较大的篇幅介绍控件，因为这是它的核心 —— LWUIT 就是一个组件库。如果你是一个 LWUIT 爱好者，花大时间去熟悉 LWUIT 控件一
解读 LWUIT 之五：LWUIT 控件（下）
Defonds 的专栏
02-23 6446
解读 LWUIT 之五：LWUIT 控件（下） LWUIT 开发指南下载 作者写的 Hello TabbedPane、Hello TextArea、Hello TextField、Hello Calendar、Hello Tickering 源代码下载         本文继上篇博客继续对 LWUIT 常见控件进行介绍。本文主要介绍剩余的几个 LWUIT 常用控件选项卡（TabbedPane
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值