Dimensione elementi in QML

Question

Sono nuovo in QML. Come ho capito, tutti gli elementi hanno larghezza e altezza associate che ne determinano le dimensioni. Se l'utente cambia la risoluzione dello schermo, l'output finale sembra strano. Esiste un modo in cui la dimensione degli elementi può essere controllata dinamicamente in base alla risoluzione dello schermo?

Answer 1

Invece di utilizzare valori fissi, è possibile moltiplicare height e width dell'elemento radice in base a fattori che determinano la dimensione dei propri elementi proporzionale alla dimensione degli elementi radice. Inoltre è possibile utilizzare QML anchors. Con questo è possibile creare interfacce grafiche completamente scalabili:

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 
     } 
    } 
} 

io non so un modo per ottenere la risoluzione dello schermo con la pura QML che è disponibile a tutti gli ambienti.

Per determinare la risoluzione dello schermo sui dispositivi mobili è possibile utilizzare QML Screen Element.

Nelle applicazioni desktop è possibile ottenere la risoluzione dello schermo in C++ (ad esempio con QDesktopWidget) e renderlo available in QML.