GWT CheckBox组件

GWT CheckBox组件 介绍

CheckBox组件代表标准复选框

GWT CheckBox组件 声明

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

public class CheckBox
   extends ButtonBase
      implements HasName

CSS 样式规则

以下默认 CSS 样式规则将应用于所有CheckBox标签。您可以根据您的要求覆盖它。

.gwt-CheckBox {}

.gwt-CheckBox-disabled {} 

GWT CheckBox组件 构造方法

构造方法 描述
CheckBox() CheckkBox 的构造函数。
CheckBox(Element element) 子类可以使用此构造函数来显式使用现有元素。
CheckBox(java.lang.String label) 创建具有指定文本标签的复选框。
CheckBox(java.lang.String label, boolean asHTML) 创建具有指定文本标签的复选框并将其内容设置为 HTML。

GWT CheckBox组件 方法

方法 描述
java.lang.String getName() 获取小部件的名称。
int getTabIndex() 获取小部件在选项卡索引中的位置。
java.lang.String getText() 获取此对象的文本。
boolean isChecked() 确定当前是否选中此复选框。
boolean isEnabled() 获取此小部件是否已启用。
protected void onEnsureDebugId(java.lang.String baseID) 受影响的元素:-label = 复选框旁边的标签。
protected void onLoad() 当小部件附加到浏览器的文档时会调用此方法。
protected void onUnload() 当小部件从浏览器的文档中分离时调用此方法。
protected void replaceInputElement(Element elem) 用新元素替换当前输入元素。
void setAccessKey(char key) 设置小部件的“key”。
void setChecked(boolean checked) 选中或取消选中此复选框。
void setEnabled(boolean enabled) 设置是否启用此小部件。
void setFocus(boolean focused) 显式聚焦/取消聚焦此小部件。
void setHTML(java.lang.String html) 通过 HTML 设置此对象的内容。
void setName(java.lang.String name) 设置小部件的名称。
void setTabIndex(int index) 设置小部件在选项卡索引中的位置。
void setText(java.lang.String text) 设置此对象的文本。
void sinkEvents(int eventBitsToAdd) 添加一组要由该对象沉没的事件。
java.lang.String getHTML() 以 HTML 形式获取此对象的内容。

GWT CheckBox组件 示例

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'/>

    <!-- 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;
}

.gwt-CheckBox{
    color:green;
}

.gwt-CheckBox-disabled {
    color:green;
}

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>CheckBox 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.user.client.Window;
import com.google.gwt.user.client.ui.*;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.DOM;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.event.dom.client.ClickEvent;

/**
 * Entry point classes define <code>onModuleLoad()</code>
 */
public class HelloWorld implements EntryPoint {
    public void onModuleLoad() {

        // Make a new check box, and select it by default.
        CheckBox checkBox1 = new CheckBox("Check Me!");
        CheckBox checkBox2 = new CheckBox("Check Me!");

        // set check box as selected
        checkBox1.setValue(true);

        //disable a checkbox
        checkBox2.setEnabled(false);

        checkBox1.addClickHandler(new ClickHandler() {

            @Override
            public void onClick(ClickEvent event) {
                CheckBox checkBox = (CheckBox)event.getSource();
                Window.alert("CheckBox is " +
                        (checkBox.getValue() ? "" : "not") + " checked");
            }
        });


        // Add checkboxes to the root panel.
        VerticalPanel panel = new VerticalPanel();
        panel.setSpacing(10);
        panel.add(checkBox1);
        panel.add(checkBox2);

        RootPanel.get("gwtContainer").add(panel);
    }
}

运行应用程序,显示结果如下:

当您单击“Click Me”复选框时,它会显示一条警告消息,提示“CheckBox is Checked”或“CheckBox is UnChcked”。

热门文章

优秀文章