Сопоставление компонентов AWT для GWT

Question

Я хотел бы реализовать 15-головоломку с Googles GWT.У меня есть реализация на Java (AWT), и я хотел бы преобразовать ее в GWT.

Плитка в паззле представлена ​​следующим образом:

import java.awt.Component;
import java.awt.image.BufferedImage;
import javax.imageio.ImageIO;
[...]

@SuppressWarnings("serial")
public class PuzzleTile extends Component {

    BufferedImage img = null;
    public int[] position = new int[2];
    int[] dim = new int[2];

    public PuzzleTile( String filename, int x, int y ) {
        this.position[0] = x;
        this.position[1] = y;

        try {
            this.img = ImageIO.read( new File(filename) );
            this.dim[0] = img.getWidth(null);
            this.dim[1] = img.getHeight(null);
        } catch (IOException e) {
            System.err.println( "ERROR: Can't open "+filename );
            throw new RuntimeException( "Image not found" );
        }
    }

    public void paint(Graphics g) {
        if ( null != this.img ) {
            g.drawImage( this.img, 0, 0, null );
        }
    }
    [...]
}

Таблица головоломок управляетсяследующий класс:

import java.awt.Component;
[...]

@SuppressWarnings("serial")
public class PuzzleBoard extends Component implements MouseListener {
    static final String DEFAULT_IMAGE_DIR = "images";
    static final String DEFAULT_TITLE = "Image Puzzle";
    int XSIZE=200;
    int YSIZE=180;

    PuzzleTile[][] board = null;
    //PuzzleTile emptyTile = null;
    int[] dim = new int[2];

    public PuzzleBoard( int x, int y ) {
        this.dim[0] = x;
        this.dim[1] = y;
        this.board = new PuzzleTile[x][y];
        loadTiles( "portrait" );
        this.addMouseListener( this );
    }

    public void loadTiles( String base ) {
        // Draw tiles expect last row
        int x;
        int y;
        for ( y = 0; y < this.dim[1]-1; ++y ) {
            for ( x=0; x < this.dim[0]; ++x ) {
                this.board[x][y] = new PuzzleTile( DEFAULT_IMAGE_DIR+"/"+base+"_"+y+"_"+x+".png" );
                //this.board[x][y].addMouseListener( this );
                //win.add( this.board[x][y] );
            }
        }

        // Draw last row with leftmost tile missing
        for ( x = 0; x < this.dim[0]-1; ++x ) {
            this.board[x][y] = new PuzzleTile( DEFAULT_IMAGE_DIR+"/"+base+"_"+y+"_"+x+".png" );
        }
    }

    public void paint(Graphics g) {
        for ( int xpos = 0; xpos < this.dim[0]; ++xpos ) {
            for ( int ypos = 0; ypos < this.dim[1]; ++ypos ) {
                Graphics area = g.create( xpos*XSIZE+1, ypos*YSIZE+1, XSIZE, YSIZE );
                if ( null != this.board[xpos][ypos] ) {
                    this.board[xpos][ypos].paint( area );
                }
            }
        }
    }

    @Override
    public void mouseClicked(MouseEvent e) {
        int xpos = e.getX() / this.XSIZE;
        int ypos = e.getY() / this.YSIZE;
        System.out.println( "Mouse clicked on tile ("+xpos+", "+ypos+")" );
        if ( null != this.board[xpos][ypos] ) {
            // Check for empty space around
            int[] freelocation = getEmptyNeighbor( xpos, ypos );
            System.out.println( "Empty neighbor: ("+freelocation[0]+", "+freelocation[1]+")" );
            if ( null != freelocation ) {
                this.board[freelocation[0]][freelocation[1]] = this.board[xpos][ypos];
                this.board[xpos][ypos] = null;
                this.repaint();
            }
        }
    }

        [...]

    /**
     * @param args
     */
    public static void main(String[] args) {
        Frame win = null;

        win = new Frame( DEFAULT_TITLE );
        win.addWindowListener(new WindowAdapter() {
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });

        PuzzleBoard puzzle = new PuzzleBoard( 2, 4 );
        win.add(puzzle);
        win.pack();
        win.setVisible(true);
    }
}

Кто-нибудь уже реализовал (или видел реализацию) сопоставление этих классов AWT с GWT?

Я могу видеть примерно следующие задачи:

• Создание сопоставления для компонента «изображение»
• Создание сопоставления для контейнера, который может содержать эти компоненты изображения
• Создание сопоставления для обработки событий в контейнере изображения

Есть ли кто-нибудь с немного большим опытом в расширении GWT, кто мог бы указать на некоторые подводные камни и дать мне несколько советов?

С уважением,

Мартин.

Answer 1

15 головоломок - это сетка.Что-то вроде FlexTable напрашивается само собой.Плитка кликабельна.Метка или гиперссылка поможет вам отображать и прослушивать щелчки на плитках.