use view ordering to improve transaction pane perf

src/main/java/com/sparrowwallet/sparrow/transaction/HeadersForm.java

@@ -14,6 +14,7 @@ public class HeadersForm extends TransactionForm {
     public Node getContents() throws IOException {
         FXMLLoader loader = new FXMLLoader(getClass().getResource("headers.fxml"));
         Node node = loader.load();
+        node.setUserData(this);
         HeadersController controller = loader.getController();
         controller.setModel(this);
         return node;

src/main/java/com/sparrowwallet/sparrow/transaction/InputForm.java

@@ -48,6 +48,7 @@ public class InputForm extends IndexedTransactionForm {
     public Node getContents() throws IOException {
         FXMLLoader loader = new FXMLLoader(getClass().getResource("input.fxml"));
         Node node = loader.load();
+        node.setUserData(this);
         InputController controller = loader.getController();
         controller.setModel(this);
         return node;

src/main/java/com/sparrowwallet/sparrow/transaction/InputsForm.java

@@ -14,6 +14,7 @@ public class InputsForm extends TransactionForm {
     public Node getContents() throws IOException {
         FXMLLoader loader = new FXMLLoader(getClass().getResource("inputs.fxml"));
         Node node = loader.load();
+        node.setUserData(this);
         InputsController controller = loader.getController();
         controller.setModel(this);
         return node;

src/main/java/com/sparrowwallet/sparrow/transaction/OutputForm.java

@@ -38,6 +38,7 @@ public class OutputForm extends IndexedTransactionForm {
     public Node getContents() throws IOException {
         FXMLLoader loader = new FXMLLoader(getClass().getResource("output.fxml"));
         Node node = loader.load();
+        node.setUserData(this);
         OutputController controller = loader.getController();
         controller.setModel(this);
         return node;

src/main/java/com/sparrowwallet/sparrow/transaction/OutputsForm.java

@@ -17,6 +17,7 @@ public class OutputsForm extends TransactionForm {
     public Node getContents() throws IOException {
         FXMLLoader loader = new FXMLLoader(getClass().getResource("outputs.fxml"));
         Node node = loader.load();
+        node.setUserData(this);
         OutputsController controller = loader.getController();
         controller.setModel(this);
         return node;

src/main/java/com/sparrowwallet/sparrow/transaction/TransactionController.java

@@ -197,31 +197,44 @@ public class TransactionController implements Initializable {
                     Platform.runLater(this::refreshTxHex);
                 }
             } else {
+                Node detailPane = null;
+                for(Node txdetail : txpane.getChildren()) {
+                    TransactionForm childForm = (TransactionForm)txdetail.getUserData();
+                    if(transactionForm == childForm) {
+                        detailPane = txdetail;
+                        txdetail.setViewOrder(0);
+                    } else {
+                        txdetail.setViewOrder(1);
+                    }
+                }
+
                 try {
-                    Node node = transactionForm.getContents();
+                    if(detailPane == null) {
-                    txpane.getChildren().clear();
+                        detailPane = transactionForm.getContents();
-                    txpane.getChildren().add(node);
+                        detailPane.setViewOrder(0);
-
+                        txpane.getChildren().add(detailPane);
-                    if (node instanceof Parent) {
-                        Parent parent = (Parent) node;
-                        txhex.getStylesheets().clear();
-                        txhex.getStylesheets().addAll(parent.getStylesheets());
-
-                        selectedInputIndex = -1;
-                        selectedOutputIndex = -1;
-                        if (transactionForm instanceof InputForm) {
-                            InputForm inputForm = (InputForm) transactionForm;
-                            selectedInputIndex = inputForm.getTransactionInput().getIndex();
-                        } else if (transactionForm instanceof OutputForm) {
-                            OutputForm outputForm = (OutputForm) transactionForm;
-                            selectedOutputIndex = outputForm.getTransactionOutput().getIndex();
-                        }
-
-                        Platform.runLater(this::refreshTxHex);
                     }
                 } catch (IOException e) {
                     throw new IllegalStateException("Can't find pane", e);
                 }
+
+                if(detailPane instanceof Parent) {
+                    Parent parent = (Parent)detailPane;
+                    txhex.getStylesheets().clear();
+                    txhex.getStylesheets().addAll(parent.getStylesheets());
+
+                    selectedInputIndex = -1;
+                    selectedOutputIndex = -1;
+                    if(transactionForm instanceof InputForm) {
+                        InputForm inputForm = (InputForm) transactionForm;
+                        selectedInputIndex = inputForm.getTransactionInput().getIndex();
+                    } else if(transactionForm instanceof OutputForm) {
+                        OutputForm outputForm = (OutputForm) transactionForm;
+                        selectedOutputIndex = outputForm.getTransactionOutput().getIndex();
+                    }
+
+                    Platform.runLater(this::refreshTxHex);
+                }
             }
         });
 

src/main/resources/com/sparrowwallet/sparrow/transaction/headers.fxml

@@ -15,7 +15,7 @@
 <?import com.sparrowwallet.sparrow.control.IdLabel?>
 <?import com.sparrowwallet.sparrow.control.CoinLabel?>
 
-<GridPane hgap="10.0" vgap="10.0" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.HeadersController" stylesheets="@headers.css, @../general.css">
+<GridPane hgap="10.0" vgap="10.0" styleClass="tx-pane" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.HeadersController" stylesheets="@headers.css, @transaction.css, @../general.css">
    <padding>
       <Insets left="25.0" right="25.0" top="25.0" />
    </padding>

src/main/resources/com/sparrowwallet/sparrow/transaction/input.fxml

@@ -17,7 +17,7 @@
 <?import com.sparrowwallet.sparrow.control.AddressLabel?>
 <?import com.sparrowwallet.sparrow.control.UnlabeledToggleSwitch?>
 
-<GridPane hgap="10.0" vgap="10.0" stylesheets="@input.css, @../script.css, @../general.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.InputController">
+<GridPane hgap="10.0" vgap="10.0" styleClass="tx-pane" stylesheets="@input.css, @transaction.css, @../script.css, @../general.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.InputController">
     <padding>
         <Insets left="25.0" right="25.0" top="25.0" />
     </padding>

src/main/resources/com/sparrowwallet/sparrow/transaction/inputs.fxml

@@ -8,7 +8,7 @@
 <?import com.sparrowwallet.sparrow.control.CopyableLabel?>
 <?import com.sparrowwallet.sparrow.control.CoinLabel?>
 
-<GridPane hgap="10.0" vgap="10.0" stylesheets="@inputs.css, @../general.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.InputsController">
+<GridPane hgap="10.0" vgap="10.0" styleClass="tx-pane" stylesheets="@inputs.css, @transaction.css, @../general.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.InputsController">
     <padding>
         <Insets left="25.0" right="25.0" top="25.0" />
     </padding>

src/main/resources/com/sparrowwallet/sparrow/transaction/output.fxml

@@ -15,7 +15,7 @@
 <?import com.sparrowwallet.sparrow.control.CoinLabel?>
 <?import com.sparrowwallet.sparrow.control.AddressLabel?>
 
-<GridPane hgap="10.0" vgap="10.0" stylesheets="@output.css, @../script.css, @../general.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.OutputController">
+<GridPane hgap="10.0" vgap="10.0" styleClass="tx-pane" stylesheets="@output.css, @transaction.css, @../script.css, @../general.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.OutputController">
     <padding>
         <Insets left="25.0" right="25.0" top="25.0" />
     </padding>

src/main/resources/com/sparrowwallet/sparrow/transaction/outputs.fxml

@@ -8,7 +8,7 @@
 <?import com.sparrowwallet.sparrow.control.CopyableLabel?>
 <?import com.sparrowwallet.sparrow.control.CoinLabel?>
 
-<GridPane hgap="10.0" vgap="10.0" stylesheets="@outputs.css, @../general.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.OutputsController">
+<GridPane hgap="10.0" vgap="10.0" styleClass="tx-pane" stylesheets="@outputs.css, @transaction.css, @../general.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.transaction.OutputsController">
     <padding>
         <Insets left="25.0" right="25.0" top="25.0" />
     </padding>

src/main/resources/com/sparrowwallet/sparrow/transaction/transaction.css

@@ -4,6 +4,10 @@
     -fx-padding: 2;
 }
 
+.tx-pane {
+    -fx-background-color: -fx-background;
+}
+
 .color-0 { -fx-fill: #ca1243 }
 .color-1 { -fx-fill: #d75f00 }
 .color-2 { -fx-fill: #c18401 }

src/main/resources/com/sparrowwallet/sparrow/transaction/transaction.fxml

@@ -15,7 +15,7 @@
                     <TreeView fx:id="txtree" minWidth="120">
                         <SplitPane.resizableWithParent>false</SplitPane.resizableWithParent>
                     </TreeView>
-                    <StackPane fx:id="txpane" />
+                    <StackPane fx:id="txpane" styleClass="tx-pane"/>
                 </items>
             </SplitPane>
         </masterNode>