JetBrains / compose-multiplatform

Compose Multiplatform, a modern UI framework for Kotlin that makes building performant and beautiful user interfaces easy and enjoyable.
https://jetbrains.com/lp/compose-multiplatform
Apache License 2.0
15.9k stars 1.16k forks source link

[Titlebar] Support Transparent Titlebar API. #3164

Open Sanlorng opened 1 year ago

Sanlorng commented 1 year ago

Description: Would you consider supporting an interface for making a transparent title bar? The Undecorated parameter cannot be easily implemented into an effect similar to ExtendContentToTitleBar in UWP applications which has system default caption button, system default corner shape, system default hit test, system default shadow and system default border. And Jetbrains/jewel seems to only be able to achieve partial effects on JBR.

Proposal:

    val state = rememberWindowState(extendToTitleBar = true)
    val contentColor = LocalContentColor.current
    LaunchEffect(state, contentColor) {
        state.titleBarBackgroundColor = Color.Transparent  
        state.captionButtonInactiveBackgroundColor = Color.Transparent
        state.captionButtonForegroundColor = contentColor.copy(0.87f)
        state.captionButtonInactiveForegroundColor = contentColor.copy(0.38f)
    }

    Window(state = state) {
        Column {
             Row(
                 modifier =  Modifier
                     .fillMaxWidth()
                     .wrapContentWidth(aligment = Aligment.End)
                     .height(WindowInsets.TitleBar.asPaddingValues().calculatePaddingTop())
            ){
                 Button(modifier = Modifier.padding(end = WindowInsets.CaptionButtons.asPaddingValues().calculatePaddingEnd(LocalRTL.current))) {
                    Text(text = "Button in titleBar")
                }
            }
        }

    }

Expect Behaviour : App content extend to TitleBar,and button in titleBar can padding caption buttons and interactive. Window has a system default look and feel instead of Undecorated window

igordmn commented 1 year ago

Thanks for proposal!

We had multiple missing features regarding customizing titlebars on different OS'es.

In the future we will revisit them, and make a consistent API that works for all OS'es (with specific API for each OS probably).

Not sure yet, but it probably won't be a part of WindowState, because its purpose to hoist states that can be changed by an user (resizing/repositioning window). It will be as an parameter of Window (one of the options is to combine some existing parameters into one rich parameter).

mahozad commented 1 year ago

Here is a solution for native shadows and animations for undecorated app in Windows:

wwalkingg commented 11 months ago

I think it's sufficient to not display the TitleBar, but retain the shadow and the ability to resize.

Sanlorng commented 11 months ago

I think it's sufficient to not display the TitleBar, but retain the shadow and the ability to resize.

I think CaptionButton is equally important for a desktop application. If developers need to draw their own CaptionButton, then the developer will have to write some wndProc-related code in order to support Windows 11 Snap.

Sanlorng commented 2 months ago

Thanks for proposal!

We had multiple missing features regarding customizing titlebars on different OS'es.

In the future we will revisit them, and make a consistent API that works for all OS'es (with specific API for each OS probably).

Not sure yet, but it probably won't be a part of WindowState, because its purpose to hoist states that can be changed by an user (resizing/repositioning window). It will be as an parameter of Window (one of the options is to combine some existing parameters into one rich parameter).

I implemented Windows side by WindowProcedure and compose internal hit test api(LayoutNode.hitTest)See detail Pull Request,The only problem now is that the pop-up layer will block the title bar button, making it impossible to use the window management function when open popup。The same problem also occurs in the official window resizer。Will you consider a permanent window-top-level compose function in the future? This would be more convenient for some display areas that do not need to be blocked by popup

okushnikov commented 2 months ago

Please check the following ticket on YouTrack for follow-ups to this issue. GitHub issues will be closed in the coming weeks.