如何在javaFX中更新组中的视图？

Question

我有一个图形看起来像this。我想在更改滑块时更新视图。但是，当我更改滑块时，所有元素将堆叠在一起看起来像that。那么我能做些什么来获得新的观点。

我的应用程序的structrue：

圈和QuadCurve - >集团 - >滚动窗格 - > BorderPane - >场景 - >舞台

Answer 1

这个应用程序演示了正在努力实现的东西。评论在代码中。

主要

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

/** 
* 
* @author blj0011 
*/ 
public class JavaFXApplication6 extends Application { 

    @Override 
    public void start(Stage stage) throws Exception { 
     Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml")); 

     Scene scene = new Scene(root); 

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

    /** 
    * @param args the command line arguments 
    */ 
    public static void main(String[] args) { 
     launch(args); 
    }  
} 

控制器

import java.net.URL; 
import java.util.ResourceBundle; 
import javafx.event.ActionEvent; 
import javafx.fxml.FXML; 
import javafx.fxml.Initializable; 
import javafx.scene.Group; 
import javafx.scene.control.Slider; 
import javafx.scene.paint.Color; 
import javafx.scene.shape.Circle; 

/** 
* 
* @author blj0011 
*/ 
public class FXMLDocumentController implements Initializable { 

    @FXML 
    private Group groupMain; 

    @FXML 
    private Circle cirMain, cirCenter, cirRadius1, cirRadius2, cirRadius3; 

    @FXML 
    private Slider sliderMain; 

    @Override 
    public void initialize(URL url, ResourceBundle rb) { 
     // TODO 



    }  

    @FXML void handleButton(ActionEvent event) 
    { 
     double radius = cirMain.getRadius();//Get transparent mainCircle radius 

     System.out.println(radius + " : " + cirMain.getLayoutX() + " : " + cirMain.getLayoutY()); 

     cirRadius1.setRadius(20); 
     cirRadius1.setLayoutX(radius * Math.cos(50) + cirMain.getLayoutX());//set cirRadius1 to x location on circumference of cirMain 
     cirRadius1.setLayoutY(radius * Math.sin(50) + cirMain.getLayoutY());//set cirRadius1 to y location on circumference of cirMain 
     cirRadius1.setFill(Color.RED); 

     cirRadius2.setRadius(10); 
     cirRadius2.setLayoutX(radius * Math.cos(175) + cirMain.getLayoutX());//set cirRadius2 to x location on circumference of cirMain 
     cirRadius2.setLayoutY(radius * Math.sin(175) + cirMain.getLayoutY());//set cirRadius2 to y location on circumference of cirMain 
     cirRadius2.setFill(Color.YELLOW); 

     cirRadius3.setRadius(15); 
     cirRadius3.setLayoutX(radius * Math.cos(300) + cirMain.getLayoutX());//set cirRadius3 to x location on circumference of cirMain 
     cirRadius3.setLayoutY(radius * Math.sin(300) + cirMain.getLayoutY());//set cirRadius3 to y location on circumference of cirMain 
     cirRadius3.setFill(Color.GREEN); 

     sliderMain.setValue(radius);//set slider value to current cirMain radius 


     //This listener moves the circle inward or outward depending on the slider. It also changes the radius of cirMain's radius 
     sliderMain.valueProperty().addListener((obs, oldVal, newVal)->{ 
      cirMain.setRadius(newVal.doubleValue()); 
      cirRadius1.setLayoutX(newVal.doubleValue() * Math.cos(50) + cirMain.getLayoutX()); 
      cirRadius1.setLayoutY(newVal.doubleValue() * Math.sin(50) + cirMain.getLayoutY()); 

      cirRadius2.setLayoutX(newVal.doubleValue() * Math.cos(175) + cirMain.getLayoutX()); 
      cirRadius2.setLayoutY(newVal.doubleValue() * Math.sin(175) + cirMain.getLayoutY()); 

      cirRadius3.setLayoutX(newVal.doubleValue() * Math.cos(300) + cirMain.getLayoutX()); 
      cirRadius3.setLayoutY(newVal.doubleValue() * Math.sin(300) + cirMain.getLayoutY()); 
     }); 

    } 
} 

FXML

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

<?import javafx.scene.control.Button?> 
<?import javafx.scene.control.Slider?> 
<?import javafx.scene.layout.AnchorPane?> 
<?import javafx.scene.shape.Circle?> 


<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="518.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="javafxapplication6.FXMLDocumentController"> 
    <children> 
     <Circle fx:id="cirMain" fill="#ededed00" layoutX="300.0" layoutY="200.0" radius="175.0" stroke="BLACK" strokeType="INSIDE" /> 
     <Circle fx:id="cirCenter" fill="DODGERBLUE" layoutX="300.0" layoutY="200.0" radius="14.0" stroke="BLACK" strokeType="INSIDE" /> 
     <Circle fx:id="cirRadius1" fill="DODGERBLUE" layoutX="177.0" layoutY="156.0" radius="25.0" stroke="BLACK" strokeType="INSIDE" /> 
     <Circle fx:id="cirRadius2" fill="DODGERBLUE" layoutX="412.0" layoutY="166.0" radius="35.0" stroke="BLACK" strokeType="INSIDE" /> 
     <Circle fx:id="cirRadius3" fill="DODGERBLUE" layoutX="237.0" layoutY="290.0" radius="27.0" stroke="BLACK" strokeType="INSIDE" /> 
     <Button layoutX="288.0" layoutY="479.0" mnemonicParsing="false" onAction="#handleButton" text="Button" /> 
     <Slider fx:id="sliderMain" blockIncrement="1.0" layoutX="34.0" layoutY="418.0" max="200.0" prefHeight="38.0" prefWidth="551.0" showTickLabels="true" showTickMarks="true" /> 
    </children> 
</AnchorPane>