Rozmiar elementów w QML

Question

Jestem nowy w QML. Jak rozumiem, wszystkie elementy mają powiązaną szerokość i wysokość, które określają ich rozmiar. Jeśli użytkownik zmieni rozdzielczość ekranu, ostateczny wynik wygląda dziwnie. Czy istnieje sposób, w jaki rozmiar elementów może być kontrolowany dynamicznie na podstawie rozdzielczości ekranu?

Answer 1

Zamiast używać stałych wartości, można pomnożyć height i width elementu głównego przez czynniki, które określają wielkość elementów proporcjonalną do rozmiaru elementów głównych. Dodatkowo możesz użyć QML anchors. Dzięki temu można tworzyć całkowicie skalowalne GUI:

import QtQuick 1.0 

Item { 
    id: root 

    // default size, but scalable by user 
    height: 300; width: 400 

    Rectangle { 
     id: leftPanel 

     anchors { 
      top: parent.top 
      left: parent.left 
      bottom: parent.bottom 
     } 
     width: root.width * 0.3 
     color: "blue" 
    } 

    Rectangle { 
     id: topPanel 

     anchors { 
      top: parent.top 
      left: leftPanel.right 
      right: parent.right 
     } 
     height: root.height * 0.2 
     color: "green" 
    } 


    Rectangle { 
     id: contentArea 

     anchors { 
      top: topPanel.bottom 
      left: leftPanel.right 
      right: parent.right 
      bottom: root.bottom 
     } 
     color: "white" 

     Text { 
      text: "Hi, I'm scalable!" 
      anchors.centerIn: parent 
      font.pixelSize: root.width * 0.05 
     } 
    } 
} 

nie wiem sposób, aby uzyskać rozdzielczość ekranu z czystej QML, który jest dostępny we wszystkich środowiskach.

Aby określić rozdzielczość ekranu na urządzeniach mobilnych, można użyć QML Screen Element.

W aplikacjach komputerowych można uzyskać rozdzielczość ekranu w C++ (np. Z QDesktopWidget) i ustawić ją jako available in QML.