oak-team/oak-gpui
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

gpui: Add opacity to support transparency of the entire element (#17132)

Browse Source 
Release Notes:

- N/A

---

Add this for let GPUI element to support fade in-out animation.

## Platform test

- [x] macOS
- [x] blade `cargo run -p gpui --example opacity --features macos-blade`

## Usage

```rs
div()
    .opacity(0.5)
    .bg(gpui::black())
    .text_color(gpui::black())
    .child("Hello world")
```

This will apply the `opacity` it self and all children to use `opacity`
value to render colors.

## Example

```
cargo run -p gpui --example opacity
cargo run -p gpui --example opacity --features macos-blade
```

<img width="612" alt="image"
src="https://github.com/user-attachments/assets/f1da87ed-31f5-4b55-a023-39e8ee1ba349">
This commit is contained in:
Jason Lee
2024-09-04 12:53:45 +02:00
committed by GitHub
parent 072513f59f
commit a092ff0c4f
10 changed files with 297 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
crates/gpui/src/elements/div.rs
+34 -25
View File
@@ -1500,35 +1500,44 @@ impl Interactivity {
return ((), element_state);
}
style.paint(bounds, cx, |cx: &mut WindowContext| {
cx.with_text_style(style.text_style().cloned(), |cx| {
cx.with_content_mask(style.overflow_mask(bounds, cx.rem_size()), |cx| {
if let Some(hitbox) = hitbox {
#[cfg(debug_assertions)]
self.paint_debug_info(global_id, hitbox, &style, cx);
cx.with_element_opacity(style.opacity, |cx| {
style.paint(bounds, cx, |cx: &mut WindowContext| {
cx.with_text_style(style.text_style().cloned(), |cx| {
cx.with_content_mask(
style.overflow_mask(bounds, cx.rem_size()),
|cx| {
if let Some(hitbox) = hitbox {
#[cfg(debug_assertions)]
self.paint_debug_info(global_id, hitbox, &style, cx);
if !cx.has_active_drag() {
if let Some(mouse_cursor) = style.mouse_cursor {
cx.set_cursor_style(mouse_cursor, hitbox);
if !cx.has_active_drag() {
if let Some(mouse_cursor) = style.mouse_cursor {
cx.set_cursor_style(mouse_cursor, hitbox);
}
}
if let Some(group) = self.group.clone() {
GroupHitboxes::push(group, hitbox.id, cx);
}
self.paint_mouse_listeners(
hitbox,
element_state.as_mut(),
cx,
);
self.paint_scroll_listener(hitbox, &style, cx);
}
}
if let Some(group) = self.group.clone() {
GroupHitboxes::push(group, hitbox.id, cx);
}
self.paint_keyboard_listeners(cx);
f(&style, cx);
self.paint_mouse_listeners(hitbox, element_state.as_mut(), cx);
self.paint_scroll_listener(hitbox, &style, cx);
}
self.paint_keyboard_listeners(cx);
f(&style, cx);
if hitbox.is_some() {
if let Some(group) = self.group.as_ref() {
GroupHitboxes::pop(group, cx);
}
}
if hitbox.is_some() {
if let Some(group) = self.group.as_ref() {
GroupHitboxes::pop(group, cx);
}
}
},
);
});
});
});