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

Overlay support and PickList widget #444

Merged
merged 31 commits into from
Jul 16, 2020
Merged

Overlay support and PickList widget #444

merged 31 commits into from
Jul 16, 2020

Conversation

hecrj
Copy link
Member

@hecrj hecrj commented Jul 10, 2020

This PR introduces the foundations for overlay support and a PickList widget.

A new overlay method has been added to the Widget trait. A widget can choose to implement this method to display interactive content on top of other widgets by returning an implementor of the new Overlay trait.

While this new Overlay trait is very similar to Widget, the layout logic of an Overlay works with absolute window coordinates, instead of some relative limits. This can be leveraged to smartly overlay content based on the absolute position of a widget:

Additionally, a PickList widget has been implemented to showcase the overlay support. This widget is equivalent to a "dropdown list" or a <select> element on the Web.

The PickList widget uses a Menu as its overlay, which represents a list of selectable options. Currently, Menu is the only built-in type implementing the new Overlay trait. However, now that the foundations are laid out, I believe we should be able to implement different kinds of overlays relatively easily.

It is important to note that the current overlay support has some limitations and, therefore, it is not equivalent to full layering support (see #30). Specifically, the Overlay trait does not currently allow nesting, which means we cannot satisfy some use cases yet (like displaying a modal with a PickList inside). We will need to improve our rendering pipeline—specially text—before we are able to remove these limitations. In any case, I believe this is the first step in the right direction and the current implementation, while far from complete, already brings a lot of value.

Finally, and as always, I have created a new pick_list example to showcase the new PickList widget and also added a preset selector to the game_of_life example.

Closes #235.

@hecrj hecrj added the feature New feature or request label Jul 10, 2020
@hecrj hecrj added this to the 0.2.0 milestone Jul 10, 2020
@hecrj hecrj self-assigned this Jul 10, 2020
@hecrj
Copy link
Member Author

hecrj commented Jul 15, 2020

@zero-systems Yes, I haven't merged the PR precisely because I need to adress that first!

I want to create a button which has 2 layers: canvas and label.
Canvas will be filled with color1 and when I click the button there appears circle, that has color2 and increases every tick (material design).

You should not need to do anything special. The geometry produced by a Canvas is always behind any Text primitives.

The overlay support I describe here refers to the superposition of interactive content on top of other interactive elements.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant