формы JavaFX размер динамически

Question

мне нужно иметь AnchorPane с инсультом вокруг него, которая изменяет, когда этап изменения размеров, позволь мне поставить некоторые изображения, чтобы лучше объяснить себе:

я достиг этого используя прямоугольник с цвет заливки белый и альфа = 0 (ее прозрачный), это мой FXML файл:

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

<?import javafx.scene.shape.*?> 
<?import java.lang.*?> 
<?import javafx.scene.layout.*?> 
<?import javafx.scene.layout.AnchorPane?> 


<AnchorPane prefHeight="671.0" prefWidth="644.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> 
    <children> 
    <Rectangle fill="#ffffff00" height="671.0" layoutX="91.0" layoutY="69.0" stroke="RED" strokeType="INSIDE" strokeWidth="10.0" width="644.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" /> 
</children> 
</AnchorPane> 

, когда я делаю на сцене больше я хочу, прямоугольник, чтобы изменить размер и всегда подходит именно размер AnchorPane

, но он не работает так, вместо того, чтобы я в конечном итоге с этим:

есть способ связать площадь прямоугольника в области AnchorPane, в которой прямоугольник ? или я делаю это неправильно, используя форму для этого, и есть более эффективный способ достижения того, что мне нужно?

Последнее замечательное! Мне нужно изменить цвет этого штриха вокруг AnchorPane! Большое спасибо, если вам нужна дополнительная информация о моем коде, или если мое объяснение слишком плохое, дайте мне знать, и я улучшу свой вопрос!

Answer 1

Чтобы достичь того, чего вы хотите, как Вы описываете, делая это, вы можете использовать controller class и привязать размер прямоугольника до размера панели:

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

<?import javafx.scene.shape.*?> 
<?import java.lang.*?> 
<?import javafx.scene.layout.*?> 
<?import javafx.scene.layout.AnchorPane?> 


<AnchorPane prefHeight="671.0" prefWidth="644.0" fx:controller="com.mycompany.myproject.Controller" fx:id="root" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> 
    <children> 
     <Rectangle fx:id="border" fill="#ffffff00" height="671.0" layoutX="91.0" layoutY="69.0" stroke="RED" strokeType="INSIDE" strokeWidth="10.0" width="644.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" /> 
    </children> 
</AnchorPane> 

, а затем

package com.mycompany.myproject ; 

import javafx.fxml.FXML ; 
import javafx.scene.shape.Rectangle ; 
import javafx.scene.layout.AnchorPane ; 

public class Controller { 

    @FXML 
    private AnchorPane root ; 
    @FXML 
    private Rectangle border ; 

    public void initialize() { 
     border.widthProperty().bind(root.widthProperty()); 
     border.heightProperty().bind(border.heightProperty()); 
    } 

} 

Вы можете изменить цвет прямоугольника в контроллере, просто позвонив border.setStroke(...);.

---

Использование Rectangle может быть не лучшим образом. Вы можете полностью опустить прямоугольник и использовать CSS для создания самой панели привязки. CSS вам нужно

-fx-background-color: red, -fx-color ; 
-fx-background-insets: 0, 10 ; 

Вы можете установить это непосредственно на панели якорной:

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

<?import javafx.scene.shape.*?> 
<?import java.lang.*?> 
<?import javafx.scene.layout.*?> 
<?import javafx.scene.layout.AnchorPane?> 


<AnchorPane prefHeight="671.0" prefWidth="644.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8" 
    style="-fx-background-color: red, -fx-color ; -fx-background-insets: 0, 10 ;"> 

</AnchorPane> 

, но это, вероятно, лучше поместить его в внешнюю таблицу стилей:

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

<?import javafx.scene.shape.*?> 
<?import java.lang.*?> 
<?import javafx.scene.layout.*?> 
<?import javafx.scene.layout.AnchorPane?> 


<AnchorPane prefHeight="671.0" prefWidth="644.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> 

</AnchorPane> 

и затем в вашем основном классе:

Parent root = FXMLLoader.load(getClass().getResource("path/to/fxml")); 
Scene scene = new Scene(root); 
scene.getStylesheets().add("my-stylesheet.css"); 
// ... 

с моим-stylesheet.css содержащий:

.root { 
    -fx-background-color: red, -fx-color ; 
    -fx-background-insets: 0, 10 ; 
} 

Наконец, если вы используете таблицы стилей, как это, вы можете изменить цвет границы динамически с помощью looked-up color.Измените таблицу стилей:

.root { 
    my-border-color: red ; 
    -fx-background-color: my-border-color, -fx-color ; 
    -fx-background-insets: 0, 10 ; 
} 

, а затем вы можете изменить границу в любое время по телефону

root.setStyle("my-border-color: green;") 

где root является ссылкой на панели крепления.

SSCCE

Вот полный пример с использованием последней методики:

DynamicBorderColor.fxml:

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

<?import javafx.scene.layout.AnchorPane?> 
<?import javafx.scene.control.Button?> 

<AnchorPane xmlns:fx="http://javafx.com/fxml/1" fx:controller="Controller" fx:id="root" minWidth="600" minHeight="600"> 
    <Button text="Change Color" onAction="#changeColor" AnchorPane.topAnchor="20" AnchorPane.leftAnchor="20"/> 
</AnchorPane> 

Controller.java:

import javafx.fxml.FXML; 
import javafx.scene.layout.AnchorPane; 

public class Controller { 

    private int colorIndex ; 
    private String[] colors = {"red", "orange", "yellow", "green", "blue", "indigo", "violet"} ; 

    @FXML 
    private AnchorPane root ; 

    @FXML 
    private void changeColor() { 
     colorIndex = (colorIndex + 1) % colors.length ; 
     root.setStyle("border-color: "+colors[colorIndex]+";"); 
    } 
} 

DynamicBorderColor.java (основной класс приложения):

import java.io.IOException; 

import javafx.application.Application; 
import javafx.fxml.FXMLLoader; 
import javafx.scene.Scene; 
import javafx.stage.Stage; 

public class DynamicBorderColor extends Application { 

    @Override 
    public void start(Stage primaryStage) throws IOException { 
     Scene scene = new Scene(FXMLLoader.load(getClass().getResource("DynamicBorderColor.fxml"))); 
     scene.getStylesheets().add("my-stylesheet.css"); 

     primaryStage.setScene(scene); 
     primaryStage.show(); 
    } 

    public static void main(String[] args) { 
     launch(args); 
    } 
} 

мой-stylesheet.css:

.root { 
    border-color: red ; 
    -fx-background-color: border-color, -fx-base ; 
    -fx-background-insets: 0, 10 ; 
} 

Начало:

Resize:

Pr Кнопка ESS несколько раз: