如何在JavaFX畫布上用鼠標繪製連續線？

下面的代碼產生了一個JavaFX Canvas，它可以用鼠標指針繪製，但會跳過一些點，即，如果試圖繪製連續線，則會留下間隙。隨着指針速度的增加，間隙增大。如何在JavaFX畫布上用鼠標繪製連續線？

是什麼導致了這種行爲，並且可以做些什麼來實現良好連接的線？（NB，我想找明確切換每個單個像素的指針經過黑色，不操作，例如平滑化或連接點等的答案）

public class DrawingSample extends Application { 
    public void start(Stage stage) { 
     FlowPane flowPane = new FlowPane(); 
     Canvas canvas = new Canvas(300, 300); 
     flowPane.getChildren().add(canvas); 
     GraphicsContext graphicsContext = canvas.getGraphicsContext2D(); 

     graphicsContext.setFill(Color.WHITE); 
     graphicsContext.fillRect(0, 0, 300, 300); 

     canvas.setOnMouseDragged((event) -> { 
      graphicsContext.setFill(Color.BLACK); 
      graphicsContext.fillRect(event.getX(), event.getY(), 1, 1); 
     }); 

     stage.setScene(new Scene(flowPane)); 
     stage.show(); 
    } 

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

下圖展示了3我們往下走的時候，從左到右以不斷增加的速度劃線。

來源

2017-04-15 basse

從here此代碼。

import javafx.application.Application; 
import javafx.event.EventHandler; 
import javafx.scene.Scene; 
import javafx.scene.canvas.Canvas; 
import javafx.scene.canvas.GraphicsContext; 
import javafx.scene.input.MouseEvent; 
import javafx.scene.layout.StackPane; 
import javafx.scene.paint.Color; 
import javafx.stage.Stage; 

/** 
* @web http://java-buddy.blogspot.com/ 
*/ 
public class JavaFX_DrawOnCanvas extends Application { 

    @Override 
    public void start(Stage primaryStage) { 

     Canvas canvas = new Canvas(400, 400); 
     final GraphicsContext graphicsContext = canvas.getGraphicsContext2D(); 
     initDraw(graphicsContext); 

     canvas.addEventHandler(MouseEvent.MOUSE_PRESSED, 
       new EventHandler<MouseEvent>(){ 

      @Override 
      public void handle(MouseEvent event) { 
       graphicsContext.beginPath(); 
       graphicsContext.moveTo(event.getX(), event.getY()); 
       graphicsContext.stroke(); 
      } 
     }); 

     canvas.addEventHandler(MouseEvent.MOUSE_DRAGGED, 
       new EventHandler<MouseEvent>(){ 

      @Override 
      public void handle(MouseEvent event) { 
       graphicsContext.lineTo(event.getX(), event.getY()); 
       graphicsContext.stroke(); 
      } 
     }); 

     canvas.addEventHandler(MouseEvent.MOUSE_RELEASED, 
       new EventHandler<MouseEvent>(){ 

      @Override 
      public void handle(MouseEvent event) { 

      } 
     }); 

     StackPane root = new StackPane(); 
     root.getChildren().add(canvas); 
     Scene scene = new Scene(root, 400, 400); 
     primaryStage.setTitle("java-buddy.blogspot.com"); 
     primaryStage.setScene(scene); 
     primaryStage.show(); 
    } 

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

    private void initDraw(GraphicsContext gc){ 
     double canvasWidth = gc.getCanvas().getWidth(); 
     double canvasHeight = gc.getCanvas().getHeight(); 

     gc.setFill(Color.LIGHTGRAY); 
     gc.setStroke(Color.BLACK); 
     gc.setLineWidth(5); 

     gc.fill(); 
     gc.strokeRect(
       0,    //x of the upper left corner 
       0,    //y of the upper left corner 
       canvasWidth, //width of the rectangle 
       canvasHeight); //height of the rectangle 

     gc.setFill(Color.RED); 
     gc.setStroke(Color.BLUE); 
     gc.setLineWidth(1); 

    } 

}

來源

2017-04-15 17:51:42 Sedrick

廣東話，我們只需要使用[線路]（https://docs.oracle.com/javase/8/javafx/api/javafx/scene/shape/Line.html）直接和公正的改變endX（）和endY（）鼠標拖動？ – Oswald

我對此表示懷疑。線繪製一條直線。 – Sedrick

對不起，我的壞，我認爲OP是要求一條直線:) – Oswald

對不起之前的消息，應該在新線程中提問，對不對？

下面是一個更好的解決方案，不會像上面的scribbletest那樣創建奇怪的線條。

canvas.addEventHandler(MouseEvent.MOUSE_PRESSED, 
     new EventHandler<MouseEvent>(){ 
    @Override 
    public void handle(MouseEvent event) { 
     graphicsContext.beginPath(); 
     graphicsContext.moveTo(event.getX(), event.getY()); 
     graphicsContext.stroke(); 

    } 
}); 

canvas.addEventHandler(MouseEvent.MOUSE_DRAGGED, 
     new EventHandler<MouseEvent>(){ 
    @Override 
    public void handle(MouseEvent event) { 
     graphicsContext.lineTo(event.getX(), event.getY()); 
     graphicsContext.stroke(); 
     graphicsContext.closePath(); 
     graphicsContext.beginPath(); 
     graphicsContext.moveTo(event.getX(), event.getY()); 
    } 
}); 

canvas.addEventHandler(MouseEvent.MOUSE_RELEASED, 
     new EventHandler<MouseEvent>(){ 
    @Override 
    public void handle(MouseEvent event) { 
     graphicsContext.lineTo(event.getX(), event.getY()); 
     graphicsContext.stroke(); 
     graphicsContext.closePath(); 
    } 
});

來源

2017-11-14 11:13:33 pelgrim

如何在JavaFX畫布上用鼠標繪製連續線？

回答

相關問題