GWT FlowPanel用法

GWT FlowPanel是最简单的面板, 因为它使用默认的HTML布局更改子窗口小部件的格式。在Flow Panel中, 由于HTMP元素未做任何修改, 即HTML div直接将其自身附加到子元素。

GWT FlowPanel类声明

让我们看看com.google.gwt.user.client.ui.FlowPanel的声明

public class FlowPanel extends ComplexPanel

GWTFlowTable构造函数

followig表包含GWT FlowPanel的构造函数。

GWT FlowPanel方法

GWT FlowPanel示例1

//SampleFlowPanel1.java

import com.google.gwt.event.dom.client.ClickEvent; 
import com.google.gwt.event.dom.client.ClickHandler; 
import com.google.gwt.user.client.ui.FlexTable; 
import com.google.gwt.user.client.ui.Label; 
import com.google.gwt.user.client.ui.RootPanel; 

public void onModuleLoad() {

// This is the entry point method. 
public void onModuleLoad() {
 FlowPanel flowPanel = new FlowPanel();
 // Add buttons to flow Panel \
for(int i = 1; i <= 5; i++){
 Button btn = new Button("Button " + i); flowPanel.add(btn); 
}
 // Add the Flow Panel to the root panel. RootPanel.get().add(flowPanel);
	}
 }

输出：

GWT FlowPanel示例2

//SampleFlowPanel2.java

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

public class HelloWorld implements EntryPoint {

   public void onModuleLoad() {
      // Create a flow panel			
      FlowPanel flowPanel = new FlowPanel();

      // Add Button to flow Panel
      for(int i = 1;  i <= 17; i++){
         Button button = new Button("Item" + i);
         flowPanel.add(Button);
      }

      DecoratorPanel decoratorPanel = new DecoratorPanel();
      decoratorPanel.setWidth("500");
      decoratorPanel.add(flowPanel);

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

//SampleFlowPanel2.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-Button {
   margin: 10px;	
}

输出：