GWT教程
 GWT FlexTable组件 GWT DeckPanel组件 

GWT Grid组件

GWT Grid组件 介绍

Grid组件代表矩形网格可以包含文本，HTML，或它的细胞内的子部件。它必须明确地调整为所需的行数和列数。

GWT Grid组件 声明

以下是com.google.gwt.user.client.ui.Grid类的声明

public class Grid
   extends HTMLTable

GWT Grid组件 构造方法

构造方法 描述
Grid() 构建一个新的 Grid。
Grid(int rows, int columns) 具有请求大小的网格的构造函数。

GWT Grid组件 方法

方法 描述
boolean clearCell(int row, int column) 用一个空格替换指定单元格的内容。
protected Element createCell() 创建一个新的空单元格。
int getCellCount(int row) 返回列数。
int getColumnCount() 获取此网格中的列数。
int getRowCount() 返回行数。
int insertRow(int beforeRow) 在表中插入一个新行。
protected void prepareCell(int row, int column) 检查单元格是否是表格中的有效单元格。
protected void prepareColumn(int column) 检查列索引是否有效。
protected void prepareRow(int row) 检查行索引是否有效。
void removeRow(int row) 从表中删除指定的行。
void resize(int rows, int columns) 调整网格大小。
void resizeColumns(int columns) 将网格调整为指定的列数。
void resizeRows(int rows) 将网格调整为指定的行数。

GWT Grid组件 示例

1）修改HelloWorld.gwt.xml

<!DOCTYPE module PUBLIC "-//Google Inc.//DTD Google Web Toolkit 2.8.0//EN"
        "http://gwtproject.org/doctype/2.8.0/gwt-module.dtd">
<module rename-to="HelloWorld">

    <!-- Inherit the core Web Toolkit stuff.                  -->
    <inherits name='com.google.gwt.user.User'/>

    <!-- Inherit the default GWT style sheet.                       -->
    <inherits name = 'com.google.gwt.user.theme.clean.Clean'/>

    <!-- Specify the app entry point class.                   -->
    <entry-point class='com.yiidian.helloWorld.client.HelloWorld'/>


    <!-- Specify the app servlets.                   -->
    <servlet path='/HelloWorldService' class='com.yiidian.helloWorld.server.HelloWorldServiceImpl'/>

    <source path = 'client'/>
    <source path = 'shared'/>
</module>

2）修改HelloWorld.css

body {
    text-align: center;
    font-family: verdana, sans-serif;
}

h1 {
    font-size: 2em;
    font-weight: bold;
    color: #777777;
    margin: 40px 0px 70px;
    text-align: center;
}

3）修改HelloWorld.html

<html>
<head>
    <title>yiidian.com-GWT Hello World</title>
    <link type="text/css" rel="stylesheet" href="HelloWorld.css">
    <script type="text/javascript" language="javascript" src="HelloWorld/HelloWorld.nocache.js"></script>
</head>
<body>
<h1>Grid Widget Demonstration</h1>
<div id = "gwtContainer"></div>
</body>
</html>

4）HelloWorld.java

package com.yiidian.helloWorld.client;


import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.ui.*;

/**
 * Entry point classes define <code>onModuleLoad()</code>
 */
public class HelloWorld implements EntryPoint {
    public void onModuleLoad() {
        // Create a grid
        Grid grid = new Grid(2, 2);

        // Add images to the grid
        int numRows = grid.getRowCount();
        int numColumns = grid.getColumnCount();
        for (int row = 0; row < numRows; row++) {
            for (int col = 0; col < numColumns; col++) {
                grid.setWidget(row, col,
                        new Image("http://www.yiidian.com/statics/images/logo.png"));
            }
        }

        DecoratorPanel decoratorPanel = new DecoratorPanel();
        decoratorPanel.add(grid);
        // Add the widgets to the root panel.
        RootPanel.get().add(decoratorPanel);
    }
}

运行应用程序，显示结果如下：

 GWT FlexTable组件 GWT DeckPanel组件 

热门文章

优秀文章

全部教程