Bắt đầu với Công nghệ JavaFX Sử dụng Eclipse IDE (Phần 2)

Trong phần 1 chúng ta đã đi qua các bước tạo một dự án JavaFX và các giải thích về ví dụ cho dự án FirstJavaFXApp, về Main.fx, insert Stage và Scene.

Phần tiếp theo này tôi sẽ tiếp tục phân tích cấu trúc như thế nào.

Sửa đổi các đối tượng Scene để xác định các văn bản mà bạn muốn xuất hiện trong các ứng dụng. Bạn cũng cần phải thêm tuyên bố nhập khẩu đối với các lớp TextAlignment

• Thêm các báo cáo, nhập khẩu sau đây ở đầu tập tin, ngay bên dưới nơi mà các câu import đầu tiên đã được xác định.

import javafx.scene.text.*;

• Sửa đổi các biến content như trong ví dụ mã sau đây. Bạn có thể sao chép những dòng in đậm và dán chúng vào trong trình biên tập để thay thế cho khối content mã hiện tại.

Stage {
     title: "First JavaFX App"
     scene: Scene {
         width: 250
         height: 250
         content: [
             Text {
                font: Font { size: 22 }
                x: 20, y: 90
               textAlignment: TextAlignment.CENTER
               content:"Welcome to \nJavaFX  World"
             }  //Text
         ] // content
     } // Scene 
} // Stage

Xác định các đối tượng Circle cơ bản mà từ đó bạn tạo các mặt cầu bằng cách mở rộng phần Basic Shapes trong xem đoạn và kéo đoạn mã Circle ở dòng phía trên khối mã Text như thể hiện trong hình dưới đây.

• Trong hộp thoại Insert Tiêu bản cho Circle sửa đổi biến radius của hình tròn có giá trị 90 và nhấn Insert.

Circle đoạn mã được bổ sung vào nguồn Main.fx , cùng với những điều khoản về nhập khẩu cần thiết cho việc Circle và Color.

• Đặt con trỏ chuột trên Circle từ để cho phép các lớp Circle API sẽ được hiển thị trong một cửa sổ bật lên, như thể hiện trong hình dưới đây.

Bạn có thể nhấp vào bên trong cửa sổ bật lên để xem tài liệu API cho toàn bộ lớp. Click anywhere in the source editor to dismiss the API pop-up window. Click vào bất cứ nơi nào trong trình biên tập mã nguồn để sa thải API cửa sổ bật lên.

Thêm một RadialGradient mới cài đặt vào vòng tròn. Điều này tạo ra độ sâu vòng tròn và làm cho nó trông giống như hình cầu.

• Ở phía trên của các tập tin Main.fx thêm những điều khoản về nhập khẩu bao gồm các gói chứa RadialGradient và Stop các lớp học được sử dụng trong các mã mà bạn đang thêm. Bắt đầu bằng cách gõ dòng mã sau đây.

import javafx.scene.paint.

Ở cuối dòng, bạn chỉ cần gõ, nhấn Ctrl + phím dài để xem cửa sổ pop-up hoàn thành mã cửa sổ, như thể hiện trong hình dưới đây. Chọn RadialGradient từ danh sách và nhấn Enter.

Lặp lại các bước trước để thêm những điều khoản về nhập khẩu đối với các lớp Stop cũng là cần thiết để xác định các gradient xuyên tâm của hình cầu. Sau đây là những điều khoản về nhập khẩu mà cần phải có được thêm vào.

import javafx.scene.paint.RadialGradient;
import javafx.scene.paint.Stop;

Thay thế fill biến trong các nguồn Main.fx tập tin với mã nguồn sau đây in đậm. Bạn có thể sao chép những dòng in đậm, trong đó có đóng dấu ngoặc vuông và niềng răng cho các biến fill và dán chúng vào trình soạn thảo mã nguồn.

Stage {

    title: "First JavaFX App"

    scene: Scene {

        width: 250

        height: 250

        content: [

            Circle {

                centerX: 100,

                centerY: 100,

                radius: 90,

                fill: RadialGradient {

                     centerX: 75,

                     centerY: 75,

                     radius: 90

                     proportional: false

                     stops: [

                           Stop {

                                offset: 0.0

                                color: Color.web("#3B8DED")

                           },

                           Stop {

                                offset: 1.0

                                color: Color.web("#044EA4")

                           }

                    ] // stops

               } // RadialGradient

           } // Circle

           Text {

                font: Font { size: 22 }

                x: 20, y: 90

                textAlignment: TextAlignment.CENTER

                content:"Welcome to \nJavaFX World"

           } //Text

       ] // content

    } // Scene

} // Stage

Lưu mã nguồn (Ctrl + S trên Windows và Cmd + S trên Mac) và điều hành dự án để xem một bản xem trước của những gì bạn đã làm được cho đến nay.

Nhấp chuột phải vào FirstJavaFXApp > src > gstutorial> Main.fx nút trong gói Explorer và chọn Run As> JavaFX Application.

Trong hộp thoại Edit Configuration, thông báo rằng trong Profile - Mục tiêu trường được cấu hình chạy mặc định được sử dụng là máy tính để bàn, như trong hình 12. Để cấu hình máy tính để bàn-Khởi như ứng dụng như là hồ sơ chạy mục tiêu.

Bạn cũng có tùy chọn để điều hành dự án JavaFX như một applet, như là một ứng dụng Java Web Start, hoặc là một ứng dụng di động bằng cách chọn Profile thích hợp - Mục tiêu lựa chọn từ danh sách thả xuống.

Chọn Run.

Một cửa sổ mới hiển thị các lĩnh vực mà bạn vừa tạo ra, như được hiển thị trong hình dưới đây.

Thoát ra đầu JavaFX App cửa sổ và tiếp tục với phần còn lại của hướng dẫn.

Chúng ta đã hoàn thành một ví dụ với JavaFX. Chúng các bạn thành công.

DangTrung.