(翻译)第十六回 JavaFX2.0滚动栏ScrollBar

简介: 原文地址http://download.oracle.com/javafx/2.0/ui_controls/scrollbar.htm     ScrollBar 类使你可以创建滚动栏面板和视图。

原文地址http://download.oracle.com/javafx/2.0/ui_controls/scrollbar.htm

 

 

ScrollBar 类使你可以创建滚动栏面板和视图。Figure 10-1 展示了滚动栏的三部分:滚动条(thumb),左右按钮(或上下按钮),可滚动区。

Figure 10-1 Elements of the scroll bar

The track, the thumb, and the left/right buttons
Description of "Figure 10-1 Elements of the scroll bar"

创建Scroll Bar

花点时间看下 Example 10-1 中的代码块。

Example 10-1 Simple Scroll Bar

ScrollBar sc = new ScrollBar();
sc.setMin(0);
sc.setMax(100);
sc.setValue(50);

 setMin 和setMax 方法定义了滚动栏呈现的最小值和最大值。当用户移动滚动条时,它的值会改变。在 Example 10-1 中,它的值是50,所以应用启动后滚动条位于滚动栏的中间。默认滚动栏是水平方向的,你要用setOrientation 方法把它设为垂直方向。

用户可以点击左右按钮(垂直滚动栏是上下按钮)按照增长单位来改变值。UNIT_INCREMENT属性指定了当点击按钮时滚动条调整的幅度。也可以点击滚动区来大幅改变。 BLOCK_INCREMENT属性定义了当点击滚动区时改变的幅度。

在您的应用程序,您可以使用几个滚动条来滚动超出可用空间边界的图形内容。

在应用中使用Scroll Bar

实战体验下。  Example 10-2 中创建的应用实现了一个可滚动的视窗来查看图片。这个应用的目的是让用户能够查看垂直盒子(vertical box)中的内容,它们比视窗好高度要长。

Example 10-2 Scrolling Through Multiple Images

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.geometry.Orientation;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.ScrollBar;
import javafx.scene.effect.DropShadow;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class Main extends Application {
 
    final ScrollBar sc = new ScrollBar();
    final Image[] images = new Image[5];
    final ImageView[] pics = new ImageView[5];
    final VBox vb = new VBox();
    DropShadow shadow = new DropShadow();
 
    @Override
    public void start(Stage stage) {
        Group root = new Group();
        Scene scene = new Scene(root, 180, 180);
        scene.setFill(Color.BLACK);
        stage.setScene(scene);
        stage.setTitle("Scrollbar");
        root.getChildren().addAll(vb, sc);
 
        shadow.setColor(Color.GREY);
        shadow.setOffsetX(2);
        shadow.setOffsetY(2);
 
        vb.setLayoutX(5);
        vb.setSpacing(10);
 
        sc.setLayoutX(scene.getWidth()-sc.getWidth());
        sc.setMin(0);
        sc.setOrientation(Orientation.VERTICAL);
        sc.setPrefHeight(180);
        sc.setMax(360);
 
        for (int i = 0; i < 5; i++) {
            final Image image = images[i] =
                new Image(getClass().getResourceAsStream(
                    "fw" +(i+1)+ ".jpg")
                );
            final ImageView pic = pics[i] =
                new ImageView(images[i]);
            pic.setEffect(shadow);
            vb.getChildren().add(pics[i]);
        }
 
        sc.valueProperty().addListener(new ChangeListener<Number>() {
            public void changed(ObservableValue<? extends Number> ov,
                Number old_val, Number new_val) {
                    vb.setLayoutY(-new_val.doubleValue());
            }
        });
 
        stage.show();
    }
 
    public static void main(String[] args) {
        launch(args);
    }
}

代码的第一行向场景中增加了一个带有图片的垂直盒子和一个滚动栏。

垂直盒子的Y坐标会随着滚动条 VALUE 属性的变化而变化。 所以每次滚动条移动时(或者按钮、滚动区)被点击时,垂直盒子就跟着动。见Example 10-3 .

Example 10-3 Implementing the Scrolling of the Vertical Box

sc.valueProperty().addListener(new ChangeListener<Number>() {
    public void changed(ObservableValue<? extends Number> ov,
        Number old_val, Number new_val) {
            vb.setLayoutY(-new_val.doubleValue());
        }
});

编译并运行应用,效果如Figure 10-2 .

Figure 10-2 Scroll Bar Sample

A scrollbar sample
Description of "Figure 10-2 Scroll Bar Sample "

这个应用是ScrollBar 类的典型应用。你也可以在场景内用定制化的该类创建滚动区域。因为对于每个UI控件和节点(node,有Node这个类的),滚动栏都可以从默认实现中修改外观。

目录
相关文章
|
3月前
QT中 QPlainTextEdit自适应高度的问题(防止出现滚动条)
在QT开发过程中,经常使用到QPlainTextEdit来填入大量的文字,一般我们都会设置QPlainText的固定高度或者默认高度,但是随着文字的增多,就会自动出现滚动条,有时候我们可能需要QPlainText的高度随着自动适应文字的高度(即是说不需要出现滚动条)
76 0
|
4月前
|
C++ UED 索引
C++ Qt开发:StatusBar底部状态栏组件
Qt 是一个跨平台C++图形界面开发库,利用Qt可以快速开发跨平台窗体应用程序,在Qt中我们可以通过拖拽的方式将不同组件放到指定的位置,实现图形化开发极大的方便了开发效率,本章将重点介绍`QStatusBar`底部状态栏组件的常用方法及灵活运用。`QStatusBar` 是 Qt 中用于在主窗口底部显示状态信息的部件。它通常用于向用户提供应用程序的当前状态、进度信息、或者其他与应用程序运行相关的消息。通过在状态栏上显示文本、永久部件、进度条等内容,可以为用户提供清晰的反馈和实时信息。在设计应用程序界面时,使用状态栏有助于提升用户体验。
37 0
C++ Qt开发:StatusBar底部状态栏组件
|
4月前
|
C++ UED
C++ Qt开发:Slider滑块条组件
Qt 是一个跨平台C++图形界面开发库,利用Qt可以快速开发跨平台窗体应用程序,在Qt中我们可以通过拖拽的方式将不同组件放到指定的位置,实现图形化开发极大的方便了开发效率,本章将重点介绍`Slider`滑块条组件的常用方法及灵活运用。当涉及到C++ Qt开发中的`Slider`滑块条组件时,你可能会用到`QSlider`类。`QSlider`是一个用于选择整数值的控件,常用于调整范围内的数值,如音量、亮度等。在水平方向上的`Slider`通常被称为水平滑块(Horizontal Slider),而在垂直方向上的Slider被称为垂直滑块(Vertical Slider)。
35 0
|
XML Android开发 数据格式
Android开发学习之使用Toolbar实现不同的Fragment使用不同颜色的标题栏与状态栏
Android开发学习之使用Toolbar实现不同的Fragment使用不同颜色的标题栏与状态栏                                            先看效果图。
2829 0
|
Android开发 数据格式 XML
Android Material Design:基于CoordinatorLayout实现向上滚动导航条ToolBar滚出、向下滚动导航条滚出
 Android Material Design:基于CoordinatorLayout实现向上滚动导航条ToolBar滚出、向下滚动导航条滚出 要实现的效果: 一个导航条和一个ToolBar,初始状态: 手指在屏幕向上滑动时候的效果,ToolBar滚出: 当手指在屏幕向下滑动时候,ToolBar又滚出: 实现上述效果要使用Android Material Design引入的CoordinatorLayout。
1174 0
|
Android开发
【界面优化】使用viewpagerindicator添加下划线滑动动画
开源代码viewpagerindicator里面没有实现tab下划线切换过程中的移动动画,都是很突兀的多个fragement之间的切换,导致用户体验略差,google了下相关问题,发现一片博文: http://blog.
1047 0
|
Android开发
Android - 保持在底部的按钮栏,上面是滚动的ScrollView
这里要用到相对布局,在ScrollView里放置自己的内容views [html] view plaincopyprint?                                                           看来各种布局,特别是常用的几个还要好好研究一下啊。
625 0