Learn what Felgo offers to help your business succeed. Start your free evaluation today! Felgo for Your Business

Density Independence Examples

 import Felgo 4.0
 import QtQuick 2.0

 GameWindow {
   id: gameWindow
   // the default Window size at app start on Desktop
   // change it to your preferred start size during development
   // on mobile devices, the app is shown fullscreen
   screenWidth: 960
   screenHeight: 640

   activeScene: scene

   Scene {
     id: scene
     // the default logical size is 480x320
     // use 320x480 for portrait apps & games

     Loader {
       id: sideBarLoader
       // only show in landscape mode
       active: gameWindow.landscape
       sourceComponent: sideBarComponent

       // hide the loader if not in landscape
       width: gameWindow.landscape ? scene.dp(120) : 0
       // fill the whole screen height
       anchors.top: scene.gameWindowAnchorItem.top
       height: scene.gameWindowAnchorItem.height
       anchors.left: scene.gameWindowAnchorItem.left
     }// SideBarLoader

     Component {
       id: sideBarComponent
       Rectangle {
         color: "blue"
         // ... content of SideBar here ...
       }
     }// SideBarComponent

     ListView {
       anchors.left: sideBarLoader.right
       anchors.right: scene.gameWindowAnchorItem.right
       height: scene.gameWindowAnchorItem.height
       delegate: listViewDelegate
       spacing: scene.dp(2)
       model: [ "", "", "", ] // some test data to display the rows
     }// ContentListView

     Component {
       id: listViewDelegate

       Rectangle {
         // make a row bigger if the device is a tablet
         height: gameWindow.tablet ? scene.dp(80) : scene.dp(48)
         width: parent.width

         color: "grey"
         // ... content of ListView row here ...
       }

     }// ListViewDelegate
Qt_Technology_Partner_RGB_475 Qt_Service_Partner_RGB_475_padded