2012-03-16 48 views

Trả lời

27

Một trong những phương pháp có thể như thế này:

1) Tạo một file CSS với tên "style.css" và xác định một selector id trong đó:

#pane{ 
    -fx-background-image: url("background_image.jpg"); 
    -fx-background-repeat: stretch; 
    -fx-background-size: 900 506; 
    -fx-background-position: center center; 
    -fx-effect: dropshadow(three-pass-box, black, 30, 0.5, 0, 0); 
} 

2) Đặt id của điều khiển hàng đầu nhất (hoặc bất kỳ điều khiển nào) trong cảnh có giá trị được xác định trong CSS và tải tệp CSS này vào cảnh:

public class Test extends Application { 

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

    @Override 
    public void start(Stage primaryStage) { 
     StackPane root = new StackPane(); 
     root.setId("pane"); 
     Scene scene = new Scene(root, 300, 250); 
     scene.getStylesheets().addAll(this.getClass().getResource("style.css").toExternalForm()); 
     primaryStage.setScene(scene); 
     primaryStage.show(); 
    } 
} 

Bạn cũng có thể đưa ra một id để kiểm soát trong một file FXML:

<StackPane id="pane" prefHeight="200" prefWidth="320" xmlns:fx="http://javafx.com/fxml" fx:controller="demo.Sample"> 
    <children> 
    </children> 
</StackPane> 

Đối với thông tin thêm về JavaFX CSS Styling tham khảo guide này.

+0

tôi gửi câu hỏi khác trước đó xin vui lòng giúp liên kết ở đây http://stackoverflow.com/questions/9736393/javafx-2 -no-resizing-ui-control-based-on-window-size – John

+0

Tôi có thể thay đổi nền cảnh từ một chức năng khác, ngoài void bắt đầu – Ossama

+0

@Ossama có bạn có thể. Xác định hai bộ chọn CSS khác nhau (có hai mệnh đề nền khác nhau) và trong một số phương thức thay đổi id của nút bằng id mong muốn. –

10

Bạn có thể thay đổi phong cách trực tiếp cho cảnh sử dụng .root lớp:

.root { 
    -fx-background-image: url("https://www.google.com/images/srpr/logo3w.png"); 
} 

Thêm phần này vào CSS và tải nó như là "Uluk Biy" được mô tả trong câu trả lời của mình.

+0

Rất tiếc! Làm thế nào tôi có thể làm cho hình ảnh lấp đầy toàn bộ khung cảnh? Để lại khoảng trắng ở bên trái và trên cùng. – John

+0

'-fx-background-repeat: stretch; ' –

+0

Nó vẫn còn để lại không gian. Gốc của khung cảnh là một GridPane và tôi đang căn giữa khung lưới trên khung cảnh. Làm cách nào để ngăn hình nền được căn giữa? – John

19

Tôi biết đây là một câu hỏi cũ

Nhưng trong trường hợp bạn muốn làm điều đó theo chương trình hoặc java cách

Đối với nền hình ảnh; bạn có thể sử dụng BackgroundImage lớp

BackgroundImage myBI= new BackgroundImage(new Image("my url",32,32,false,true), 
     BackgroundRepeat.REPEAT, BackgroundRepeat.NO_REPEAT, BackgroundPosition.DEFAULT, 
      BackgroundSize.DEFAULT); 
//then you set to your node 
myContainer.setBackground(new Background(myBI)); 

Để sơn hoặc tô màu nền; bạn có thể sử dụng BackgroundFill lớp

BackgroundFill myBF = new BackgroundFill(Color.BLUEVIOLET, new CornerRadii(1), 
     new Insets(0.0,0.0,0.0,0.0));// or null for the padding 
//then you set to your node or container or layout 
myContainer.setBackground(new Background(myBF)); 

Giữ java của bạn còn sống & & css của bạn chết ..

Các vấn đề liên quan