Solved custom sliding menu or navigation drawer
-
Dear Friend ,
I am newer in to Qt Qml , I want to make a custom drawer like this picture , But I don't have any Idea about making this kind of custom drawer
thanks for you help. -
Look into the cinematic demo http://quitcoding.com/?page=work#cinex
Basically you'll need to use a Path and lay out your menu items along that path.
-
@sierdzio
Thanks for your help ,
Don't you have any sample code ? -
@saeidparand said in custom sliding menu or navigation drawer:
@sierdzio
Thanks for your help ,
Don't you have any sample code ?No, I don't. Check the example I've sent you in my last message.
-
we can use this kind of code for making Drawer and listview
import QtQuick 2.7
import QtQuick.Controls 2.2
import Qt.labs.calendar 1.0
ApplicationWindow {
id:root
visible: true
width: 640
height: 480
// property alias mousearea: mousearea
title: qsTr("Hello World")Drawer { id: drawer width: parent.width/3 height: root.height edge: Qt.LeftArrow dragMargin: 20 dim: false modal: false //opacity: 0.5 PathView { id:path width: drawer.width//400 height:drawer.height//400 anchors.centerIn: parent model: ListModel { ListElement { name: "element1" }//; myimage:"images/1.png"} ListElement { name: "element2" } ListElement { name: "element3" } ListElement { name: "element4" } ListElement { name: "element5" } ListElement { name: "element6" } ListElement { name: "element7" } ListElement { name: "element8" } } delegate: Rectangle { id:delrect width: 40 height: 40 radius: 20 color: "blue" Text { text: name anchors.centerIn: parent transform: [ Translate {y:-30} ] } } path: Path { id:path2 startX: 200 startY: 0 //PathArc { x: 200; y: 400; radiusX: 200; radiusY: 200; useLargeArc: true } PathArc { x: 200; y: 400; radiusX: 200; radiusY: 200; useLargeArc: true } PathArc { x: 200; y: 0; radiusX: 200; radiusY: 200; useLargeArc: true } } } }
}
-
But , Unfortunately It is not responsive , how can I fix it?
-
@saeidparand said in custom sliding menu or navigation drawer:
But , Unfortunately It is not responsive , how can I fix it?
What kind of responsiveness do you expect? If the elements should be clickable, then you need to add a mouse area in the delegate, and handle the clicks there.
-
@sierdzio
this listview is in the Drawer ,but when I resize the window this listview doesn't resize ,
how can I fix it? -
Code seems OK. Maybe try using Layout or
anchors.fill: parent
instead of binding to height and width?