JavaFX场景构建器:创建一个新场景或只是对特定元素进行更改?

时间:2017-04-04 04:28:23

标签: java javafx scenebuilder tabpanel

我对JavaFX和Scene Builder完全陌生。

我的程序设计如下图所示,右侧有4个按钮,左侧有一个TabPane。问题是我不知道如何为右边的每个按钮设计TabPane。例如,如果用户点击Button 1,则会显示2个标签Option 1 - AOption 1 - B。如果点击Button 2,则会显示Option 2 - AOption 2 - B,依此类推。

我怎样才能做到这一点?它可以在1个场景中添加4个TabPane设计(通过show hide元素在html和javascript之间切换)或者我需要制作第一个场景的4个副本并为每个场景更改TabPane?

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:1)

示例应用:此应用有一个主视图,由一个锚定窗格和两个按钮组成。这个应用程序还有另外两个视图。在主视图中按下顶部按钮时,它会将viewOne加载到mainview的anchorpane中。在主视图中按下底部按钮时,它会将viewTwo加载到mainview的anchorpane中。

  

主要

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

/**
 *
 * @author blj0011
 */
public class JavaFXApplication63 extends Application
{

    @Override
    public void start(Stage stage) throws Exception
    {
        Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));

        Scene scene = new Scene(root);

        stage.setScene(scene);
        stage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args)
    {
        launch(args);
    }

}
  

BaseView控制器

import java.io.IOException;
import java.net.URL;
import java.util.ResourceBundle;
import java.util.logging.Level;
import java.util.logging.Logger;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.Pane;

/**
 *
 * @author blj0011
 */
public class FXMLDocumentController implements Initializable
{
    @FXML AnchorPane apMain;

    @FXML
    private void handleButtonAction(ActionEvent event)
    {
        try 
        {
            Pane newLoadedPane;

            Button tempButton = (Button)event.getSource();
            switch(tempButton.getId())
            {

                case "btnOne":
                    newLoadedPane =  FXMLLoader.load(getClass().getResource("viewOne.fxml"));
                    apMain.getChildren().add(newLoadedPane);
                    break;
                case "btnTwo":
                    newLoadedPane =  FXMLLoader.load(getClass().getResource("viewTwo.fxml"));
                    apMain.getChildren().add(newLoadedPane);
                    break;
            }
        }
        catch (IOException ex) {
            Logger.getLogger(FXMLDocumentController.class.getName()).log(Level.SEVERE, null, ex);
        }
    }

    @Override
    public void initialize(URL url, ResourceBundle rb)
    {
        // TODO
    }    

}
  

Baseview FXML

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane id="AnchorPane" prefHeight="200" prefWidth="320" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="javafxapplication63.FXMLDocumentController">
    <children>
        <Button fx:id="btnOne" layoutX="241.0" layoutY="24.0" onAction="#handleButtonAction" text="Click Me!" />
        <Button fx:id="btnTwo" layoutX="241.0" layoutY="56.0" onAction="#handleButtonAction" text="Click Me!" />
        <AnchorPane fx:id="apMain" maxHeight="200.0" maxWidth="200.0" minHeight="200.0" minWidth="200.0" prefHeight="200.0" prefWidth="200.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="120.0" AnchorPane.topAnchor="0.0" />
    </children>
</AnchorPane>
  

ViewOne控制器

import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.Initializable;

/**
 * FXML Controller class
 *
 * @author blj0011
 */
public class ViewOneController implements Initializable
{

    /**
     * Initializes the controller class.
     */
    @Override
    public void initialize(URL url, ResourceBundle rb)
    {
        // TODO
    }    

}
  

ViewOne FXML

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Tab?>
<?import javafx.scene.control.TabPane?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane fx:id="apOption2" maxHeight="200.0" maxWidth="200.0" minHeight="200.0" minWidth="200.0" prefHeight="200.0" prefWidth="200.0" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="javafxapplication63.ViewOneController">
   <children>
      <TabPane layoutX="125.0" layoutY="83.0" prefHeight="200.0" prefWidth="200.0" tabClosingPolicy="UNAVAILABLE" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
        <tabs>
          <Tab text="1 - A">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
            </content>
          </Tab>
          <Tab text="1 - B">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
            </content>
          </Tab>
        </tabs>
      </TabPane>
   </children>
</AnchorPane>
  

ViewTwo控制器

import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.Initializable;

/**
 * FXML Controller class
 *
 * @author blj0011
 */
public class ViewTwoController implements Initializable
{

    /**
     * Initializes the controller class.
     */
    @Override
    public void initialize(URL url, ResourceBundle rb)
    {
        // TODO
    }    

}
  

ViewTwo FXML

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Tab?>
<?import javafx.scene.control.TabPane?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane fx:id="apOption2" maxHeight="200.0" maxWidth="200.0" minHeight="200.0" minWidth="200.0" prefHeight="200.0" prefWidth="200.0" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="javafxapplication63.ViewTwoController">
   <children>
      <TabPane layoutX="24.0" layoutY="-14.0" prefHeight="200.0" prefWidth="200.0" tabClosingPolicy="UNAVAILABLE" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
        <tabs>
          <Tab text="2 - A">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
            </content>
          </Tab>
          <Tab text="2 - B">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
            </content>
          </Tab>
        </tabs>
      </TabPane>
   </children>
</AnchorPane>

enter image description here

enter image description here

enter image description here

在这个应用程序中,当应用程序启动时,没有初始视图加载到主锚定窗格中。您可能希望在应用启动后立即加载视图。