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.

Sign up for GitHub

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

Jump to bottom

SwingPanel is always on the top #3739

Closed
MohamedRejeb opened this issue Sep 28, 2023 · 1 comment
Closed

SwingPanel is always on the top #3739

MohamedRejeb opened this issue Sep 28, 2023 · 1 comment
Assignees
@MatkovIvan
Labels
bug Something isn't working duplicate This issue or pull request already exists

Comments

@MohamedRejeb
Copy link

Describe the bug
If I use android Views or iOS UIKit interop with Compose the z index is respected and I can have a composable on top of a UIKit View for example but for desktop it's not the case, swing components are always on the top.

Box {
    SwingInterop()
    Text("Demo text") // this text should be visible on top of swing
}

https://github.com/MohamedRejeb/Calf/blob/8dd27303afba2f76503089567ad65ffe94e5a051/calf-ui/src/desktopMain/kotlin/com/mohamedrejeb/calf/ui/web/WebView.desktop.kt#L120

https://github.com/MohamedRejeb/Calf/blob/8dd27303afba2f76503089567ad65ffe94e5a051/sample/common/src/commonMain/kotlin/com.mohamedrejeb.calf.sample/ui/WebViewScreen.kt#L47

Affected platforms

  • Desktop

Versions

  • Kotlin version*: 1.9.20-Beta
  • Compose Multiplatform version*: 1.5.10-beta01
  • OS version(s)* (required for Desktop and iOS issues): macOs
  • OS architecture (x86 or arm64): arm64
  • JDK (for desktop issues): 17

To Reproduce
Steps and/or the code snippet to reproduce the behavior:

  1. Create a Box composable
  2. Add SwingPanel
  3. Add any other composable under the SwingPanel
  4. The composable is not going to be visible

Expected behavior
The composable should be on top of the SwingPanel

Additional context
In my case I'm using JavaFX WebView, I'm not sure if it's a common problem or related to using JavaFX
@MohamedRejeb MohamedRejeb added bug Something isn't working submitted labels Sep 28, 2023
@MatkovIvan
Copy link
Member

It looks like duplicate of #2926

@MatkovIvan MatkovIvan added duplicate This issue or pull request already exists and removed submitted labels Sep 29, 2023
@MatkovIvan MatkovIvan mentioned this issue Nov 24, 2023
Merged
@MatkovIvan MatkovIvan self-assigned this Nov 24, 2023
MatkovIvan added a commit to JetBrains/compose-multiplatform-core that referenced this issue Dec 15, 2023
@MatkovIvan
Proper clipping of SwingPanel interop (#915)
9751714 
## Proposed Changes

- Adopt an approach that we're using for iOS - using custom blending to
respect clip/shape modifiers and overlapped drawings.
- Fix bounds in window calculation - it should work properly inside
scaled content now.

## Testing

The new behavior is under a feature flag, so you can test it by setting
system property:

```kt
System.setProperty("compose.interop.blending", "true")
```

Currently it supports Metal (macOS), Direct3D (Windows) (requires
JetBrains/skiko#837), and off-screen rendering
(might be enable by another feature flag:
`compose.swing.render.on.graphics`)

### Clipping

```kt
SwingPanel(
    modifier = Modifier.clip(RoundedCornerShape(6.dp))
    ...
)
```
<img width="262" alt="image"
src="https://github.com/JetBrains/compose-multiplatform-core/assets/1836384/a03926f5-8977-4530-8894-d84aedfd5939">

### Overlapping

```kt
Box(modifier = Modifier.fillMaxSize()) {
    SwingPanel(factory = {
        JPanel().also { panel ->
            panel.background = java.awt.Color.red
            panel.add(JButton().also { button ->
                button.text = "JButton"
            })
        }
    })
    Snackbar(
        action = { Button(onClick = {}) { Text("OK") } },
        modifier = Modifier.padding(8.dp).align(Alignment.BottomCenter),
    ) {
        Text("Snackbar")
    }
    Popup(alignment = Alignment.Center) {
        Box(
            modifier = Modifier.size(200.dp, 100.dp).background(Gray),
            contentAlignment = Alignment.Center,
        ) {

            Text("Popup")
        }

    }
}
```
<img width="592" alt="Screenshot 2023-11-27 at 13 57 43"
src="https://github.com/JetBrains/compose-multiplatform-core/assets/1836384/dda1f2d6-6a1e-456c-8763-46a82d9562a8">


## Issues Fixed

Fixes JetBrains/compose-multiplatform#3823
Fixes JetBrains/compose-multiplatform#3739
Fixes JetBrains/compose-multiplatform#3353
Fixes JetBrains/compose-multiplatform#3474
@MatkovIvan MatkovIvan mentioned this issue Feb 22, 2024
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@MatkovIvan MatkovIvan

Labels
bug Something isn't working duplicate This issue or pull request already exists
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@MatkovIvan @MohamedRejeb