3D技術研究所Wiki > TGAReader > TGA画像をGWTウェブアプリケーションで利用する

TGA画像をGWTウェブアプリケーションで利用する方法をまとめています。

情報

このページの解説はGWTのセットアップを完了していることを前提としています。
まだの場合はGWTをセットアップする方法を先にお読みください。

Qiitaで詳細な解説をしています。
ブラウザサポート外の画像を扱う方法も合わせてご覧ください。

TGA画像の読み込みにはTGAReaderを利用しています。

目次


概要

TGA画像をウェブブラウザ上で利用できるようにします。

オンラインデモページ
http://npe-net.appspot.com/npesdk/gwt/tgaimagedemo/index.html

tgaimagedemo.png

ソースコード

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
import com.google.gwt.canvas.client.Canvas;
import com.google.gwt.canvas.dom.client.CanvasPixelArray;
import com.google.gwt.canvas.dom.client.Context2d;
import com.google.gwt.canvas.dom.client.ImageData;
import com.google.gwt.typedarrays.client.Uint8ArrayNative;
import com.google.gwt.typedarrays.shared.ArrayBuffer;
import com.google.gwt.xhr.client.ReadyStateChangeHandler;
import com.google.gwt.xhr.client.XMLHttpRequest;
import com.google.gwt.xhr.client.XMLHttpRequest.ResponseType;

private Canvas createImageCanvas(int [] pixels, int width, int height) {

    Canvas canvas = Canvas.createIfSupported();
    canvas.setCoordinateSpaceWidth(width);
    canvas.setCoordinateSpaceHeight(height);

    Context2d context = canvas.getContext2d();
    ImageData data = context.createImageData(width, height);

    CanvasPixelArray array = data.getData();
    for(int i=0; i<width*height; i++) { // ABGR
        array.set(4*i+0, pixels[i] & 0xFF);
        array.set(4*i+1, (pixels[i] >> 8) & 0xFF);
        array.set(4*i+2, (pixels[i] >> 16) & 0xFF);
        array.set(4*i+3, (pixels[i] >> 24) & 0xFF);
    }
    context.putImageData(data, 0, 0);

    return canvas;

}

private void addDDSCanvas(String url) {
    XMLHttpRequest request = XMLHttpRequest.create();
    request.open("GET", url);
    request.setResponseType(ResponseType.ArrayBuffer);
    request.setOnReadyStateChange(new ReadyStateChangeHandler() {
        @Override
        public void onReadyStateChange(XMLHttpRequest xhr) {
            if(xhr.getReadyState() == XMLHttpRequest.DONE) {
                if(xhr.getStatus() >= 400) {
                    // error
                    System.out.println("Error");
                }
                else {
                    try {
                        // ArrayBufferからbyte配列へ変換します
                        ArrayBuffer arrayBuffer = xhr.getResponseArrayBuffer();
                        Uint8ArrayNative u8array = Uint8ArrayNative.create(arrayBuffer);
                        byte [] buffer = new byte[u8array.length()];
                        for(int i=0; i<buffer.length; i++) {
                            buffer[i] = (byte)u8array.get(i);
                        }

                        // TGA画像の読み込みを行います
                        int pixels [] = TGAReader.read(buffer, TGAReader.ABGR);
                        int width = TGAReader.getWidth(buffer);
                        int height = TGAReader.getHeight(buffer);

                        // TGA画像キャンバスを作ります
                        Canvas canvas = createImageCanvas(pixels, width, height);

                        panel.add(canvas);
                    }
                    catch(Exception e) {
                        e.printStackTrace();
                    }
                }
            }
        }
    });
    request.send();
}

関連ページ


スポンサードリンク

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS