Qt QML Poner elemento por encima de un Cajón

Question 1

Yo estoy luchando con una pregunta muy básica..

El uso de QT 5.15.2:

Tenemos una aplicación muy sencilla con una ventana principal y de 2 a 3 sub-ventana (1 en la planta de abajo de la principal). La ventana principal se compone de un elemento de contenido, un encabezado y algunas menú de solapas distribuidos a través de la ventana principal. Hasta Ahora, el sub-páginas se abrieron con un cajón elemento.

Sin embargo, el cajón de superposiciones de las solapas de encabezado y una vez abierto y tenemos que volver a instancias de las solapas y encabezado dentro de la gaveta para tenerlo visible. Esto no es muy agradable. Es allí cualquier manera de definir el z-nivel en el que se abrirá el cajón? (al parecer la configuración de z no funciona).


Item{
  id: id_mainWindow
  z: 0
  Drawer{
    id: id_subMenu1
    anchors.fill: parent
    z: 1
    
    /* Not so nice workaround */
    Button{
      id: id_subClose
      z: 100
      onClicked{
        id_subMenu1.close()
      }
    }
  }

  /* Unfortunately, this one gets hidden once, the drawer is open */
  Button{
    id: id_subOpenClose
    z: 100
    onClicked{
      if( id_subMenu1.open ){
        id_subMenu1.close()
      } else {
        id_subMenu1.open()
      }
    }
  }

}

Question 2

Yo sugeriría que una Drawer no es el componente adecuado para este trabajo, ya que es técnicamente un Popup. Podría ser digno de la comprobación hacia fuera de la TabBar componente en su lugar.

Sin embargo, he aquí una re-escritura de código, de forma que su Drawer se abre sin cubrir su id_subOpenClose el botón.

import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Material

Rectangle {
    id: id_mainWindow
  
    anchors.fill: parent
  
    Drawer {
        id: id_subMenu1
    
        /*
        Set the Drawer's height and y position so that it does not cover your button
        */
        y: id_subOpenClose.height
        height: id_mainWindow.height - id_subOpenClose.height
        width: id_mainWindow.width

        // Do not dim background
        dim: false
        
        // Set this to zero if you want no shadow
        Material.elevation: 2
    
        edge: Qt.RightEdge
    
        Label {
            text: 'Hello World'
            anchors.centerIn: parent
        }
    }

    /* 
    This is your header button that was getting hidden
    Here it stays as if it were part of a global header and does not get hidden by
    the Drawer.
    */
    Button{
        id: id_subOpenClose
        text: id_subMenu1.visible? 'close': 'open'
        onClicked: id_subMenu1.visible? id_subMenu1.close(): id_subMenu1.open()
    }
}

Para que un sistema interactivo de WASM ejemplo de los de arriba ver aquí.

haikü · Answer 1 · 2021-12-01T15:56:39

Yo sugeriría que una Drawer no es el componente adecuado para este trabajo, ya que es técnicamente un Popup. Podría ser digno de la comprobación hacia fuera de la TabBar componente en su lugar.

Sin embargo, he aquí una re-escritura de código, de forma que su Drawer se abre sin cubrir su id_subOpenClose el botón.

import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Material

Rectangle {
    id: id_mainWindow
  
    anchors.fill: parent
  
    Drawer {
        id: id_subMenu1
    
        /*
        Set the Drawer's height and y position so that it does not cover your button
        */
        y: id_subOpenClose.height
        height: id_mainWindow.height - id_subOpenClose.height
        width: id_mainWindow.width

        // Do not dim background
        dim: false
        
        // Set this to zero if you want no shadow
        Material.elevation: 2
    
        edge: Qt.RightEdge
    
        Label {
            text: 'Hello World'
            anchors.centerIn: parent
        }
    }

    /* 
    This is your header button that was getting hidden
    Here it stays as if it were part of a global header and does not get hidden by
    the Drawer.
    */
    Button{
        id: id_subOpenClose
        text: id_subMenu1.visible? 'close': 'open'
        onClicked: id_subMenu1.visible? id_subMenu1.close(): id_subMenu1.open()
    }
}

Para que un sistema interactivo de WASM ejemplo de los de arriba ver aquí.

Qt QML Poner elemento por encima de un Cajón

Pregunta

Mejor respuesta

En otros idiomas

Esta página está en otros idiomas

Popular en esta categoría

Las preguntas más habituales en esta categoría