JavaFX2.0 标题窗格TitledPane和手风琴控件Accordion.doc

标题窗格就是带有标题的面板，可以被打开和关闭，也可以被包进任何Node元素，诸如UI控件、图片、计入布局容器的元素组。标题窗格可以用手风琴控件来形成组。手风琴控件能创建多个窗格而每次只显示一个。Figure 20-1是带有3个标题窗格的手风琴控件。Figure 20-1 Accordion with Three Titled PanesDescription of Figure 20-1 Accordion with Three Titled PanesJavaFX SDK API中的Accordion和TitledPane类用来实现这样的控件。创建Titled Panes创建TitledPane控件要定义一个标题和一些内容。可以使用TitledPane类的带有两个参数的构造方法，或者单独使用setText和setContent方法也行。两种方法都在Example 20-1中 .Example 20-1 Declaring a TitledPane Object/using a two-parameter constructor TitledPane tp = new TitledPane(My Titled Pane, new Button(Button); /applying methods TitledPane tp = new TitledPane(); tp.setText(My Titled Pane); tp.setContent(new Button(Button);它们的效果系统，都是Figure 20-2.Figure 20-2 Titled Pane with a ButtonDescription of Figure 20-2 Titled Pane with a Button标题窗格可以改变大小来适应它的内容。可以添加多行文本，结果见Figure 20-3.Figure 20-3 Titled Pane with Some TextDescription of Figure 20-3 Titled Pane with Some Text不要明确指定标题窗格的最小、最大和优先的高度值，这样在打开关闭时可能导致难以预料的行为。Example 20-2在的代码添加了几个控件到标题窗格，然后加入到了GridPane布局容器。Example 20-2 Titled Pane with the GridPane Layout ContainerTitledPane gridTitlePane = new TitledPane();GridPane grid = new GridPane(); grid.setVgap(4); grid.setPadding(new Insets(5, 5, 5, 5); grid.add(new Label(First Name: ), 0, 0); grid.add(new TextField(), 1, 0); grid.add(new Label(Last Name: ), 0, 1); grid.add(new TextField(), 1, 1); grid.add(new Label(Email: ), 0, 2); grid.add(new TextField(), 1, 2);gridTitlePane.setText(Grid);gridTitlePane.setContent(grid);运行的结果是Figure 20-4。Figure 20-4 Titled Pane that Contains Several ControlsDescription of Figure 20-4 Titled Pane that Contains Several Controls可以定义标题窗格打开关闭的方式。默认地，标题窗格是可伸缩的，它们的移动也是动画。如果要阻止标题窗格关闭，将setCollapsible方法设为false。也可以将setAnimated方法设为false来关闭动画打开效果。Example 20-3中的代码实现了该任务。Example 20-3 Adjusting the Style of a Titled PaneTitledPane tp = new TitledPane(); /prohibit closing tp.setCollapsible(false); /prohibit animating tp.setAnimated(false);将Titled Panes加入到Accordion在应用中，可以单独使用标题窗格，也可以使用Accordion把控件编组。同样也不要指定手风琴控件的高度值。将几个标题窗格加入到手风琴很类似把开关按钮加入到开关组：每次只能打开手风琴中的一个标题窗格。Example 20-4创建了3个标题窗格并加入到了手风琴中。Example 20-4 Accordion and Three Titled Panesimport javafx.application.Application; import javafx.scene.Group; import javafx.scene.Scene; import javafx.scene.control.Accordion; import javafx.scene.control.TitledPane; import javafx.scene.image.Image; import javafx.scene.image.ImageView; import javafx.scene.paint.Color; import javafx.stage.Stage; public class TitledPaneSample extends Application final String imageNames = new StringApples, Flowers, Leaves; final Image images = new ImageimageNames.length; final ImageView pics = new ImageViewimageNames.length; final TitledPane tps = new TitledPaneimageNames.length; public static void main(String args) launch(args); Override public void start(Stage stage) stage.setTitle(TitledPane); Scene scene = new Scene(new Group(), 80, 180); scene.setFill(Color.GHOSTWHITE);final Accordion accordion = new Accordion ();for (int i = 0; i imageNames.length; i+) imagesi = newImage(getClass().getResourceAsStream(imageNamesi + .jpg);picsi = new ImageView(imagesi);tpsi = new TitledPane(imageNamesi,picsi);accordion.getPanes().addAll(tps);accordion.setExpandedPane(tps0);Group root = (Group)scene.getRoot(); root.getChildren().add(accordion); stage.setScene(scene); stage.show(); 用循环创建了3个标题窗格，每个的内容都是ImageView对象。把标题窗格加入到手风琴中要使用getPanes和addAll方法。可以用add方法代替addAll方法来加入单个标题窗格。默认地，应用启动后所有窗格都关着。setExpandedPane方法指定了带有苹果图片的窗格要打开。见Figure 20-5.Figure 20-5 Accordion with Three Titled PanesDescription of Figure 20-5 Accordion with Three Titled Panes处理Accordion事件可以使用标题窗格和手风琴程序不同的数据。Example 20-5创建了一个单独的标题窗格放进GridPane悲剧容器和三个标题窗格放进手风琴中。单独的窗格包含了一个email客户端元素，手风琴使得选择窗格会显示相应的图片。Example 20-5 Implementing ChangeListener for an Accordionimport javafx.application.Application; import javafx.beans.value.ChangeListener; import javafx.beans.value.ObservableValue; import javafx.geometry.Insets; import javafx.scene.Group; import javafx.scene.Scene; import javafx.scene.control.Accordion; import javafx.scene.control.Label; import javafx.scene.control.TextField; import javafx.scene.control.TitledPane; import javafx.scene.image.Image; import javafx.scene.image.ImageView; import javafx.scene.layout.GridPane; import javafx.scene.layout.HBox; import javafx.scene.paint.Color; import javafx.stage.Stage; public class TitledPaneSample extends Application final String imageNames = new StringApples, Flowers, Leaves; final Image images = new ImageimageNames.length; final ImageView pics = new ImageViewimageNames.length; final TitledPane tps = new TitledPaneimageNames.length; final Label label = new Label(N/A); public static void main(String args) launch(args); Override public void start(Stage stage) stage.setTitle(TitledPane); Scene scene = new Scene(new Group(), 800, 250); scene.setFill(Color.GHOSTWHITE); / - GridPane container TitledPane gridTitlePane = new TitledPane(); GridPane grid = new GridPane(); grid.setVgap(4); grid.setPadding(new Insets(5, 5, 5, 5); grid.add(new Label(To: ), 0, 0); grid.add(new TextField(), 1, 0); grid.add(new Label(Cc: ), 0, 1); grid.add(new TextField(), 1, 1); grid.add(new Label(Subject: ), 0, 2); grid.add(new TextField(), 1, 2); grid.add(new Label(Attachment: ), 0, 3); grid.add(label,1, 3); gridTitlePane.setText(Grid); gridTitlePane.setContent(grid); / - Accordion final Accordion accordion = new Accordion (); for (int i = 0; i imageNames.length; i+) imagesi = new Image(getClass().getResourceAsStream(imageNamesi + .jpg); picsi = new ImageView(imagesi); tpsi = new TitledPane(imageNamesi,picsi); accordion.getPanes().addAll(tps);accordion.expandedPaneProperty().addListener(newChangeListener() public void changed(ObservableValue ov,TitledPane old_val, TitledPane new_val) if (new_val != null) label.setText(accordion.getExpandedPane().getText() +.jpg););HBox hbox = new HBox(10); hbox.setPadding(new Insets(20, 0, 0, 20); hbox.getChildren().setA