JavaFX - 2D Shapes Quad Curve

Matematicamente, uma curva quadrática é aquela que é descrita por uma função quadrática como - y = ax ² + bx + c.

Na computação gráfica, as curvas de Bézier são usadas. Essas são curvas paramétricas que parecem razoavelmente suaves em todas as escalas. Essas curvas de Bézier são desenhadas com base em pontos em um plano XY.

Uma curva quadrática é uma curva paramétrica de Bezier no plano XY que é uma curva de grau 2. Ela é desenhada usando três pontos: start point, end point e control point como mostrado no diagrama a seguir

No JavaFX, um QuadCurve é representado por uma classe chamada QuadCurve. Esta classe pertence ao pacotejavafx.scene.shape.

Ao instanciar essa classe, você pode criar um nó QuadCurve no JavaFX.

Esta classe tem 6 propriedades do tipo de dados duplo, a saber -

startX - A coordenada x do ponto inicial da curva.
startY - A coordenada y do ponto inicial da curva.
controlX - A coordenada x do ponto de controle da curva.
controlY - A coordenada y do ponto de controle da curva.
endX - A coordenada x do ponto final da curva.
endY - A coordenada y do ponto final da curva.

Para desenhar uma QuadCurve, você precisa passar valores para essas propriedades. Isso pode ser feito passando-os para o construtor desta classe, na mesma ordem, no momento da instanciação, da seguinte maneira -

QuadCurve quadcurve = new QuadCurve(startX, startY, controlX, controlY, endX, endY);

Ou, usando seus respectivos métodos de setter como segue -

setStartX(value); 
setStartY(value); 
setControlX(value); 
setControlY(value); 
setEndX(value); 
setEndY(value);

Passos para desenhar quadricurva

Para desenhar uma curva quadrilateral de Bezier no JavaFX, siga as etapas abaixo.

Etapa 1: Criação de uma classe

Crie uma classe Java e herde o Application classe do pacote javafx.application. Então você pode implementar ostart() método desta classe da seguinte forma.

public class ClassName extends Application { 
   @Override     
   public void start(Stage primaryStage) throws Exception {     
   }    
}

Etapa 2: Criando uma QuadCurve

Você pode criar uma QuadCurve em JavaFX instanciando a classe chamada QuadCurve que pertence a um pacote javafx.scene.shape. Você pode então instanciar essa classe, conforme mostrado no bloco de código a seguir.

//Creating an object of the class QuadCurve 
QuadCurve quadcurve = new QuadCurve();

Etapa 3: Configurando Propriedades para QuadCurve

Especifique as coordenadas x, y dos três pontos: ponto inicial, ponto final e pontos de controle, da curva necessária, usando seus respectivos métodos de setter, conforme mostrado no bloco de código a seguir.

//Adding properties to the Quad Curve 
quadCurve.setStartX(100.0); 
quadCurve.setStartY(220.0f); 
quadCurve.setEndX(500.0f); 
quadCurve.setEndY(220.0f);
quadCurve.setControlX(250.0f); 
quadCurve.setControlY(0.0f);

Etapa 4: Criação de um objeto de grupo

No start() método, crie um objeto de grupo instanciando a classe chamada Group, que pertence ao pacote javafx.scene.

Passe o objeto QuadCurve (nó) criado na etapa anterior como um parâmetro para o construtor da classe Group, a fim de adicioná-lo ao grupo da seguinte maneira -

Group root = new Group(quadcurve);

Etapa 5: Criação de um objeto de cena

Crie uma cena instanciando a classe chamada Sceneque pertence ao pacote javafx.scene. Para esta aula passe o objeto Grupo(root) criado na etapa anterior.

Além do objeto raiz, você também pode passar dois parâmetros duplos que representam a altura e a largura da tela junto com o objeto da classe Grupo da seguinte maneira.

Scene scene = new Scene(group ,600, 300);

Etapa 6: definir o título do palco

Você pode definir o título do palco usando o setTitle()método da classe Stage. oprimaryStage é um objeto Stage que é passado para o método start da classe Scene, como um parâmetro.

Usando o primaryStage objeto, defina o título da cena como Sample Application do seguinte modo.

primaryStage.setTitle("Sample Application");

Etapa 7: Adicionando cena ao palco

Você pode adicionar um objeto Scene ao palco usando o método setScene()da classe chamada Stage. Adicione o objeto Scene preparado no anteriorsteps usando este método da seguinte maneira.

primaryStage.setScene(scene);

Etapa 8: Exibindo o conteúdo do palco

Exibir o conteúdo da cena usando o método chamado show() do Stage classe da seguinte forma.

primaryStage.show();

Etapa 9: iniciar o aplicativo

Inicie o aplicativo JavaFX chamando o método estático launch() do Application classe do método principal da seguinte forma.

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

Exemplo

A seguir está um programa que gera uma curva quadrilateral usando JavaFX. Salve este código em um arquivo com o nomeQuadCurveExample.java.

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.stage.Stage; 
import javafx.scene.shape.QuadCurve;  

public class QuadCurveExample extends Application {  
   @Override 
   public void start(Stage stage) {        
      //Creating a QuadCurve 
      QuadCurve quadCurve = new QuadCurve();  
       
      //Adding properties to the Quad Curve 
      quadCurve.setStartX(100.0); 
      quadCurve.setStartY(220.0f); 
      quadCurve.setEndX(500.0f); 
      quadCurve.setEndY(220.0f); 
      quadCurve.setControlX(250.0f); 
      quadCurve.setControlY(0.0f);       
               
      //Creating a Group object  
      Group root = new Group(quadCurve);
      
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300);  
      
      //Setting title to the Stage 
      stage.setTitle("Drawing a Quad curve"); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show(); 
   }    
   public static void main(String args[]){ 
      launch(args); 
   } 
}

Compile e execute o arquivo java salvo no prompt de comando usando os comandos a seguir.

javac QuadCurveExample.java 
java QuadCurveExample

Ao ser executado, o programa acima gera uma janela JavaFX exibindo uma curva quadrilateral de Bezier, conforme mostrado na imagem a seguir.

↰ Previous page