Bottom sheet redesign #90
Comments
|
I've just split out part of this issue to a new one: So for this issue, let's leave out the message text at the top of the bottom sheet; we'll pursue that in the new separate issue. (At the moment our bottom sheet has many fewer items than this, which I think also reduces somewhat the need for that feature because there's room on the screen to still see the message while the bottom sheet is open.) Let's also leave out of scope for this issue any changes to what icons we use for the options. Replacing the icons will be done as part of #200 or a followup, and can happen either before or after we complete this issue. |
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as duplicate.
This comment was marked as duplicate.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
|
The bottom sheet should not have custom resize. It should show all the options and if the list is too big make it scrollable. |
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
- This commit consists the modification of design of action sheet that pops up when any message is long pressed. - Solves Issue [zulip#90](https://github.com/orgs/zulip/projects/5/views/4?pane=issue&itemId=29283720) - In action_sheet.dart file there are 4 major changes : - Changed the showMessageActionSheet method to create a list of widgets for the widgets to rendered in the action sheet instead of directly passing it as the children of Column. - Changed the abstract class MessageActionSheetMenuItemButton to have the colors and the variables to specify that an element is first or last element in the Column. - Changed the design of the bottom sheet according to the given [figma design](https://www.figma.com/file/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?type=design&node-id=510%3A19993&mode=design&t=ef5KZAP1MNaqPFEA-1). - Added a widget MessageActionSheetCancelButton for the cancel button.
|
This will benefit from #831, because the colors in the design are specified in terms of that color palette. But I think #831 doesn't need to block this — there's a small number of colors in this part of the design, and it'd be fine if we encode them as RGB values directly. In that case #831 would just refactor those to point to the color palette when it's ready. |
Also, remove the custom modal bottom sheet we no longer use. Fixes: zulip#90
Also, remove the custom modal bottom sheet we no longer use. Fixes: zulip#90
|
This redesign is out in today's new beta release, v0.0.21. |
When you long-press a message, we show a bottom sheet with actions you can take on it, which we also call an "action sheet". (Currently in this prototype there's just one action, "share". In zulip-mobile it's a much longer list, and we also show a similar widget when you long-press on a topic name and some other places.)
Currently it's a pretty plain bottom sheet. We should adjust the styling to match the following design prepared by @terpimost:
https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=3481-27050&m=dev
https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=3483-27168&m=dev
Here's a screenshot taken from there. For details of the layout and behavior, see the Figma design.
To help manage the work, I've split implementing this design up into two GitHub issues. For this issue, we'll only implement the screen shown above, not the three others you'll find to the right of it in Figma showing variations. Then there's a followup issue here:
The text was updated successfully, but these errors were encountered: