将TextFields的JavaFX Tab-Button顺序从“从左到右”更改为到“从右到左”通过fxml文件 [英] Change JavaFX Tab-Button orderring of TextFields from "Left to Right" to "Right to Left" by fxml file

问题描述

在询问之前，我应该说可以在在TextFields的Parent上，以及它在Parent中的顺序。

我重新编写了代码以使其更易于维护。为了更好地理解，可以注意以下几点：

• 而不是1，我使用VBox中包含的4个HBox


• 根据需要，每个HBox都有一个/两个TextFields。它可能包含两个以上


• 每个HBox的nodeOrientation为 RIGHT_TO_LEFT


• 第一个第一个HBox的元素是TextField id1 而不是 id2 ，这使得它成为第一个在场景时关注的元素已加载


• 所有HBox都包含在VBox中，以便在不同HBox的

$中包含TextField之间的焦点遍历b $ b

FXML

 <？xml version =1.0encoding = UTF-8\" >？; 
 
<？import javafx.scene.control。*？> 
<？import java.lang。*？> 
<？import javafx.scene.layout。*？> 
 
 
< VBox xmlns =http://javafx.com/javafx/8.0.40xmlns：fx =http://javafx.com/fxml/1> ; 
< children> 
< HBox maxHeight = -  InfinitymaxWidth = -  InfinityminHeight = -  InfinityminWidth = -  InfinitynodeOrientation =RIGHT_TO_LEFTprefHeight =32.0prefWidth =600.0> 
< children> 
< TextField promptText =id1/> 
< TextField promptText =id2/> 
< / children> 
< / HBox> 
< HBox maxHeight = -  InfinitymaxWidth = -  InfinityminHeight = -  InfinityminWidth = -  InfinitynodeOrientation =RIGHT_TO_LEFTprefHeight =35.0prefWidth =600.0> 
< children> 
< TextField promptText =id3/> 
< TextField promptText =id4/> 
< / children> 
< / HBox> 
< HBox maxHeight = -  InfinitymaxWidth = -  InfinityminHeight = -  InfinityminWidth = -  InfinitynodeOrientation =RIGHT_TO_LEFTprefHeight =34.0prefWidth =600.0> 
< children> 
< TextField promptText =id5/> 
< / children> 
< / HBox> 
< HBox maxHeight = -  InfinitymaxWidth = -  InfinityminHeight = -  InfinityminWidth = -  InfinitynodeOrientation =RIGHT_TO_LEFTprefHeight =400.0prefWidth =600.0> 
< children> 
< TextField promptText =id6/> 
< / children> 
< / HBox> 
< / children> 
< / VBox> 
  

Before asking, i should say that the answer of can be found maybe in JavaFX: How to change the focus traversal policy?, but i don't looking for any java code, i would like a way by editing the Fxml file

There is a FXML file that has some TextFields in it and i would like to change focus traversal policy of my TextField : I mean, At the beginning of the application the cursor must be located in id1 and then by pressing TAB button it must go to id2 and etc.

!!!! ID1-->ID2-->ID3-->ID4-->ID5-->ID6 !!!!

Notice that the position of my TextField should be as like as below picture.

So for doing that i change the order of textFields in FXML File:

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <TextField fx:id="id1" layoutX="401.0" layoutY="41.0" promptText="id1" />
      <TextField fx:id="id2" layoutX="168.0" layoutY="41.0" promptText="id2" />
      <TextField fx:id="id3" layoutX="401.0" layoutY="110.0" promptText="id3" />
      <TextField fx:id="id4" layoutX="168.0" layoutY="110.0" promptText="id4" />
      <TextField fx:id="id5" layoutX="401.0" layoutY="174.0" promptText="id5" />
      <TextField fx:id="id6" layoutX="401.0" layoutY="249.0" promptText="id6" />
   </children>
</AnchorPane>

it works fine for me, but now i have the big problem, when i wrap two TextFields ( Id1 and Id2 ) in HBox. this approach doesn't give me the correct result and the order of focus traversal has changed.

The modified FXML is like below:

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="Bank.LayoutController">
   <children>
      <HBox layoutX="168.0" layoutY="41.0" spacing="80.0">
         <children>
             <TextField fx:id="id2" layoutX="168.0" layoutY="41.0" promptText="id2" />
             <TextField fx:id="id1" layoutX="401.0" layoutY="41.0" promptText="id1" />
         </children>
      </HBox>
      <TextField fx:id="id3" layoutX="401.0" layoutY="110.0" promptText="id3" />
      <TextField fx:id="id4" layoutX="168.0" layoutY="110.0" promptText="id4" />
      <TextField fx:id="id5" layoutX="401.0" layoutY="174.0" promptText="id5" />
      <TextField fx:id="id6" layoutX="401.0" layoutY="249.0" promptText="id6" />
   </children>
</AnchorPane>

and the screen shot of result becomes like below picture ( as you can see the staring point has changed to id2 and then by pressing tab the cursor goes to id1... !!!! ID2-->ID1-->ID3-->ID4-->ID5-->ID5 !!! )

SO !?!? how can i change the Focus Traversal of my TextField when the user click the TAB.

It seems if you just have an anchorPane it's very easy, but if you have HBox it starts from Right side to left Side.

By default when the the tab key is pressed, focus shifted (right wards) to the next component but as i mentioned i want Left to Right !!

Is there any solution?

解决方案

There are multiple ways to achieve the stated behaviour. A very simple technique would be to make use of NodeOrientation on the Parent of the TextFields, along with the ordering of it in the Parent.

I have re-vamped your code to make it more maintainable. The following points can be noted for better understanding:

• Instead of 1, I am using 4 HBox contained in a VBox
• Each of these HBox has one / two TextFields according to the need. It may contain more than two
• The nodeOrientation for each HBox is RIGHT_TO_LEFT
• The first element of first HBox is TextField id1 and not id2, which makes it the first element of be focused on when the scene is loaded
• All the HBox's are contained in a VBox to make the traversal of focus between TextField's contained in different HBox's

FXML

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

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


<VBox xmlns="http://javafx.com/javafx/8.0.40" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <HBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" nodeOrientation="RIGHT_TO_LEFT" prefHeight="32.0" prefWidth="600.0">
         <children>
            <TextField promptText="id1" />
            <TextField promptText="id2" />
         </children>
      </HBox>
      <HBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" nodeOrientation="RIGHT_TO_LEFT" prefHeight="35.0" prefWidth="600.0">
         <children>
            <TextField promptText="id3" />
            <TextField promptText="id4" />
         </children>
      </HBox>
      <HBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" nodeOrientation="RIGHT_TO_LEFT" prefHeight="34.0" prefWidth="600.0">
         <children>
            <TextField promptText="id5" />
         </children>
      </HBox>
      <HBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" nodeOrientation="RIGHT_TO_LEFT" prefHeight="400.0" prefWidth="600.0">
         <children>
            <TextField promptText="id6" />
         </children>
      </HBox>
   </children>
</VBox>

这篇关于将TextFields的JavaFX Tab-Button顺序从“从左到右”更改为到“从右到左”通过fxml文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！