您的位置:首页 > 编程语言 > Java开发

(翻译)第十七回 JavaFX2.0 滚动窗Scroll Pane

2011-11-02 00:32 399 查看
原文地址http://download.oracle.com/javafx/2.0/ui_controls/scrollpane.htm

 

 

滚动窗为UI元素提供了一个可以滚动查看的视图。该控件让用户可以通过移动视口或者滚动条来查看。Figure 11-1是一个添加了图片的默认设置的滚动窗。

Figure 11-1 Scroll Pane



Description of "Figure 11-1 Scroll Pane" 


创建Scroll Pane

Example 11-1 演示了如何在应用中创建滚动窗。

Example 11-1 Using a Scroll Pane to View an Image
Image roses = new Image(getClass().getResourceAsStream("roses.jpg"));
ScrollPane sp = new ScrollPane();
sp.setNode(new ImageView(roses));


setNode
 方法定义了滚动窗的结点是什么内容,可以只指定一个结点。要创建具有多个组件的滚动窗,得用布局容器或者
Group类。可以为
 
setPannable
 方法设置
true值,这样当点击和移动鼠标时能预览图像,滚动条的位置也会相应改变。



为Scroll Pane设置滚动条策略

ScrollPane类提供了一种策略来决定何时显示滚动条:总是、从不、需要时(
 always, never,needed
)。分别使用
setHbarPolicy
 和
setVbarPolicy
 方法为水平滚动条和垂直滚动条指定策略。这样,Example
11-2 中的垂直滚动条会一直显示,而水平的不会显示。

 

Example 11-2 Setting the Horizontal and Vertical Scroll Bar Policies
sp.setHbarPolicy(ScrollBarPolicy.NEVER);
sp.setVbarPolicy(ScrollBarPolicy.ALWAYS);


 

结果是只能垂直地滚动图片,见 Figure 11-2 .

Figure 11-2 Disabling the Horizontal Scroll Bar



Description of "Figure 11-2 Disabling the Horizontal Scroll Bar " 


改变Scroll Pane中组件的大小

设计UI接口时可能需要能够改变组件的大小已让它们适合滚动窗的宽和高。为 
setFitToWidth
 或 
setFitToHeight
方法设置
true
 值来匹配特定的方向。

Figure 11-3 中的滚动窗包含单选按钮、文本框和密码框。这些内容的大小超过了滚动窗预先定义的尺寸,所以垂直滚动条显示了出来。然而,由于
setFitToWidth
 方法被设为
true,视窗宽度会伸缩使水平方向无滚动条。


 

Figure 11-3 Fitting the Width of the Scroll Pane



Description of "Figure 11-3 Fitting the Width of the Scroll Pane" 

 

默认
FIT_TO_WIDTH
 和 
FIT_TO_HEIGHT
 属性都是
false,可改变大小的内容也保持原始大小。从上面代码移除
setFitToWidth
 方法后,显示如Figure
11-4 .

Figure 11-4 Default Properties for Fitting the Content



Description of "Figure 11-4 Default Properties for Fitting the Content" 

ScrollPane
 类可以取回和设置内容在水平和垂直方向的当前、最小、最大值。学习怎么使用吧


使用Scroll Pane的样例程序

Example 11-3 使用滚动窗显示一个带有图片的垂直盒子。
ScrollPane
 类的
VVALUE属性帮助辨识当然显示的图片并显示它的名称。


 

Example 11-3 Using a Scroll Pane to View Images
package scrollpanesample;

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.ScrollPane;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.Priority;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class Main extends Application {

final ScrollPane sp = new ScrollPane();
final Image[] images = new Image[5];
final ImageView[] pics = new ImageView[5];
final VBox vb = new VBox();
final Label fileName = new Label();
final String [] imageNames = new String [] {"fw1.jpg", "fw2.jpg",
"fw3.jpg", "fw4.jpg", "fw5.jpg"};

@Override
public void start(Stage stage) {
VBox box = new VBox();
Scene scene = new Scene(box, 180, 180);
stage.setScene(scene);
stage.setTitle("Scroll Pane");
box.getChildren().addAll(sp, fileName);
VBox.setVgrow(sp, Priority.ALWAYS);

fileName.setLayoutX(30);
fileName.setLayoutY(160);

for (int i = 0; i < 5; i++) {
images[i] = new Image(getClass().getResourceAsStream(imageNames[i]));
pics[i] = new ImageView(images[i]);
pics[i].setFitWidth(100);
pics[i].setPreserveRatio(true);
vb.getChildren().add(pics[i]);
}

sp.setVmax(440);
sp.setPrefSize(115, 150);
sp.setContent(vb);
sp.vvalueProperty().addListener(new ChangeListener<Number>() {
public void changed(ObservableValue<? extends Number> ov,
Number old_val, Number new_val) {
fileName.setText(imageNames[(new_val.intValue() - 1)/100]);
}
});
stage.show();
}

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


 

 Figure 11-5 是编译并运行的效果。

Figure 11-5 Scrolling Images



Description of "Figure 11-5 Scrolling Images" 

垂直滚动条的最大值等于垂直盒子的高度。 Example 11-4 中的代码块显示了当前显示图片的名称。

Example 11-4 Tracking the Change of the Scroll Pane's Vertical Value
sp.vvalueProperty().addListener(new ChangeListener<Number>() {
public void changed(ObservableValue<? extends Number> ov,
Number old_val, Number new_val) {
fileName.setText(imageNames[(new_val.intValue() - 1)/100]);
}
});


ImageView对象限制了图片高度是100点。所以,
 
new_val.intValue() - 1
 除以100的结果给出了当前图片的索引。

可以在应用中改变水平滚动条的最小值和最大值来动态更新用户接口。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息