Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(color): Add information bubble popup window. #3903

Merged
merged 2 commits into from
Sep 21, 2023

Conversation

philmoz
Copy link
Collaborator

@philmoz philmoz commented Aug 5, 2023

As requested for the NV14/EL18 hat trims PR #3894 .

Initial styling is high contrast (black & white) with a thicker border.
Displays at the bottom of the screen, above all other windows, and closes automatically after a configurable timeout.
User can still interact with the other windows/controls.

Screenshot 2023-08-05 at 10 41 58 am

@pfeerick
Copy link
Member

pfeerick commented Aug 5, 2023

Now you just need to add Mr Clippy to the right of it, and have it quotation bubble shaped... "How do you want to crash today?" 🤭 🤣

@JimB40
Copy link
Collaborator

JimB40 commented Aug 5, 2023

Thanks Phil.

For styling I've mocked up colored one, but this is function to show 'system' messages. Then Quick Menu (Carousel) scheme is the best to provide maximum contrast ratio and will be visually unified

  • white txt and frame
  • black bkg with slight transparency. Don't remember transparency amount same as Quick Menu as we tested it to provide some opacity but not to loose much if contrast ratio.

If you want bubble msg func future proof you may also add option for C++ dev to call it as warning, then background color should be theme WARNING with same amount of transparency.

@philmoz
Copy link
Collaborator Author

philmoz commented Aug 5, 2023

Not sure about white on black and transparency. It might get a bit lost depending on background.
Also I'm using PRIMARY1 and PRIMARY2 colors at the moment so it will change with theme. The quick menu uses fixed black and white so does not change with theme. Should the bubble popup use theme colors or fixed colors?

White on black with transparency:
Screenshot 2023-08-05 at 3 12 04 pm
Screenshot 2023-08-05 at 3 12 15 pm

Black on white with transparency:
Screenshot 2023-08-05 at 3 13 59 pm
Screenshot 2023-08-05 at 3 14 09 pm

Black on white:
Screenshot 2023-08-05 at 3 13 23 pm
Screenshot 2023-08-05 at 3 13 31 pm

@pfeerick
Copy link
Member

pfeerick commented Aug 5, 2023

IMO, better with a solid background - some transparency can look nice, but given the intended application, this is either an information or a warning notice, and you do NOT want to add to the cognitive workload by making it hard to read.

Having an icon at the side (something like the below info and warning hints), perhaps with more of a solid box of color where the icon is, and the icon color inverted, could be a nice extension.
image

@JimB40
Copy link
Collaborator

JimB40 commented Aug 5, 2023

Yeah test is ultimate judge. So...

  1. Forgot windows can ovelap. Overlaping two windows (Quick Menu, Buuble Msg) with transparency in not well readable.
    We definetely have to go with solid backround for Bubble Msg.
  2. Border, whatever color we give will blend with something undeneath as we have unfinite number of cases with themes and backgrounds so fixed BLACK & WHITE (not theme colors) sheme looks most appropriate, and border will give separation (although sometimes blending).
  3. If you make bulid with feature to show test bubble msg we may give test run on different themes. Or maybe there is a way to merge your PR with @mha1 PR to test it on hats switching.
  4. ATM I'd pass PR without icon as it requires gfx icons while we have more urgent things to do in gfx area.

PS.
5. If you really want Theme colors although it should be.
SECONDARY1 for background
PRIMARY2 for text & frame
ETX_2 9_Colors

@philmoz
Copy link
Collaborator Author

philmoz commented Aug 5, 2023

I've changed it to fixed BLACK and WHITE for now.
I'll be away for a few weeks; but mha1 should be able to add the changes to the hats trim PR if you want to try it.

@mha1
Copy link
Contributor

mha1 commented Aug 5, 2023

I've integrated it in #3894. Works great and looks even better.

2.10 based firmware and Companion builds for NV14/EL18 for testing can be found in the checks tab of #3894. 2.10 based NV14/EL18 firmware and Companion builds for testing can be found in the checks tab of #3894 (fw direct link https://github.com/EdgeTX/edgetx/suites/14847387743/artifacts/845522313)

@pfeerick pfeerick added enhancement ✨ New feature or request color Related generally to color LCD radios labels Sep 21, 2023
@pfeerick pfeerick added this to the 2.10 milestone Sep 21, 2023
@pfeerick pfeerick merged commit 22a4e67 into EdgeTX:main Sep 21, 2023
36 checks passed
@philmoz philmoz deleted the bubble-popup branch December 11, 2023 01:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
color Related generally to color LCD radios enhancement ✨ New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants