2016-05-18 7 views
0

コンテナの上部にBorderPaneを含むGUIを設計したいのですが、コンテナの左側には、コンテンツを変更する異なるボタンを持つAcordionがあります。 diferentのFXMLファイルのコンテナの中心、SpotiffyJavaFX BorderPane複数のFXMLスペース配置とトランジション効果

http://s32.postimg.org/4qw5qbr45/Spoty_Like.png

のデスクトップアプリケーションのようにいろいろ書いiは作業prototipeを持って、それがこの

http://s32.postimg.org/w9g4rqfid/muestra.png

のように見えます

FXMLの変更が起こり、バートが非常にうまく反応するのですが、問題は私が持っているのは、BoderPaneの中央部分を埋めるFXMLが自動リズではなく、FXMLの大きな部分に表示されない場合ですFXMLはスペースが同じ小さなサイズの中央部滞在放置し、これが新しいFXML

public void lanzaUno(){ 
     try { 
      // load first FXML 
      FXMLLoader loader = new FXMLLoader(); 

      loader.setLocation(Coordinador.class.getResource(
        "VistaControlador/Usuario/Uno.fxml")); 

      /*i put the AnchorPane inside of a 
      ScrollPane for the desire funcionality of alot 
      of vertical space for many nodes in a single FXML file 
      */ 
      ScrollPane unoAnchorPane = (ScrollPane) loader.load(); 

      UnoController controller = loader.getController(); 
      //example method for passing variables to the FXML controler 
      controller.pasoPrincipal(this, primaryStage, "Rhutt"); 
      //puts the FXML in the center of the BorderPane 
      rootLayout.setCenter(unoAnchorPane); 
      //this if for trying to accommodate the content en the BorderPane 
      BorderPane.setAlignment(unoAnchorPane, Pos.TOP_LEFT); 
     } catch (IOException e) { 
      e.printStackTrace(); 
     } 
    } 

私の最初のcuestionの呼び出しのために私のコードです

何もない空間の多くを残した小さいです私はFXMLの呼び出しで、このBorderPaneで利用可能なスペースの内容を見落としていますか?

FXMLの変更については、私はfronを別のものに渡すと、BorderPaneの変更が瞬時に起こり、非常に悪いように見えます。FXMLの内容

EDIT

遷移が少し良く作ることは非常にだけで詳述する必要はありません?、中央にFXMLのコンテンツをプッシュ呼び出す私は送信コーディネータークラスを持ってのパラメータをreciveされますすべてのFXMLと私は新しいFXMLを呼び出すメソッドを宣言しているので、私はコーディネータークラス、そのコントローラーと2つのFXMLを持つFXMLルート、それぞれに異なるものを持つコントローラーを持っています。この2つのFXM Lルート

のBorderPaneセンターに変更するものは、このコーディネータークラスです

//Variables 
     private Stage primaryStage; 
     private BorderPane rootLayout; 

    /** 
    * launh 
    * @param primaryStage 
    * 
    */ 
    @Override 
    public void start(Stage primaryStage) throws Exception{ 
     // Inicializa la escena 
     this.primaryStage = primaryStage; 
     this.primaryStage.setTitle("Login"); 
     this.primaryStage.centerOnScreen(); 
     //star method 
     iniLogin(); 
    } 

    /** 
    *load the root scene 
    */ 
    public void iniLogin(){ 
     try { 
      // Carga el loader. 
      FXMLLoader loader = new FXMLLoader(); 
      loader.setLocation(com.aohys.rehabSys.MVC.Coordinador.class.getResource(
        "VistaControlador/Pricipal/Principal.fxml")); 
      rootLayout = (BorderPane) loader.load(); 
      //the root scene 
      Scene scene = new Scene(rootLayout); 
      primaryStage.setScene(scene); 
      // Da acceso al programa principal. 
      PrincipalController controller = loader.getController(); 
      controller.pasoPrincipal(this, primaryStage); 
      primaryStage.centerOnScreen(); 
      // Muesta la escena, 
      primaryStage.show(); 
     } catch (IOException e) { 
      e.printStackTrace(); 
     } 
    } 

このメソッドの後、私はFXMLを変える2を呼び出す冒頭のような二つの同一の方法がありますされています2つのFXML上のコントローラが何も01を行ういけない瞬間のためにLanzaUnoを呼び出し、LanzaDos

これは私のルードのFXMLののcontrolerある

public class PrincipalController implements Initializable { 
    //variable of the coordinator class 
    private Coordinador cordi; 
    private Stage stage; 

    /** 
    * method for passing parameters to the FXML 
    * @param cordi 
    * @param stage 
    */ 
    public void pasoPrincipal(Coordinador cordi, Stage stage) { 
     this.cordi = cordi; 
     this.stage = stage; 
    } 

    //FXML in root 
    @FXML private Button btt1; 
    @FXML private Button btt2; 
    @FXML public static StackPane stackPane; 

    /** 
    * Initializes the controller class. 
    */ 
    @Override 
    public void initialize(URL url, ResourceBundle rb) { 
     //Call the firts FXML 
     btt1.setOnAction((evento)->{ 
      cordi.lanzaUno(); 
     }); 

     //Call the second FXML 
     btt2.setOnAction((evento)->{ 
      cordi.lanzaDos(); 
     }); 
    } 

答えて

1

Adam Bien's AfterburnerFXアプリケーションで依存性注入とコントローラを管理するには、ライブラリをお読みください。それは私の人生を変えました。 :)

移行の場合は、このコードを使用します。これは、ある画面から次の画面へのフェードアウト/フェードインです。この場合、はFXMLで定義されたBorderPaneの中央にあるStackPaneです。ここで

は、前述のstackPaneとシンプルFXMLです:

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

<?import javafx.scene.text.*?> 
<?import javafx.scene.control.*?> 
<?import java.lang.*?> 
<?import javafx.scene.layout.*?> 

<BorderPane fx:id="borderPane" minHeight="-Infinity" minWidth="-Infinity" prefHeight="768.0" prefWidth="1280.0" xmlns="http://javafx.com/javafx/8.0.40" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.tada.gui.tada.TadaPresenter"> 
    <center> 
     <StackPane fx:id="stackPane" minHeight="-Infinity" minWidth="-Infinity" prefHeight="240.0" prefWidth="320.0" BorderPane.alignment="CENTER" /> 
    </center> 
</BorderPane> 

そして渡された新しいものに変更setScreen方法:

/** 
* Set Screen 
* 
* @param view 
* @return boolean 
*/ 
public boolean setScreen(Parent view) {  
    final DoubleProperty opacity = stackPane.opacityProperty(); 

    if (!stackPane.getChildren().isEmpty()) { //if there is more than one screen 
     Timeline fade = new Timeline(
       new KeyFrame(Duration.ZERO, new KeyValue(opacity, 1.0)), 
       new KeyFrame(new Duration(TRANSITION_TIMER), new EventHandler<ActionEvent>() { 
        @Override 
        public void handle(ActionEvent t) { 
         stackPane.getChildren().remove(0);  //remove the displayed screen 
         stackPane.getChildren().add(0, view);  //add the screen 
         Timeline fadeIn = new Timeline(
           new KeyFrame(Duration.ZERO, new KeyValue(opacity, 0.0)), 
           new KeyFrame(new Duration(TRANSITION_TIMER), new KeyValue(opacity, 1.0))); 
         fadeIn.play(); 
        } 
       }, new KeyValue(opacity, 0.0))); 
     fade.play(); 

    } else { 
     stackPane.setOpacity(0.0); 
     stackPane.getChildren().add(view);  //no one else been displayed, then just show 
     Timeline fadeIn = new Timeline(
       new KeyFrame(Duration.ZERO, new KeyValue(opacity, 0.0)), 
       new KeyFrame(new Duration(TRANSITION_TIMER), new KeyValue(opacity, 1.0))); 
     fadeIn.play(); 
    } 
    return true; 
} 

あなたはまた、あなたのコントローラでこれをする必要があります...

private static final double TRANSITION_TIMER = 200; 

EDIT:

私は非常に基本的な "アプリケーション"をまとめようとしました。初歩的ですが、AfterburnerFXの使い方と画面のフェード遷移を説明するのは良いことだと思います。 AfterburnerFXにはさらに多くのものがあります。私はちょうど依存性注入なしでビューの切り替えを使用しました。これは、アプリケーション内のオブジェクトを処理したいときに非常に重要です。また、プロパティのバインドは、優れたUXにとって非常に重要です。とにかく、ここにGitHubのmy exampleへのリンクがあります。

+0

私はafterburnerFXを確実にチェックします。あなたが提供するメソッドを実装するにはどうしたらいいですか?私はあなたのメソッドを実装する方法について、より多くのdetialsの質問を編集しますが、要するに、すべてのFXMLのパラメータを受け取って、新しいFXMLを呼び出す方法を宣言しているので、私はコーディネータクラスを持っています。コントローラと2つのFXMLを持つFXMLルートと、それぞれに異なるものを持つコントローラを持っています。 – CorrOrtiz

+0

@CorrOrtizのルートのBorderPaneセンターを変更して、GitHubの非常に簡単なサンプルアプリケーションを紹介するように答えを編集しました。それがあなたに役立つことを願っています。 – RonSiven

関連する問題