Làm việc với các tệp .ui.qml

Question

Trong Qt 5.4, mẫu khi tạo "Tệp giao diện người dùng QtQuick" mới tạo hai tệp: MyScreen.qml và MyScreen.ui.qml.

Tệp MyScreen.ui.qml dường như chỉ dành cho giao diện người dùng, vì Qt Creator cho biết bạn chỉ nên chỉnh sửa tệp đó ở chế độ thiết kế. Điều đó ngụ ý rằng tôi nên tạo các đối tượng giao diện người dùng (nhãn, nút, v.v ...) ở đó và bằng cách nào đó đề cập đến chúng trong tệp MyScreen.qml nơi logic sẽ đi. Về nguyên tắc điều này nghe có vẻ tuyệt vời nhưng, thật không may Qt không đi kèm với bất kỳ ví dụ về cách làm việc với 2 tệp này.

Dưới đây là nội dung của các tập tin:

MyScreen.qml:

import QtQuick 2.4 

MyScreen { 
} 

MyScreen.ui.qml (tôi đã thêm nhãn văn bản trong chế độ thiết kế):

import QtQuick 2.4 

Item { 
    width: 400 
    height: 400 

    Text { 
     id: text1 
     x: 144 
     y: 151 
     width: 103 
     height: 31 
     text: qsTr("Text") 
     font.pixelSize: 12 
    } 
} 

tôi đã cố gắng instantiating một MyScreen cho sử dụng trong một StackView (xem bên dưới), nhưng (không ngạc nhiên) Tôi không thấy nhãn.

main.qml:

import QtQuick 2.4 
import QtQuick.Controls 1.3 
import QtQuick.Window 2.2 

Window { 
    visible: true 
    StackView { 
     id: stack 
     anchors.fill: parent 
     initialItem: myscreen 
    } 

    MyScreen { 
     id: myscreen 
     anchors.fill: parent 
    } 
} 

Bất kỳ con trỏ cho một newbie QML?

Answer 1

Khi tạo tệp giao diện người dùng QtQuick trong QtCreator, bạn nên đặt tên "Tên thành phần" và "Tên biểu mẫu thành phần" khác nhau.

MyScreen.qml tạo một component MyScreen, tuy nhiên trong việc thực hiện:

MyScreen { /* ... */} 

MyScreen tạo ra bản thân một cách đệ quy.

Trong trường hợp này, MyScreen.ui.qml tạo thành phần MyScreen trong dự án. Đồng thời, mã trong MyScreen.qml, được tạo tự động bởi QtCreator, sử dụng thành phần MyScreen được tạo bởi MyScreen.ui.qml. Thật không may, MyScreen cũng là tên của MyScreen.qml và làm cho nó tạo ra chính nó đệ quy khi chạy.

Sử dụng các tên khác nhau có thể giải quyết được sự cố. Ví dụ, đổi tên MyScreen.ui.qml thành MyScreenForm.ui.qml.