How can I create slider and show buttons inside it
-
Just the slider part
This is the thing that I want to implementI would be happy to get the answer using QWidgets only
NOT QMLI dont know if the
QSlider
base class is the correct approach in your case. TheQSlider
has ticks to set a value in a certain range.
If you just want to slide something to the right or left (like accepting a call on your smartphone or managing your emails), you should create your own custom widget. -
Hi
The picture is too low-quality for me to see what it is you want to create.
Also why would there be multiple buttons in it ??You mean like a slide out menu ?
-
Hi
The picture is too low-quality for me to see what it is you want to create.
Also why would there be multiple buttons in it ??You mean like a slide out menu ?
-
The "item" should "hide" your button and when you swipe to the left or right, the button appears, correct? (Kind of "snap" - behavior)
Definitely possible but might be a little tricky to make it work properly. -
The "item" should "hide" your button and when you swipe to the left or right, the button appears, correct? (Kind of "snap" - behavior)
Definitely possible but might be a little tricky to make it work properly. -
@Thank-You take a look at this example:
https://doc.qt.io/qt-5/qtwidgets-draganddrop-draggableicons-example.html
that should get you started in creating a left&right dragable widget.
Than its only a matter of creating a custom container/layout for those widgets , so that they are listed one above the other and automatically snap back (or not) when you release the drag
-
@Thank-You take a look at this example:
https://doc.qt.io/qt-5/qtwidgets-draganddrop-draggableicons-example.html
that should get you started in creating a left&right dragable widget.
Than its only a matter of creating a custom container/layout for those widgets , so that they are listed one above the other and automatically snap back (or not) when you release the drag
@J-Hilk
So what is such a widget called in android terms?
if a common design elements, it must have a name ?
(still not sure how it works. sounds like slide to open menu. :) -
@J-Hilk
So what is such a widget called in android terms?
if a common design elements, it must have a name ?
(still not sure how it works. sounds like slide to open menu. :)@mrjj Swipe Options ? 🤷♂️
edit:
Apparently it's called adismissible
https://api.flutter.dev/flutter/widgets/Dismissible-class.html
-
@mrjj Swipe Options ? 🤷♂️
edit:
Apparently it's called adismissible
https://api.flutter.dev/flutter/widgets/Dismissible-class.html
@J-Hilk
Thank you.
So the main Info covers some part of the area.
Then you can swipe to say the left to reveal extra options/actions "below it" ?How come that in pic 2, there blue is only one left. the grey is gone.
Or is that when it sin initial state ? -
@J-Hilk
Thank you.
So the main Info covers some part of the area.
Then you can swipe to say the left to reveal extra options/actions "below it" ?How come that in pic 2, there blue is only one left. the grey is gone.
Or is that when it sin initial state ?@mrjj said in How can I create slider and show buttons inside it:
How come that in pic 2, there blue is only one left. the grey is gone.
it indicates that swiping to the left gives you 3 options and swiping to the right only 1, or in this case toggles E-Mail read state
-
@J-Hilk
Thank you.
So the main Info covers some part of the area.
Then you can swipe to say the left to reveal extra options/actions "below it" ?How come that in pic 2, there blue is only one left. the grey is gone.
Or is that when it sin initial state ?@mrjj said in How can I create slider and show buttons inside it:
How come that in pic 2, there blue is only one left. the grey is gone.
There can be couple of options. Basically the top widget / item could hide stuff on the right and on the left. So if you swipe the "cover" item to the right, you'll see the controls on the left (the blue thing). If you swipe left, you'll see multiple flags, buttons or options from which you can choose (gray, blue, gray).
Same for @Thank-You second image on the right.
Three icons for three actions which will show up, when you swipe the mail or phone book entry to the left. -
Aha and you can even also swipe up and down. it seems.
Ok cool little widget. -
@mrjj said in How can I create slider and show buttons inside it:
swipe up and down
Up / down is just a regular scroll then.
I think the main reason for this is to provide direct access to additional actions / features without navigating through dozens of menus. So you have your actions right below each item or list entry.
Sometimes you don't even have to lift your finger to select something. -
@mrjj said in How can I create slider and show buttons inside it:
swipe up and down
Up / down is just a regular scroll then.
I think the main reason for this is to provide direct access to additional actions / features without navigating through dozens of menus. So you have your actions right below each item or list entry.
Sometimes you don't even have to lift your finger to select something.@Pl45m4
well actually in FLUTTER it has a direction property so you can swipe it up and down if you wish. At least the video says that at 0:44 :)I tried to find one on my phone but they only swipe one way.
So when it has say multiple buttons "under" then you hold the swipe and then press a button or how does this work ?
-
@Pl45m4
well actually in FLUTTER it has a direction property so you can swipe it up and down if you wish. At least the video says that at 0:44 :)I tried to find one on my phone but they only swipe one way.
So when it has say multiple buttons "under" then you hold the swipe and then press a button or how does this work ?
@mrjj said in How can I create slider and show buttons inside it:
So when it has say multiple buttons "under" then you hold the swipe and then press a button or how does this work ?
Depends on the application. One possible way is that the most left/right visible option next to the swiped central "item" gets selected.
The more you swipe in one direction the more you expose the options below and the one which becomes visible last, is your selection. Then just release the swipe. Most of the time the selected button or option provides some visual feedback (like highlight, blink or frame changes).
The MS Outlook Mail App is a good example (OWA on mobile devices as well, I guess)@J-Hilk said in How can I create slider and show buttons inside it:
Apparently it's called a dismissible
I think only in this specific case shown there (https://api.flutter.dev/flutter/widgets/Dismissible-class.html), because the items disappear. Some call it "Swipe Settings", some "Swipe Actions" and some "Swipe Options" :)
But I'm actually surprised that no one made a similar widget like this before and uploaded it to GitHub -
@mrjj said in How can I create slider and show buttons inside it:
So when it has say multiple buttons "under" then you hold the swipe and then press a button or how does this work ?
Depends on the application. One possible way is that the most left/right visible option next to the swiped central "item" gets selected.
The more you swipe in one direction the more you expose the options below and the one which becomes visible last, is your selection. Then just release the swipe. Most of the time the selected button or option provides some visual feedback (like highlight, blink or frame changes).
The MS Outlook Mail App is a good example (OWA on mobile devices as well, I guess)@J-Hilk said in How can I create slider and show buttons inside it:
Apparently it's called a dismissible
I think only in this specific case shown there (https://api.flutter.dev/flutter/widgets/Dismissible-class.html), because the items disappear. Some call it "Swipe Settings", some "Swipe Actions" and some "Swipe Options" :)
But I'm actually surprised that no one made a similar widget like this before and uploaded it to GitHub@Pl45m4
I found demo video on this thing
Wait I will post hereBoth of these video will direct exactly to the demo
https://youtu.be/Cam2AvfJilY?t=2364
https://youtu.be/hnuMyuCWwwU?t=5It is actually demo for android device
But it doesn't matterITS called
"recyclerview" in androidExactly similar to the video but
Those buttons should be below that layer (I guess that would be good)I hope you understands
-
@Pl45m4
I found demo video on this thing
Wait I will post hereBoth of these video will direct exactly to the demo
https://youtu.be/Cam2AvfJilY?t=2364
https://youtu.be/hnuMyuCWwwU?t=5It is actually demo for android device
But it doesn't matterITS called
"recyclerview" in androidExactly similar to the video but
Those buttons should be below that layer (I guess that would be good)I hope you understands
@Thank-You
I know its QML and not QWidgets, but I promised @mrjj an example he could work/play with :D and its simply much easier to implement in QMLhttps://github.com/DeiVadder/QmlSwipeOptions
The principles and functionalities are the same in QWidgets, so it may be a good starting point for you as well