参考原文：DOC-03-18 滑动条(Slider) | JavaFX中文资料
javaFX应用程序中使用滑动条（Slider）来显示一个区间范围内的数据并与之交互。Slider控件由一个滑轨（Track）和一个可拖放的滑块（Thumb）组成。它也可以包括多个刻度标记（TickMark）和刻度标签（TickLabel），用于表示数值区间范围
滑块的主要组成元素
创建一个Slider
Slider slider = new Slider();
slider.setMin(0); 表示的数据的最小值
slider.setMax(100); 表示的数据的最大值
slider.setValue(40); 设置当前值
slider.setShowTickLabels(true); 是否显示刻度值
slider.setShowTickMarks(true); 是否显示刻度线
slider.setMajorTickUnit(50); 刻度Mark之间的单位距离被设置为了50
slider.setMinorTickCount(5); 每两个主刻度之间都被设置分为了5个小刻度
slider.setBlockIncrement(10); Thumb将会向点击位置的方向移动10个单元
setMin和SetMax方法分别定义了Slider所表示的数据的最小和最大值。setValue方法指定了Slider的当前值，当前值应该永远比最大值要小并且比最小值要大。在程序启动时将使用此方法来定义滑块的所在位置。setShowTickMarks和setShowTickLabels方法都需要传递Boolean型参数，它们定义了Slider的外观
刻度的Mark和Label都被启用了。另外主刻度Mark之间的单位距离被设置为了50，而每两个主刻度之间都被设置分为了5个小刻度。你可以调用setSnapToTicks方法并设置参数值为true，这样可以使Slider所表示的值永远对齐到刻度标记之上。
setBlockIncrement方法定义了当用户点击Track时Thumb的移动距离。该值被设置为了10，也就是说每次用户点击Track时，Thumb将会向点击位置的方向移动10个单元
在图片展示程序中使用Slider
这个应用程序使用了3个Slider来编辑图片的渲染效果。每个Slider会调整一个特定的视觉效果：不透明度（Opacity）、棕褐色调值（SepiaTone）、缩放因子（ScalingFactor）
带有三个Slider的程序
ImageView对象的opacity属性根据第一个名为opacityLevel的Slider的值而改变。SepiaTone效果的等级根据名为sepiaTone的Slider而改变。第三个Slider定义了图片的缩放因子，它的当前值被传给了setScaleX和setScaleY方法
import javafx.application.Application;
import javafx.beans.value.ObservableValue;
import javafx.geometry.Insets;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.effect.SepiaTone;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.GridPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
public class SliderTest extends Application {
final Slider opacityLevel = new Slider(0, 1, 1);//创建一个Slider对象
final Slider sepiaTone = new Slider(0, 1, 1);//创建一个Slider对象
final Slider scaling = new Slider (0.5, 1, 1);//创建一个Slider对象
final Image image = new Image(getClass().getResourceAsStream(
"background1.jpg")//在类路径下引入图片
);
final Label opacityCaption = new Label("Opacity Level:");//透明度设置
final Label sepiaCaption = new Label("Sepia Tone:");//棕色色调设置
final Label scalingCaption = new Label("Scaling Factor:");//缩放因子设置
final Label opacityValue = new Label(
Double.toString(opacityLevel.getValue()));//透明度数值显示标签
final Label sepiaValue = new Label(
Double.toString(sepiaTone.getValue()));//棕色调色值数据显示标签
final Label scalingValue = new Label(
Double.toString(scaling.getValue()));//缩放因子值
final static Color textColor = Color.BLUE;//蓝色
final static SepiaTone sepiaEffect = new SepiaTone();//深褐色
@Override
public void start(Stage stage) {
Group root = new Group();//节点组容器对象
Scene scene = new Scene(root, 600, 400);//场景对象
stage.setScene(scene);//舞台设置场景
stage.setTitle("滑动组件标题");
GridPane grid = new GridPane();//表格布局面板对象
grid.setPadding(new Insets(10, 10, 10, 10));//布局对象中设置内边距
grid.setVgap(10);//设置垂直间隙距离
grid.setHgap(70);//设置水平间隙距离
final ImageView cappuccino = new ImageView (image);//创建图片显示区域
cappuccino.setEffect(sepiaEffect);//图片设置棕色特效
GridPane.setConstraints(cappuccino, 0, 0);//表格布局器第一行第一列设置放入图片视图区域
GridPane.setColumnSpan(cappuccino, 3);//设置图片跨三列
grid.getChildren().add(cappuccino);//图片在表格布局器中跨三列
scene.setRoot(grid);//场景上添加表格布局器
opacityCaption.setTextFill(textColor);//透明度文字标签添加颜色
GridPane.setConstraints(opacityCaption, 0, 1);//表格布局器第2行第一列添加文字标签
grid.getChildren().add(opacityCaption);//表格容器中添加label标签对象
opacityLevel.valueProperty().addListener((//给Slider组件对象添加事件监听器
ObservableValue<? extends Number> ov,
Number old_val, Number new_val) -> {//新救治改变事件回调函数
cappuccino.setOpacity(new_val.doubleValue());//图片对象透明度值的设置
opacityValue.setText(String.format("%.2f", new_val));//文字标签对象文本值的设置
});
GridPane.setConstraints(opacityLevel, 1, 1);//给透明度Slider设置在表格布局中的布局属性
grid.getChildren().add(opacityLevel);//布局容器对象中添加文本标签对象
opacityValue.setTextFill(textColor);//文字标签label设置颜色
GridPane.setConstraints(opacityValue, 2, 1);//文本label对象布局到表格布局器中位置为第二行第二列
grid.getChildren().add(opacityValue);//表格布局器中添加透明度文字标签
sepiaCaption.setTextFill(textColor);//调色Slider对象文字颜色设置
GridPane.setConstraints(sepiaCaption, 0, 2);//第三行第1列添加文本标签对象
grid.getChildren().add(sepiaCaption);//文本标签添加到表格布局器中
sepiaTone.valueProperty().addListener((//给颜色效果调制Slider对象添加值改监听器对象
ObservableValue<? extends Number> ov, Number old_val,
Number new_val) -> {//匿名监听器对象的创建以及监听事件处理回调函数的实现
sepiaEffect.setLevel(new_val.doubleValue());//棕色特效值的设置
sepiaValue.setText(String.format("%.2f", new_val));//棕色文本标签值的设置
});
GridPane.setConstraints(sepiaTone, 1, 2);//表格布局器中布局调色Slider对象的布局规约设置
grid.getChildren().add(sepiaTone);//布局器中添加被布局的节点对象
sepiaValue.setTextFill(textColor);//给文本标签添加颜色
GridPane.setConstraints(sepiaValue, 2, 2);//约束颜色标签文本label对象的布局位置
grid.getChildren().add(sepiaValue);//布局对象上添加label标签
scalingCaption.setTextFill(textColor);//label标签颜色设置
GridPane.setConstraints(scalingCaption, 0, 3);//给label元素设置在GridPane布局器上的布局位置约束
grid.getChildren().add(scalingCaption);//grid上添加被布局的节点对象
scaling.valueProperty().addListener((//缩放比例Slider组件交互事件监听器对象的添加
ObservableValue<? extends Number> ov, Number old_val,
Number new_val) -> {//监听对象的事件监听回调函数的实现
cappuccino.setScaleX(new_val.doubleValue());//设置图片在X轴上的缩放比例
cappuccino.setScaleY(new_val.doubleValue());//设置图片在Y轴上的缩放比例
scalingValue.setText(String.format("%.2f", new_val));//设置缩放标签文本label显示的文字
});
GridPane.setConstraints(scaling, 1, 3);//设置表格布局对象在第四行第二列上面的布局约束
grid.getChildren().add(scaling);//布局对象上添加缩放Slider组件
scalingValue.setTextFill(textColor);//label添加颜色
GridPane.setConstraints(scalingValue, 2, 3);//设置scalingValue对象在grid对象上的布局约定：第四行第三列
grid.getChildren().add(scalingValue);//表格布局对象中添加缩放文字标签对象
stage.show();//舞台展现
}
public static void main(String[] args) {
launch(args);
}
}
ImageView对象的opacity属性根据第一个名为opacityLevel的Slider的值而改变。SepiaTone效果的等级根据名为sepiaTone的Slider而改变。第三个Slider定义了图片的缩放因子，它的当前值被传给了setScaleX和setScaleY方法
展示了将Slider类的getValue方法返回的double类型的值转换成String类型。它同时将这个值格式化成一个带有两位小数的float数字来展示Slider的值
格式化Slider的展示值
scalingValue.setText(String.format("%.2f", new_val));
扫一扫
2034
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
