Sự khác biệt giữa chiều rộng, chiều cao và tiềm ẩnWidth/Chiều cao và các trường hợp sử dụng tương ứng trong QML

Question

Sự khác nhau giữa width/height và implicitWidth/Height trong QML là gì? Khi nào thì nên đặt kích thước ngầm thay vì thông thường? Khi nào người ta nên hỏi các kích thước ngầm thay vì thường xuyên từ một thành phần/mục?

Answer 1

Thông thường, việc sử dụng implicitHeight/Width chỉ có ý nghĩa trong các thành phần có thể tái sử dụng.

Nó đưa ra gợi ý, về kích thước tự nhiên của Mặt hàng mà không thực thi kích thước này.

Hãy lấy ví dụ Image. Kích thước tự nhiên của hình ảnh sẽ ánh xạ một pixel từ tệp hình ảnh đến một pixel trên màn hình. Nhưng nó cho phép chúng tôi kéo dài nó, vì vậy kích thước không được thực thi và có thể bị ghi đè.

Giả sử bây giờ, chúng tôi muốn có một thư viện với hình ảnh có kích thước không xác định và chúng tôi không muốn phát triển mà chỉ thu nhỏ chúng nếu cần. Vì vậy, chúng ta cần lưu trữ kích thước tự nhiên của hình ảnh. Đó là, nơi chiều cao ngầm xuất hiện.

Image { 
    width: Math.max(150, implicitWidth) 
    height: Math.max(150, implicitHeight) 
} 

Trong các thành phần tùy chỉnh, bạn có thể chọn cách xác định kích thước.

Một lựa chọn là, để có tất cả các kích thước tương ứng với các thành phần root -node, có lẽ như thế này:

Item { 
    id: root 
    Rectangle { 
     width: root.width * 0.2 
     height: root.height * 0.2 
     color: 'red' 
    } 
    Rectangle { 
     x: 0.2 * root.width 
     y: 0.2 * root.height 
     width: root.width * 0.8 
     height: root.height * 0.8 
     color: 'green' 
    } 
} 

Trong trường hợp này, không có kích thước tự nhiên của đối tượng. Tất cả mọi thứ hoạt động hoàn hảo cho mỗi kích thước bạn thiết lập cho các thành phần.

Mặt khác, bạn có thể có một đối tượng có kích thước tự nhiên - điều đó xảy ra, ví dụ: nếu bạn có giá trị tuyệt đối trong đó

Item { 
    id: root 
    property alias model: repeater.model 
    Repeater { 
     id: repeater 
     delegate: Rectangle { 
      width: 100 
      height: 100 
      x: 102 * index 
      y: 102 * index 
     } 
    } 
} 

Trong ví dụ này, bạn nên cung cấp cho người dùng thông tin về kích thước tự nhiên, nơi mà nội dung không protude mục. Người dùng vẫn có thể quyết định đặt kích thước nhỏ hơn và xử lý việc nhô ra, ví dụ: bằng cách cắt nó, nhưng anh ta cần thông tin về kích thước tự nhiên để đưa ra quyết định của mình.

Trong nhiều trường hợp, childrenRect.height/width là biện pháp tốt cho implcitHeight/Width, nhưng có những ví dụ, đây không phải là ý tưởng hay. - ví dụ. khi nội dung của mục có số x: -500.

Ví dụ thực tế là Flickable được thiết kế đặc biệt để chứa các đối tượng lớn hơn kích thước của chính nó. Có kích thước của Flickable bằng với nội dung sẽ không tự nhiên.

Cũng nên cẩn thận, khi sử dụng scale trong các thành phần tùy chỉnh, vì childRect sẽ không biết về tỷ lệ.

Item { 
    id: root 
    implicitWidth: child.width * child.scale 
    implicitHeight: child.height * child.scale 
    Rectangle { 
     id: child 
     width: 100 
     height: 100 
     scale: 3 
     color: 'red' 
    } 
} 

---

Và để bình luận của bạn: Tôi chỉ không hiểu tại sao nó là tốt hơn để thiết lập implicitWidth/Chiều cao thay vì thiết lập chiều rộng/chiều cao của không gian gốc của một thành phần.

implicitWidht/Height không cần thiết - QtQuick có thể làm mà không có chúng. Chúng tồn tại để thuận tiện và sẽ là quy ước.

---

Quy tắc

Khi bạn muốn thiết lập kích thước của một nút gốc của một thành phần tái sử dụng, thiết lập implicitWidth/Height.
Trong một số trường hợp, đặt nó cho các nút không phải là gốc, nếu các nút được hiển thị dưới dạng thuộc tính.
Chỉ làm như vậy, nếu bạn có lý do cho nó (nhiều thành phần chính thức không có).
Khi bạn sử dụng một thành phần, hãy đặt width/height.

Answer 2

Tôi không có câu trả lời dứt khoát nhưng tôi có thể cho bạn biết những gì tôi đã phát hiện ra. Thứ nhất, from the documentation:

implicitWidth: real

Xác định chiều rộng tự nhiên hoặc chiều cao của hàng nếu không có chiều rộng hoặc chiều cao được chỉ định.

Giá trị mặc định kích thước tiềm ẩn đối với hầu hết các mặt hàng là 0x0, tuy nhiên một số mặt hàng đều có quy mô tiềm ẩn vốn có mà không thể được ghi đè, cho dụ, Image và Text.

nhưng less informative for width:

rộng

Định nghĩa vị trí và kích thước của mặt hàng đó.

width và height phản ánh kích thước thực của mục trong cảnh. Kích thước ngầm định là một loại tài sản vốn có của chính nó.

Tôi sử dụng chúng như sau: Khi tôi tạo một mục mới và nó có thể được thay đổi kích cỡ, tôi thiết lập một kích thước ngầm bên đối tượng . Khi tôi đang sử dụng đối tượng, tôi thường đặt kích thước thực một cách rõ ràng từ bên ngoài.

Kích thước ẩn của đối tượng có thể bị ghi đè bằng cách đặt chiều cao và chiều rộng.

một ví dụ: TextWithBackground.qml

Item { 
    implicitWidth: text.implicitWidth 
    implicitHeight: text.implicitHeight 
    // the rectangle will expand to the real size of the item 
    Rectangle { anchors.fill: parent; color: "yellow" } 
    Text { id: text; text: "Lorem ipsum dolor..." } 
} 

một ví dụ: MyWindow.qml

Item { 
    width: 400 
    height: 300 
    TextWithBackground { 
     // half of the scene, but never smaller than its implicitWidth 
     width: Math.max(parent.width/2, implicitWidth) 
     // the height of the element is equal to implicitHeight 
     // because height is not explicitly set 
    } 
} 

---

_{1) Đối với một số yếu tố, như văn bản, chiều cao ngầm phụ thuộc vào (chiều rộng không ngầm).
2) Kích thước ngầm thường phụ thuộc vào kích thước ngầm của con cái.}