JavaFX - formas 2D

No capítulo anterior, vimos a aplicação básica do JavaFX, onde aprendemos como criar uma janela vazia e como desenhar uma linha em um plano XY do JavaFX. Além da linha, também podemos desenhar várias outras formas 2D.

Forma 2D

Em geral, uma forma 2D é uma figura geométrica que pode ser desenhada no plano XY, que inclui linha, retângulo, círculo, etc.

Usando a biblioteca JavaFX, você pode desenhar -

• Formas predefinidas como Linha, Retângulo, Círculo, Elipse, Polígono, Polilinha, Curva Cúbica, Curva Quad, Arco.

• Elementos de caminho, como Elemento de caminho MoveTO, Linha, Linha horizontal, Linha vertical, Curva cúbica, Curva quadrática, Arco.

• Além disso, você também pode desenhar uma forma 2D analisando o caminho SVG.

Cada uma das formas 2D acima mencionadas é representada por uma classe e todas essas classes pertencem ao pacote javafx.scene.shape. A classe chamadaShape é a classe base de todas as formas bidimensionais em JavaFX.

Criação de uma forma 2D

Para criar um gráfico, você precisa -

• Instancie a respectiva classe da forma necessária.
• Defina as propriedades da forma.
• Adicione o objeto de forma ao grupo.

Instanciando a respectiva classe

Para criar uma forma bidimensional, primeiro de tudo você precisa instanciar sua respectiva classe.

Por exemplo, se você deseja criar uma linha, você precisa instanciar a classe chamada Line da seguinte maneira -

Line line = new Line();

Definindo as propriedades da forma

Depois de instanciar a classe, você precisa definir as propriedades da forma usando os métodos setter.

Por exemplo, para desenhar uma linha, você precisa passar suas coordenadas xey do ponto inicial e do ponto final da linha. Você pode especificar esses valores usando seus respectivos métodos setter da seguinte forma -

//Setting the Properties of the Line 
line.setStartX(150.0f); 
line.setStartY(140.0f);         
line.setEndX(450.0f); 
line.setEndY(140.0f);

Adicionando o Objeto Forma ao Grupo

Finalmente, você precisa adicionar o objeto da forma ao grupo, passando-o como um parâmetro do construtor, conforme mostrado abaixo.

//Creating a Group object  
Group root = new Group(line);

A tabela a seguir fornece a lista de várias formas (classes) fornecidas pelo JavaFX.

S.Não	Forma e descrição
1	Linha Uma linha é uma estrutura geométrica que une dois pontos. oLine classe do pacote javafx.scene.shape representa uma linha no plano XY.
2	Retângulo Em geral, um retângulo é um polígono de quatro lados que tem dois pares de lados paralelos e concorrentes com todos os ângulos internos como ângulos retos. No JavaFX, um retângulo é representado por uma classe chamadaRectangle. Esta classe pertence ao pacotejavafx.scene.shape.
3	Retângulo Arredondado No JavaFX, você pode desenhar um retângulo com bordas agudas ou com bordas arqueadas e aquele com bordas arqueadas é conhecido como retângulo arredondado.
4	Círculo Um círculo é uma linha que forma um loop fechado, em que cada ponto está a uma distância fixa de um ponto central. No JavaFX, um círculo é representado por uma classe chamadaCircle. Esta classe pertence ao pacotejavafx.scene.shape.
5	Elipse Uma elipse é definida por dois pontos, cada um denominado foco. Se qualquer ponto da elipse for tomado, a soma das distâncias aos pontos de foco é constante. O tamanho da elipse é determinado pela soma dessas duas distâncias. No JavaFX, uma elipse é representada por uma classe chamada Ellipse. Esta classe pertence ao pacotejavafx.scene.shape.
6	Polígono Uma forma fechada formada por vários segmentos de linha coplanares conectados de ponta a ponta. No JavaFX, um polígono é representado por uma classe chamadaPolygon. Esta classe pertence ao pacotejavafx.scene.shape.
7	Polilinha Uma polilinha é o mesmo que um polígono, exceto que uma polilinha não é fechada no final. Ou linha contínua composta por um ou mais segmentos de linha. No JavaFX, uma polilinha é representada por uma classe chamadaPolygon. Esta classe pertence ao pacotejavafx.scene.shape.
8	Curva Cúbica Uma curva cúbica é uma curva paramétrica de Bezier no plano XY é uma curva de grau 3. No JavaFX, uma curva cúbica é representada por uma classe chamada CubicCurve. Esta classe pertence ao pacotejavafx.scene.shape.
9	QuadCurve Uma curva quadrática é uma curva paramétrica de Bezier no plano XY é uma curva de grau 2. No JavaFX, uma QuadCurve é representada por uma classe chamada QuadCurve. Esta classe pertence ao pacotejavafx.scene.shape.
10	Arco Um arco faz parte de uma curva. No JavaFX, um arco é representado por uma classe chamadaArc. Esta classe pertence ao pacote -javafx.scene.shape. Tipos de arco Além disso, podemos desenhar três tipos de arco Open, Chord, Round.
11	SVGPath No JavaFX, podemos construir imagens analisando caminhos SVG. Essas formas são representadas pela classe chamadaSVGPath. Esta classe pertence ao pacotejavafx.scene.shape. Esta classe possui uma propriedade chamadacontentde tipo de dados String. Isso representa a string codificada do caminho SVG, a partir da qual a imagem deve ser desenhada.

Desenhando mais formas através da classe de caminho

Na seção anterior, vimos como desenhar algumas formas predefinidas simples instanciando classes e definindo os respectivos parâmetros.

Mas, apenas essas formas predefinidas não são suficientes para construir formas mais complexas que não as primitivas fornecidas pelo javafx.shape package.

Por exemplo, se você deseja desenhar um elemento gráfico conforme mostrado no diagrama a seguir, você não pode confiar nessas formas simples.

A classe Path

Para desenhar essas estruturas complexas, o JavaFX fornece uma classe chamada Path. Esta classe representa o contorno geométrico de uma forma.

Ele está anexado a uma lista observável que contém vários Path Elements como moveTo, LineTo, HlineTo, VlineTo, ArcTo, QuadCurveTo, CubicCurveTo.

Na instanciação, essa classe constrói um caminho com base nos elementos de caminho fornecidos.

Você pode passar os elementos do caminho para esta classe enquanto a instancia da seguinte maneira−

Path myshape = new Path(pathElement1, pathElement2, pathElement3);

Ou você pode obter a lista observável e adicionar todos os elementos do caminho usando addAll() método da seguinte forma -

Path myshape = new Path(); 
myshape.getElements().addAll(pathElement1, pathElement2, pathElement3);

Você também pode adicionar elementos individualmente usando o método add () como -

Path myshape = new Path(); 
myshape.getElements().add(pathElement1);

O Elemento Mover para o Caminho

O Elemento Path MoveToé usado para mover a posição atual do caminho para um ponto especificado. Geralmente é usado para definir o ponto inicial de uma forma desenhada usando os elementos do caminho.

É representado por uma classe chamada LineTo do pacote javafx.scene.shape. Ele tem 2 propriedades do tipo de dados duplo, a saber -

• X - A coordenada x do ponto ao qual uma linha deve ser desenhada a partir da posição atual.

• Y - A coordenada y do ponto ao qual uma linha deve ser desenhada a partir da posição atual.

Você pode criar um elemento mover para o caminho instanciando a classe MoveTo e passando as coordenadas x, y do novo ponto da seguinte maneira -

MoveTo moveTo = new MoveTo(x, y);

Se você não passar nenhum valor para o construtor, o novo ponto será definido como (0,0).

Você também pode definir valores para as coordenadas x, y, usando seus respectivos métodos de definição da seguinte forma -

setX(value); 
setY(value);

Exemplo - Desenhando um caminho complexo

Neste exemplo, mostraremos como desenhar a seguinte forma usando o Path, MoveTo e Line Aulas.

Salve este código em um arquivo com o nome ComplexShape.java.

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.stage.Stage; 
import javafx.scene.shape.LineTo; 
import javafx.scene.shape.MoveTo; 
import javafx.scene.shape.Path; 
         
public class ComplexShape extends Application { 
   @Override 
   public void start(Stage stage) { 
      //Creating a Path 
      Path path = new Path(); 
       
      //Moving to the starting point 
      MoveTo moveTo = new MoveTo(108, 71); 
        
      //Creating 1st line 
      LineTo line1 = new LineTo(321, 161);  
       
      //Creating 2nd line 
      LineTo line2 = new LineTo(126,232);       
       
      //Creating 3rd line 
      LineTo line3 = new LineTo(232,52);  
       
      //Creating 4th line 
      LineTo line4 = new LineTo(269, 250);   
       
      //Creating 4th line 
      LineTo line5 = new LineTo(108, 71);  
       
      //Adding all the elements to the path 
      path.getElements().add(moveTo); 
      path.getElements().addAll(line1, line2, line3, line4, line5);        
         
      //Creating a Group object  
      Group root = new Group(path); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300);  
      
      //Setting title to the Stage 
      stage.setTitle("Drawing an arc through a path");
      
      //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 ComplexShape.java 
java ComplexShape

Ao ser executado, o programa acima gera uma janela JavaFX exibindo um arco, que é desenhado da posição atual até o ponto especificado conforme mostrado abaixo.

A seguir estão os vários elementos de caminho (classes) fornecidos pelo JavaFX. Essas classes existem no pacotejavafx.shape. Todas essas classes herdam a classePathElement.

S.Não	Forma e descrição
1	LineTo O elemento path lineé usado para desenhar uma linha reta até um ponto nas coordenadas especificadas da posição atual. É representado por uma classe chamadaLineTo. Esta classe pertence ao pacotejavafx.scene.shape.
2	HlineTo O elemento path HLineToé usado para desenhar uma linha horizontal para um ponto nas coordenadas especificadas da posição atual. É representado por uma classe chamadaHLineTo. Esta classe pertence ao pacotejavafx.scene.shape.
3	VLineTo O elemento path vertical lineé usado para desenhar uma linha vertical até um ponto nas coordenadas especificadas da posição atual. É representado por uma classe chamadaVLineTo. Esta classe pertence ao pacotejavafx.scene.shape.
4	QuadCurveTo A curva quadrática do elemento do caminho é usada para desenhar um quadratic curvepara um ponto nas coordenadas especificadas da posição atual. É representado por uma classe chamadaQuadraticCurveTo. Esta classe pertence ao pacotejavafx.scene.shape.
5	CubicCurveTo O elemento path cubic curveé usado para desenhar uma curva cúbica até um ponto nas coordenadas especificadas da posição atual. É representado por uma classe chamadaCubicCurveTo. Esta classe pertence ao pacotejavafx.scene.shape.
6	ArcTo O elemento path Arcé usado para desenhar um arco em um ponto nas coordenadas especificadas da posição atual. É representado por uma classe chamadaArcTo. Esta classe pertence ao pacotejavafx.scene.shape.

Propriedades de objetos 2D

Para todos os objetos bidimensionais, você pode definir várias propriedades, como preenchimento, traço, StrokeType, etc. A seção a seguir discute várias propriedades de objetos 2D.

• Tipo de golpe
• Largura do traçado
• Preenchimento de traço
• Stroke
• Stroke Line
• Limite de esquadria de curso
• Stroke Line Cap
• Smooth

Operações em objetos 2D

Se adicionarmos mais de uma forma a um grupo, a primeira forma é sobreposta pela segunda, conforme mostrado abaixo.

Além das transformações (girar, dimensionar, traduzir, etc.), transições (animações), você também pode realizar três operações em objetos 2D, a saber - Union, Subtraction e Intersection.

S.Não	Operação e descrição
1	Operação Sindical Esta operação assume duas ou mais formas como entradas e retorna a área ocupada por elas.
2	Operação de Intersecção Esta operação assume duas ou mais formas como entradas e retorna a área de interseção entre elas.
3	Operação de Subtração Esta operação assume duas ou mais formas como entrada. Em seguida, ele retorna a área da primeira forma excluindo a área sobreposta pela segunda forma.