JavaFX UI控件教程(十)之Scroll Bar
翻譯自? ?Scroll Bar
本章介紹如何使用滾動條控件創建可滾動窗格。
本ScrollBar類可以在應用程序中創建滾動窗格和意見。圖9-1顯示了滾動條的三個區域:拇指,右側和左側按鈕(或向下和向上按鈕)以及軌道。
圖9-1滾動條的元素
?
創建滾動條
花點時間查看例9-1中的代碼片段。
例9-1簡單滾動條
ScrollBar sc = new ScrollBar(); sc.setMin(0); sc.setMax(100); sc.setValue(50);的setMin和setMax方法定義由滾動條表示的最小值和最大值。當用戶移動拇指時,滾動條的值會改變。在示例9-1中,值等于50,因此當應用程序啟動時,拇指位于滾動條的中心。默認情況下,滾動條水平定向。但是,您可以使用該setOrientation方法設置垂直方向。
用戶可以單擊左或右按鈕(垂直方向的向下或向上按鈕)以單位增量滾動。該UNIT_INCREMENT屬性指定單擊按鈕時滾動條的調整量。另一個選項是通過塊增量在軌道內單擊。該BLOCK_INCREMENT屬性定義單擊條形軌跡時滾動條的調整量。
在您的應用程序中,您可以使用多個滾動條之一滾動超出可用空間邊界的圖形內容。
?
在應用程序中使用滾動條
檢查滾動條的運行情況。示例9-2中顯示的應用程序實現了可滾動場景以查看圖像。此應用程序的任務是使用戶能夠查看垂直框的內容,該內容比場景的高度更長。
例9-2滾動多個圖像
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();@Overridepublic 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滾動條的屬性發生變化時,垂直框的坐標會發生變化,因此每次移動滑塊或單擊按鈕或軌道時,垂直框都會移動,如例9-3所示。
示例9-3實現垂直框的滾動
sc.valueProperty().addListener(new ChangeListener<Number>() {public void changed(ObservableValue<? extends Number> ov,Number old_val, Number new_val) {vb.setLayoutY(-new_val.doubleValue());} });編譯并運行此應用程序將生成如圖9-2所示的輸出。
圖9-2滾動條示例
該應用程序顯示了ScrollBar該類的一個典型用法。您還可以自定義此類以在場景中創建滾動區域。對于每個UI控件和每個節點,可以設置滾動條的樣式以從默認實現更改其外觀。
?
相關的API文檔 ?
-
ScrollBar
-
JavaFX CSS規范
總結
以上是生活随笔為你收集整理的JavaFX UI控件教程(十)之Scroll Bar的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 微信消息提醒震动为何关不了
- 下一篇: JavaFX UI控件教程(十一)之Sc