20180828记录
程序员文章站
2022-03-30 18:53:51
...
1.
QuadCurve quadCurve = new QuadCurve();
quadCurve.setStartX(0.0f);
quadCurve.setStartY(50.0f);
quadCurve.setControlX(25.0f);
quadCurve.setControlY(0.0f);
//注意这个类只能设置一个控制点,如果重复设置控制点,
// 那么就使用最后设置的控制点
// quadCurve.setControlX(25.0f);
// quadCurve.setControlY(100.0f);
quadCurve.setEndX(50.0f);
quadCurve.setEndY(50.0);
root.getChildren().add(quadCurve);
primaryStage.setScene(scene);
primaryStage.show();
2.javaFx渐变色
JavaFX渐变颜色
可以使用径向渐变使形状看起来三维(立体)。
梯度绘制可以在两种或更多种颜色之间内插,这给出形状的深度。JavaFX提供两种类型的渐变:径向渐变(RadialGradient
)和线性渐变(LinearGradient
)。
要在JavaFX中创建渐变颜色,需要设置五个属性值。如下 -
- 设置开始起点的第一个停止颜色。
- 将终点设置为终止停止颜色。
- 设置
proportional
属性以指定是使用标准屏幕坐标还是单位平方坐标。 - 将循环方法设置为使用三个枚举:
NO_CYCLE
,REFLECT
或REPEAT
。 - 设置停止颜色数组。
通过将proportional
属性设置为false
,可以基于标准屏幕(x
,y
)坐标将渐变轴设置为起点和终点。
通过将proportional
属性设置为true
,梯度轴线开始点和结束点将被表示为单位平方坐标。 开始点和结束点的x
,y
坐标必须在0.0
和1.0
之间(double
)。
线性梯度(LinearGradient)
要创建线性渐变涂料,为开始点和结束点指定startX
,startY
,endX
和endY
。起点和终点坐标指定渐变模式开始和停止的位置。
下表列出了LinearGradient
属性值 -
属性 | 数据类型及描述 |
---|---|
startX |
Double - 设置梯度轴起点的X 坐标。 |
startY |
Double - 设置梯度轴起点的Y 坐标。 |
endX |
Double - 设置梯度轴终点的X 坐标。 |
endY |
Double - 设置梯度轴终点的Y 坐标 |
proportional |
Boolean - 设置坐标是否与形状成比例。设置为true 时则使用单位正方形坐标,否则使用屏幕坐标系。 |
cycleMethod |
CycleMethod - 设置应用于渐变的循环方法。 |
stops |
List<Stop> - 设置渐变颜色指定的停止列表。 |
径向渐变
下表列出了RadialGradient
属性。
属性 |
数据类型及描述
|
---|---|
focusAngle |
Double - 设置从渐变中心到映射第一种颜色的焦点的角度(以度为单位)。 |
focusDistance |
Double - 设置从渐变中心到映射第一种颜色的焦点的距离。 |
centerX |
Double - 设置渐变圆的中心点的X 坐标。 |
centerY |
Double - 设置渐变圆的中心点的Y 坐标。 |
radius |
Double - 设置颜色渐变的圆的半径。 |
proportional |
boolean - 设置坐标和大小与形状成比例。 |
cycleMethod |
CycleMethod - 设置应用于渐变的Cycle方法。 |
Stops |
List<Stop> - 设置渐变颜色的停止列表 |
private void addBouncyBall(final Scene scene) {
final Circle ball = new Circle(100, 100, 20);
RadialGradient gradient1 = new RadialGradient(0,
.1,
100,
100,
20,
false,
CycleMethod.NO_CYCLE,
new Stop(0, Color.RED),
new Stop(1, Color.BLACK));
ball.setFill(gradient1);
final Group root = (Group) scene.getRoot();
root.getChildren().add(ball);
}
上面这段代码可以生成这个效果