GWT - 复选框控件

简介

复选框 控件表示一个标准的复选框。

类声明

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

public class CheckBox
   extends ButtonBase
      implements HasName

CSS 样式规则

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

.gwt-CheckBox {}

.gwt-CheckBox-disabled {}

类构造函数

序号	构造函数 & 描述
1	CheckBox() CheckkBox 的构造函数。
2	CheckBox(Element element) 子类可以使用此构造函数显式使用现有元素。
3	CheckBox(java.lang.String label) 创建一个带有指定文本标签的复选框。
4	CheckBox(java.lang.String label, boolean asHTML) 创建一个带有指定文本标签并将其内容设置为 HTML 的复选框。

类方法

序号	函数名称 & 描述
1	java.lang.String getName() 获取控件的名称。
2	int getTabIndex() 获取控件在选项卡索引中的位置。
3	java.lang.String getText() 获取此对象的文本。
4	boolean isChecked() 确定此复选框当前是否选中。
5	boolean isEnabled() 获取此控件是否启用。
6	protected void onEnsureDebugId(java.lang.String baseID) 受影响的元素：-label = 复选框旁边的标签。
7	protected void onLoad() 当控件附加到浏览器的文档时，将调用此方法。
8	protected void onUnload() 当控件从浏览器的文档中分离时，将调用此方法。
9	protected void replaceInputElement(Element elem) 用新的输入元素替换当前的输入元素。
10	void setAccessKey(char key) 设置控件的“访问键”。
11	void setChecked(boolean checked) 选中或取消选中此复选框。
12	void setEnabled(boolean enabled) 设置此控件是否启用。
13	void setFocus(boolean focused) 显式聚焦/取消聚焦此控件。
14	void setHTML(java.lang.String html) 通过 HTML 设置此对象的内容。
15	void setName(java.lang.String name) 设置控件的名称。
16	void setTabIndex(int index) 设置控件在选项卡索引中的位置。
17	void setText(java.lang.String text) 设置此对象的文本。
18	void sinkEvents(int eventBitsToAdd) 添加一组要由此对象接收的事件。
19	java.lang.String getHTML() 获取此对象的内容作为 HTML。

继承的方法

此类继承自以下类的方法：

com.google.gwt.user.client.ui.UIObject
com.google.gwt.user.client.ui.Widget
com.google.gwt.user.client.ui.FocusWidget
java.lang.Object

CheckBox 控件示例

此示例将引导您完成简单的步骤，以展示如何在 GWT 中使用 CheckBox 控件。按照以下步骤更新我们在GWT - 创建应用章节中创建的 GWT 应用：

步骤	描述
1	在GWT - 创建应用章节中说明的com.tutorialspoint包下创建一个名为HelloWorld的项目。
2	修改HelloWorld.gwt.xml、HelloWorld.css、HelloWorld.html和HelloWorld.java，如下所述。保持其余文件不变。
3	编译并运行应用程序以验证已实现逻辑的结果。

以下是修改后的模块描述符src/com.tutorialspoint/HelloWorld.gwt.xml的内容。

<?xml version = "1.0" encoding = "UTF-8"?>
<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.tutorialspoint.client.HelloWorld'/>

   <!-- Specify the paths for translatable code                    -->
   <source path = 'client'/>
   <source path = 'shared'/>

</module>

以下是修改后的样式表文件war/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;
}

以下是修改后的 HTML 宿主文件war/HelloWorld.html的内容。

<html>
   <head>
      <title>Hello World</title>
      <link rel = "stylesheet" href = "HelloWorld.css"/>
      <script language = "javascript" src = "helloworld/helloworld.nocache.js">
      </script>
   </head>

   <body>
      <h1>CheckBox Widget Demonstration</h1>
      <div id = "gwtContainer"></div>
   </body>
</html>

让我们在 Java 文件src/com.tutorialspoint/HelloWorld.java中包含以下内容，它将演示 CheckBox 控件的使用。

package com.tutorialspoint.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.CheckBox;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.VerticalPanel;


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

完成所有更改后，让我们像在GWT - 创建应用章节中一样，在开发模式下编译并运行应用程序。如果您的应用程序一切正常，这将产生以下结果：

当您单击单击我复选框时，它将显示一条警报消息，说明复选框是否选中。

gwt_form_widgets.htm

打印页面