2017-04-04 7 views
1

私はJavaFXとシーンビルダを全く新しくしました。JavaFXシーンビルダ:新しいシーンを作成するか、特定の要素を変更するだけですか?

私のプログラムは、右に4つのボタンがあり、左にタブパネルがあります。問題は、右の各ボタンのTabPaneをどのように設計するのか分かりません。たとえば、ユーザがButton 1をクリックすると、Option 1 - AOption 1 - Bの2つのタブが表示されます。 Button 2をクリックすると、Option 2 - AOption 2 - Bなどと表示されます。

どうすればこの問題を解決できますか? 1つのシーンに4つのTabPaneデザインを追加することができます(htmlやjavascriptのようなshow hide要素で切り替える)か、最初のシーンを4つコピーしてそれぞれのタブパネルを変更する必要がありますか?

enter image description here

enter image description here

+0

おそらく、4つの異なるシーンを作成し、クリックされたボタンに応じて適切なシーンをロードできます。表示しているこのメインステージには、4つのボタンとアンカーパネルが必要です。ボタンをクリックすると、作成した他のfxmlファイルの1つをアンカーパネルにロードします。 – Sedrick

答えて

1

サンプルアプリ:このアプリはanchorpaneと2つのボタンから構成MAINVIEWを有しています。このアプリには2つのビューもあります。メインビューでトップボタンを押すと、viewOneがメインビューのアンカーパネルに読み込まれます。メインビューで下ボタンが押されると、viewTwoがメインビューのアンカーパネルに読み込まれます。

メイン

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

このアプリでは、アプリの起動時にメインアンカーパネルに初期表示が読み込まれません。アプリが起動するとすぐにビューを読み込むことができます。

+0

期待どおりに動作します。ありがとうございました。 –

+0

私は2つのペインを切り替えると、上記のコードでは、新しいペインを作成してappMainに追加するため、クリックごとに新しいペインが作成されるのだろうかと思います。私はそれがappMainとそのすべての子供たちに電話をかけて、新しいペインを追加することを理解しています。切り替え前に子供を取り除かなければならないのですか? –

+0

はい、このコードでは、毎回新しいペインを作成します。しかし、簡単に修正する必要があります。 – Sedrick

関連する問題