1
2010

gwt布局的居中处理

先前写的videos项目,所有Panel都是从浏览器左上角开始的。对话框都是居中的,但是因为Panel,显得很别扭。

使用DockPanel进行居中处理,基本思路是,屏幕左边是WEST,屏幕中间是CENTER,屏幕右边是EAST,将项目的Panel填到DockPanel的CENTER。

通过Window方法获取到浏览器的宽度,如果超过640px,则宽度是640,如果宽度小于640,则充满整个宽度。

如果宽度不小于640,则左(WEST)右(EAST)各占去多出的1/2宽度。

这样就实现了居中。见:

if (Window.getClientWidth() > 640) {
    this.panel.setWidth("640px");
    int width = (Window.getClientWidth() – 640) / 2;
    this.leftPanel.setWidth(width + "px");
    this.rightPanel.setWidth(width + "px");
} else {
    this.panel.setWidth(Window.getClientWidth() + "px");
    this.leftPanel.setWidth(0 + "px");
    this.rightPanel.setWidth(0 + "px");
}

 

阅读全文 »

1
2010

gwt和spring security的集成方法

gwt如何与spring security集成,这是个问题。如果能够合理的集成,可以实现很多需要认证和授权的场合。

比如在访问需要授权的地方,显示登录界面:

image

登录后可以看到授权的界面:

image

阅读全文 »

26
2010

gwt编写最简单的flash播放器

在gwt上编写视频播放,可以使用bst项目,见:

http://oss.bramosystems.com/bst-player/

image

使用bst,编写了一个最简单的flash播放器,代码很简单:

public void onModuleLoad() {
    SimplePanel panel = new SimplePanel();
    AbstractMediaPlayer player = null;

    try {
        player = new FlashMediaPlayer(
                "http://marshal.easymorse.com/videos/test.mp4");
        panel.setWidget(player);
    } catch (PluginNotFoundException e) {
        e.printStackTrace();
    } catch (PluginVersionException e) {
        e.printStackTrace();
    } catch (LoadException e) {
        e.printStackTrace();
    }
    RootPanel.get().add(panel);

 

阅读全文 »

22
2010

gwt使用html5的Geolocation api

html5提供geolocation api,用于获取浏览器所处地理位置相关信息。

$(07FK8}AOP]%%QO4ZB``0L

通过pc上面的chrome/firefox访问获得的经纬度,发现还是很准的。

获得经纬度,可以通过:

http://maps.google.com/

在输入框中输入:纬度,精度,就可以得到对应的卫星图或者地图。

代码编写也很容易,这里使用了gwt,其实即使不使用gwt,写javascript也很简单。

这里使用的gwt模块,文档地址在:

http://code.google.com/p/gwt-mobile-webkit/wiki/GeolocationApi

下载地址:

http://code.google.com/p/gwt-mobile-webkit/downloads/list

选择gwt-html5-geolocation-xxx.tar.gz。解压缩,将其中的.jar文件部署到gwt项目的classpath下。

在模块的配置文件中,增加:

<inherits name="com.google.code.gwt.geolocation.Html5Geolocation" />

代码:

public void onModuleLoad() {
    if (Geolocation.isSupported()) {
        Geolocation geo = Geolocation.getGeolocation();
        if (geo != null) {
            geo.getCurrentPosition(new PositionCallback() {

                @Override
                public void onFailure(PositionError error) {
                    Window.alert("error");
                }

                @Override
                public void onSuccess(Position position) {
                    Coordinates o = position.getCoords();
                    RootPanel.get().add(
                            new HTML("位置,纬度:" + o.getLatitude() + ",经度:"
                                    + o.getLongitude()+",高度:"+o.getAltitude()));
                    RootPanel.get().add(
                            new HTML("精度:"+o.getAccuracy()));
                }

            });
            RootPanel.get().add(new HTML("支持Geolocation,使用"+Geolocation.getProviderName()));
        }
    }else{
        RootPanel.get().add(new HTML("对不起,您的浏览器不支持HTML5 Geolocation API。"));
    }

 

看到的效果,类似这样:

image

目前测试的结果是:

  • android不支持,看了文档,据说是2.0版本以后的支持,测试用的是1.5版本的g3;
  • iphone 3g,支持,OS 3.0;
  • chrome,支持;
  • firefox,支持;
  • opera,不支持;
  • safari,不支持。
22
2010

spring 3.0中的校验

在weapon项目中,表单在客户端实现了校验,简单而有效。但是还要提防可能出现的客户端校验失效问题,在这种情况下也要做到服务器端不会录入问题数据。这就需要服务器端校验。

spring 3.0引入了jsr 303的java校验工具框架。

需要导入的类库:

<dependency>
    <groupId>org.hibernate</groupId>
    <artifactId>hibernate-validator</artifactId>
    <version>4.0.0.GA</version>
</dependency>
<dependency>
    <groupId>org.slf4j</groupId>
    <artifactId>slf4j-log4j12</artifactId>
    <version>1.5.6</version>
</dependency>

 

阅读全文 »

21
2010

weapon项目增加文件上传功能

为weapon项目增加了图片上传功能。

image

这需要服务器端(Spring MVC)和客户端(GWT)两部分程序。

阅读全文 »

21
2010

用简单办法解决gwt不能动态加载图片问题

在gwt框架内找了很多办法,都不能解决图片的动态加载问题。当然刷新页面可以解决,但这相当于重新加载gwt模块了。

gwt使用Image类加载图片,使用url作为参数,结果就是相同的url只加载一次,而后不再向服务器发起请求。这样即使服务器端设置no cache等特性也无济于事。

解决办法,是在flash和ajax应用中普遍使用的办法,即给请求加时间戳。这样每次请求都不一样,gwt就必须再次发起get请求了。

代码:

this.image = new Image("/getImage.do?id=" + weapon.getId()+"&time="+System.currentTimeMillis());

21
2010

weapon项目服务器端动态加载图片

weapon项目已经可以加载图片了,见weapon项目增加图片的显示。但是静态的。

使用spring mvc动态加载图片文件,然后将流写入到Servlet输出流中。

代码如下:

@RequestMapping("/getImage.do")
public void getImage(@RequestParam("id") String id,
        HttpServletRequest request, HttpServletResponse response) {
    response.setHeader("Pragma", "No-cache");
    response.setHeader("Cache-Control", "no-cache");
    response.setDateHeader("Expires", 0);

    if (id == null || id.isEmpty()) {
        id = "1";
    }

    try {
        OutputStream outputStream = response.getOutputStream();
        BufferedInputStream inputStream = new BufferedInputStream(
                new FileInputStream(request.getSession()
                        .getServletContext().getRealPath("/images/")
                        + id));
        byte[] data = new byte[1024];
        for (int i = inputStream.read(data); i > 0; i = inputStream
                .read(data)) {
            outputStream.write(data, 0, i);
        }
        inputStream.close();
    } catch (IOException e) {
        throw new RuntimeException(e);
    }
}

 

阅读全文 »

20
2010

weapon项目增加图片的显示

如果只是编辑文字,过于枯燥了。给weapon项目的每个记录增加一个图片。

目前还是写死在程序里面的。

image

稍后将改为可修改的上传的图片。这需要使用文件上传功能。另外,目前的图片如果发生改变,不刷新页面的话,会使用缓存,也需要处理。

源代码:

http://easymorse.googlecode.com/svn/tags/Weapons-0.4.5/

20
2010

weapon项目修改表单为对话框

做了个简单的处理,将weapon项目中的表单处理为对话框。

做的不是很彻底,只是简单的。细作的话,需要调整事件处理部分。

截图:

image

阅读全文 »

第2页,共53页«12345678910»...后 »