JavaFX 画图-直角坐标系
JavaFX 画图-直角坐标系
1.实际效果
2.分析
1. 如图所绘制的直角坐标系是由三个主要部分组成的
①实心三角形,即坐标轴正方向
②坐标轴,即一条水平直线和竖直直线
③坐标原点(不用画出)
2. 坐标系由三部分组成,而实际需要提供的参数只有两个:坐标原点的位置、坐标轴的长度。作图时根据给定的原点坐标[(centerX,centerY)]和坐标轴的长度(axisLength),可以计算出水平轴的起点坐标[(xStartX,yStartY)]和终点坐标[( xEndX,xEndY )]、竖直轴的起点坐标[( yStartX,yStartY )]和终点坐标[( yEndX,yEndY )]。
xStartX=centerX+axisLength/2
xStartY=centerY
xEndX=centerX-axisLength/2
xEndY=centerY
yStartX=centerX
yStartY=centerY+axisLength/2
yEndX=centerX
yEndY= centerY-axisLength/2
3. 给定两个确定参数的实心三角形,作为坐标轴的方向。
4. 由给定的以上参数去自定义坐标轴的直线和坐标系的类。
3.准备工作及步骤
1. 自定义DrawHLine类,用以绘制x轴。并初始化线段的参数,颜色。
2. 自定义DrawVLine类,用以绘制y轴。并初始化线段的参数,颜色,使x,y的颜色一致。
3. 自定义DrawAxis类,在类中定义四个私有属性,创建Getter方法。
/**
* 坐标轴的方向
*/
private Polygon xAxisTip;
private Polygon yAxisTip;
/**
* 坐标轴
*/
private DrawHLine xAxis;
private DrawVLine yAxis;
4. 在DrawAxis类中创建初始化方法,给代表坐标轴方向的两个三角形的参数初始化。
5. 写一个调用的类包含main方法,用以测试类的正确性。
5.总结
在绘制坐标系的过程中,最难的就是如何由原点坐标和坐标轴长度去确定x,y轴两条直线的绘制和表示x,y轴方向的两个三角形的绘制。需要确定三角形的位置和形状。在绘制的过程中,有自定义类和对组件类的调用。将以完成的各个组件同时添加在一个Parent元素上,并在Stage中显示。
还可以将一些坐标系的特征解耦出来,便于根据需要自定义。这个读者可以自己完成。
6.源码展示
1. DrawHLine类
/**
* @author Kejin
* function: Maybe this class is just used to draw a x-axis
*
*/
package graphics;
import javafx.scene.paint.Color;
import javafx.scene.shape.Line;
public class DrawHLine extends Line {
double startX;
double startY;
double endX;
double endY;
public DrawHLine() {
// TODO Auto-generated constructor stub
}
public DrawHLine(double centerX,double centerY ,double lineLength) {
super(centerX-lineLength/2, centerY, centerX+lineLength/2, centerY);
// TODO Auto-generated constructor stub
getLinePara(centerX, centerY, lineLength);
//可补充
selfDefine();
}
public void getLinePara(double x,double y,double lineLength) {
startX = x-lineLength/2;
endX = x+lineLength/2;
startY = y;
endY = y;
}
public void selfDefine() {
setStroke(Color.GREEN);
//设置画线使用虚线,实线长度,虚线长度
//getStrokeDashArray().setAll();
}
}
2.DrawVLine类
/**
* @author Kejin
* function: Maybe this class is just used to draw a y-axis
*
*/
package graphics;
import javafx.scene.paint.Color;
import javafx.scene.shape.Line;
public class DrawVLine extends Line {
double startX;
double startY;
double endX;
double endY;
public DrawVLine() {
// TODO Auto-generated constructor stub
}
public DrawVLine(double centerX,double centerY ,double lineLength) {
super(centerX, centerY-lineLength/2, centerX, centerY+lineLength/2);
// TODO Auto-generated constructor stub
getLinePara(centerX, centerY, lineLength);
//可补充
selfDefine();
}
public void getLinePara(double x,double y,double lineLength) {
startX = x ;
endX = x ;
startY = y-lineLength/2;
endY = y+lineLength/2;
}
public void selfDefine() {
setStroke(Color.GREEN);
//设置画线使用虚线,实线长度,虚线长度
//getStrokeDashArray().setAll();
}
}
3.DrawAxis类
/**
* @author Kejin
* function: draw a coordinate system
*
* PS: how to call it?
* DrawAxis axis=new DrawAxis(150, 100, 100);
* root.getChildren().addAll(
* axis.getxAxis(),
* axis.getyAxis(),
* axis.getxAxisTip(),
* axis.getyAxisTip());
*
*/
package graphics;
import javafx.scene.paint.Color;
import javafx.scene.shape.Polygon;
import javafx.scene.shape.Shape;
public class DrawAxis{
private static int PRE_CENTER_X=80;
private static int PRE_CENTER_Y=80;
private static int PRE_AXIS_LENGTH=40;
private int centerX;
private int centerY;
private int axisLength;
//init axis Tip
double xPoint[] = new double [6];
//注意坐标是将第四象限作为第一象限
double yPoint[] = new double [6];
/**
* 坐标轴的箭头
*/
private Polygon xAxisTip;
private Polygon yAxisTip;
/**
* 坐标轴
*/
private DrawHLine xAxis;
private DrawVLine yAxis;
/**
* Creates an empty instance of DrawAxis
*/
public DrawAxis() {
// TODO Auto-generated constructor stub
//the parameters is undefined,so set default values;
centerX = 40;
centerY = 40;
axisLength = 20;
xAxis = new DrawHLine(centerX, centerY, axisLength);
yAxis = new DrawVLine(centerX, centerY, axisLength);
initPara(centerX, centerY, axisLength);
}
/**
* Creates a new instance of Polygon.
* @param (centerX , centerY) is the coordinate of Axis;
* @param axisLenth is the length of axis;
*/
public DrawAxis(int centerX , int centerY , int axisLength){
xAxis = new DrawHLine(centerX, centerY, axisLength);
yAxis = new DrawVLine(centerX, centerY, axisLength);
initPara(centerX, centerY, axisLength);
}
public void selfDefine() {
//设置画线使用虚线,实线长度,虚线长度
//getStrokeDashArray().setAll();
}
public void initPara(int x,int y,int length) {
this.centerX=x;
this.centerY=y;
this.axisLength=length;
System.out.println(centerX);
System.out.println(centerY);
System.out.println(axisLength);
//init axis Tip
xPoint[0] = centerX+axisLength/2+10;
xPoint[1] = centerY;
xPoint[2] = centerX+axisLength/2-1;
xPoint[3] = centerY+4;
xPoint[4] = centerX+axisLength/2-1;
xPoint[5] = centerY-4;
//注意坐标是将第四象限作为第一象限
yPoint[0] = centerX;
yPoint[1] = centerY-10-axisLength/2;
yPoint[2] = centerX-4;
yPoint[3] = centerY-axisLength/2-1;
yPoint[4] = centerX+4;
yPoint[5] = centerY-axisLength/2-1;
//
xAxisTip = new Polygon(xPoint);
yAxisTip = new Polygon(yPoint);
xAxisTip.setFill(Color.GREEN);
yAxisTip.setFill(Color.GREEN);
}
/**
*
* @return xAxisTip
*/
public Polygon getxAxisTip() {
return xAxisTip;
}
/**
*
* @return yAxisTip
*/
public Polygon getyAxisTip() {
return yAxisTip;
}
/**
*
* @return yAxisTip
*/
public DrawHLine getxAxis() {
return xAxis;
}
/**
*
* @return yAxisTip
*/
public DrawVLine getyAxis() {
return yAxis;
}
}
4.AxisTest类,用以调用完成的类,
package test;
import graphics.DrawAxis;
import graphics.DrawCircle;
import javafx.application.Application;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.layout.Region;
import javafx.stage.Stage;
/**
* A sample that demonstrates polygon construction.
*/
public class AxisTest extends Application {
// Will be a simple red-filled triangle
private int centerX=300;
private int centerY=300;
private int axisLength=100;
public Parent createContent() {
Pane root = new Pane();
root.setPrefSize(300, 200);
root.setMinSize(Region.USE_PREF_SIZE, Region.USE_PREF_SIZE);
root.setMaxSize(Region.USE_PREF_SIZE, Region.USE_PREF_SIZE);
DrawAxis axis=new DrawAxis(150, 100, 100);
DrawCircle circle = new DrawCircle(150, 100, 40);
root.getChildren().addAll(
axis.getxAxis(),
axis.getyAxis(),
axis.getxAxisTip(),
axis.getyAxisTip(),
circle);
return root;
}
@Override
public void start(Stage primaryStage) throws Exception {
primaryStage.setTitle(" Coordinate System");
primaryStage.setScene(new Scene(createContent()));
primaryStage.show();
}
/**
* Java main for when running without JavaFX launcher
*/
public static void main(String[] args) {
launch(args);
}
}