Comment spécifier un pourcentage de la largeur de JavaFX 2 à l'aide de FXML?

Je suis à la recherche d'un moyen de dire définir un maxWidth taille à 80% dans le FXML.

Un peu comme dans le développement web.

<VBox fx:id="testVB" prefWidth="600">

Mais ce n'est pas:

<VBox fx:id="testVB" prefWidth="80%">

Je sais qu'en Droit JavaFX2 non-fxml vous pouvez créer des encarts? Quelle est la meilleure façon de le faire à l'extérieur de code dans FMXL?

Merci!

Riley

OriginalL'auteur ril3y | 2012-03-23

  1. 19

    Je ne suis pas sûr que vous le pouvez. Vous devez utiliser le GridPane mise en page du composant. Dans ce composant, vous pouvez spécifier les lignes et les colonnes de contraintes, et dans ces contraintes, vous pouvez spécifier une largeur en pourcentage. Par exemple:

    <GridPane>
    <children>
        <TitledPane text="testGridPane" GridPane.columnIndex="0" GridPane.rowIndex="0" />
    </children>
    <columnConstraints>
        <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="80.0" prefWidth="100.0" />
        <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="20.0" prefWidth="100.0" />
    </columnConstraints>
    <rowConstraints>
        <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
    </rowConstraints>
</GridPane>

    Ce code définit une GridPane avec une première colonne avec une largeur de 80%. Le TitledPane est définie dans la première cellule de la première colonne de ce GridPane, et peut (parce que vous devez être sûr que la largeur des contraintes de la TitledPane correspondent à vos besoins) occupent 80% de la largeur de la GridPane.

    Veuillez noter que j'ai enlevé toutes les informations ne sont pas pertinentes à votre question. Par la voie, d'Oracle Scène Builder outil est très utile pour définir complexe FXML mise en page.

    Comment pouvez-vous définir les contraintes de colonne à l'intérieur de SceneBuilder? Je suis en utilisant SceneBuilder 8.1.1, j'ai un GridPane avec deux colonnes, et je ne trouve pas de contraintes de colonne ou percentWidth n'importe où.

    OriginalL'auteur Teocali

  2. 9

    Il semble que beaucoup de réponses ont déjà été fournis et qu'ils devraient travailler. Cependant, il y a un moyen de mettre en pourcentages:

    <fx:define>
    <Screen fx:factory="getPrimary" fx:id="screen" />
</fx:define>

    Ce serait de vous aider à détecter les dimensions de l'écran en cours, l'application est affichée sur. Maintenant que nous avons les dimensions d'affichage, nous pouvons jouer avec elle dans le FXML comme suit:

    <HBox fx:id="hroot" prefHeight="${screen.visualBounds.height}" prefWidth="${screen.visualBounds.width}"> Your FXML elements inside the root... </HBox>

    Noter que j'utilise visualBounds, car ce serait me faire de l'espace disponible sur l'écran, car je ne veux pas de chevauchement avec la barre des tâches dans Windows par exemple. Pour un affichage plein écran des applications, vous utilisez simplement "limites".

    Maintenant, pour en venir à votre point de l'utilisation de pourcentages, vous pouvez jouer avec la valeur de la prefheight et prefWidth. Vous pouvez mettre des calculs à l'intérieur de la ${}.

    En option:

    Si vous voulez avoir tous vos éléments par rapport dimensions, il suffit de se référer à eux, à l'aide de leur IDENTIFIANT et de leur largeur ou la hauteur de la propriété, et de faire votre calcul.

    <VBox fx:id="VBSidebar" prefWidth="${hroot.width*0.15}" prefHeight="${hroot.height}"> more elements.. </VBox>

    Espérons que cette aide!

    OriginalL'auteur Jarrick

  3. 0

    Vous pouvez simuler - un exemple de base qui simule 50% pour les deux cols dans une HBox. Vous pouvez ajouter mannequin volets pour obtenir de tiers, etc.

        HBox {
        VBox {
            static hgrow : "ALWAYS",
            Label {
                text : "Privacy",
                alignment : "CENTER",
                styleClass : ["h2", "heading"]
            }
        },
        VBox {
            static hgrow : "ALWAYS",
            Label {
                text : "Messages",
                alignment : "CENTER",
                styleClass : ["h2", "heading"]
            },
            Label {text:""}
        }
    }
    Il est à noter que l'utilisation de "PARFOIS" et futzing avec la pref/min/max largeur peut être de l'aide, trop. J'avais toujours l'amour en % valeurs pour de vrai.

    OriginalL'auteur Tim Beres