Hi all, we’re introducing new Frames that help you create new layout patterns in your Retool applications. First up, a Drawer Frame that adds a slide-out container to the right side of your app. You can use a Drawer to display forms, drill down into your data, filter your data, or more! This feature is rolling out this week and if you’re on cloud, you should have access to it in the next few days.
You can create Drawers by going to the component tree and clicking the + button next to Frames.
You'll notice that the addition of Drawers also comes with a new canvas editing experience! All your frames are now combined in the editor, and the canvas looks more like it does in Preview or Viewer mode. We hope this helps you get a better sense of what your app's layout will look like to your users.
Feel free to add feedback or feature requests to both Drawers or the new editing experience to this thread!
Wow, GREAT! Thank you for the update @AnnaW!
When will the the whatsnew page be updated?
Hi @AnnaW this looks great, do you know when it will be included in the self hosted version? I know v3.8 is coming next week with the new UI editor, any chance it'll be in that?
Hi @Milo , Drawers will be available in the next self hosted version after 3.8, which will be 3.10.
Edit: Drawers were delayed in being ungated and are now available in version 3.12.
Very nice ! Especially as you can have different drawers e.g. triggered from different cells.
Off the bat as I wanted to move or copy an existing table component from the Main frame, I found out that:
- drag n' dropping a component between frames (or sections thereof) is not supported
- copy/pasting from
Body does not work intuitively
Re 2, the trick is to add first a dummy component e.g. Text, then you can
paste below the component copied from another frame (and remove the dummy one).
Ideally though, a section (Body, Footer) should have a context menu that enables pasting into it directly.
Ah that's a shame but thanks for the info, we're operating on a quarterly update schedule and our next one will be 3.8 so will miss out on Drawers for a while.
@PatrickMast We update the Retool Changelog on Fridays, and you should see announcements of new features on the Changelog once they're fully rolled out. Since we're ramping up drawers over the next few days, the page should be updated next week!
@yiga2, thanks for trying this out and the feedback! You should be able to drag components between the main canvas and a drawer if you turn off the "Show overlay" property under Appearance.
Also, you should be able to "Select" the Drawer frame and paste a Table directly into the body with Cmd+V -- without adding a dummy component. We'll work on adding the same options to the context menu!
That works indeed, thanks ! Current featured drawer is useful to show vertical context. For usually wider components e.g. Table, I would love to see a drawer sliding from the bottom !
It could be an option (bottom/right) with a width/height parameter.
Pushing it further, both width and height could be configurable, as well as the margins (pt or %)...
Thank you @AnnaW!
I don't see the drawer yet. Do I need to set it somewhere?
no,you should let team add your account to the beta testing list.
Thanks @AnsonHwang. We have it in our account now! Works GREAT!
This sounds like a super feature. Really happy to see this and try it out.
There is not
rename in the context menu of right click of drawer component.
Nice addition. I was hoping for that UI element. Already in use ;). Looks like it was inspired and used by IDEv3. I propose we should be able to choose the direction: left, right, up, down.
Thanks all! I've shared this feedback for drawer improvements internally
Hi. I can't seem to get the drawer to work on mobile.
This is an awesome feature! I also cannot get it to work on mobile although ensuring "show in mobile" is ON.
Is anyone else having issue with drawers not working on mobile?
Hi @Justin_Brodowsky, @Aarij_Anwer, & @Miotx,
Drawers are not supported on mobile right now, but we're tracking interest in this internally. The good news (tentatively!) is this may become supported when the team does some more work on modals, targeting by the end of the year