Skip to content

Repository files navigation


Logo

Compose Window Styler

Compose Window StylerGitHub starsGitHub licenseMaven CentralSonatype Nexus (Snapshots)Twitter

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica, ...etc.


Demo Screenshot


Setup (Gradle)

repositories {
mavenCentral()
// Add only if you're using snapshot version
maven("https://s01.oss.sonatype.org/content/repositories/snapshots/")
}
dependencies {
implementation("com.mayakapps.compose:window-styler:<version>")
}

Don't forget to replace <version> with the latest/desired version found on the badges above.

Usage

You can apply the desired style to your window by using WindowStyle inside the WindowScope of Window or similar composable calls. It can be placed anywhere inside them.

Sample Code:

Window(onCloseRequest = ::exitApplication) {
WindowStyle(
isDarkTheme = isDarkTheme,
backdropType = backdropType,
frameStyle =WindowFrameStyle(cornerPreference =WindowCornerPreference.NOT_ROUNDED),
)
App()
}

Documentation

See documentation here

Available Styles

isDarkTheme

This property should match the theming system used in your application. Its effect depends on the used backdrop as follows:

  • If the backdropType is WindowBackdrop.Mica or WindowBackdrop.Tabbed, it is used to manage the color of the background whether it is light or dark.
  • Otherwise, it is used to control the color of the title bar of the window white/black.

backdropType

  • WindowBackdrop.Default: Though its name may imply that the window will be left unchanged, this is not the case as once the transparency is hacked into the window, it can't be reverted. So, this effect provides a simple solid backdrop colored as white or black according to isDarkTheme. This allows the backdrop to blend with the title bar as well.
  • WindowBackdrop.Solid(val color: Color): This applies the color as a solid background which means that any alpha component is ignored and the color is rendered as opaque.
  • WindowBackdrop.Transparent: This makes the window fully transparent.
  • WindowBackdrop.Transparent(val color: Color): Same as Solid but allows transparency taking into account the alpha value. If the passed color is fully opaque, the alpha is set to 0.5F.
  • WindowBackdrop.Aero: This applies Aero backdrop which is Windows Vista and Windows 7 version of blur. This effect doesn't allow any customization.
  • WindowBackdrop.Acrylic(val color: Color): This applies Acrylic backdrop blended with the supplied color. If the backdrop is rendered opaque, double check that color has a reasonable alpha value. Supported on Windows 10 version 1803 or greater.
  • WindowBackdrop.Mica: This applies Mica backdrop themed according to isDarkTheme value. Supported on Windows 11 21H2 or greater.
  • WindowBackdrop.Tabbed: This applies Tabbed backdrop themed according to isDarkTheme value. This is a backdrop that is similar to Mica but targeted at tabbed windows. Supported on Windows 11 22H2 or greater.

Fallback Strategy

In case of unsupported effect the library tries to fall back to the nearest supported effect as follows (If an effect is not supported, check for the next):

Tabbed -> Mica -> Acrylic -> Transparent

Aero is dropped as it is much more transparent than Tabbed or Mica and not customizable as Acrylic. If Tabbed or Mica falls back to Acrylic or Transparent, high alpha is used with white or black color according to isDarkTheme to emulate these effects.

frameStyle

All the following properties are only supported on Windows 11 or greater and has no effect on other OSes.

  • borderColor: specifies the color of the window border that is running around the window if the window is decorated. This property doesn't support transparency.
  • titleBarColor: specifies the color of the window title bar (caption bar) if the window is decorated. This property doesn't support transparency.
  • captionColor: specifies the color of the window caption (title) text if the window is decorated. This property doesn't support transparency.
  • cornerPreference: specifies the shape of the corners you want. For example, you can use this property to avoid rounded corners in a decorated window or get the corners rounded in an undecorated window.

License

This library is distributed under Apache 2.0 License. See LICENSE for more information.

Contributing

All contributions are welcome. If you are reporting an issue, please use the provided template. If you're planning to contribute to the code, please open an issue first describing what feature you're planning to add or what issue you're planning to fix. This allows better discussion and coordination of efforts. You can also check open issues for bugs/features that needs to be fixed/implemented.

Acknowledgements

  • flutter_acrylic: This library is heavily based on flutter_acrylic.
  • Swing Acrylic: as a reference for the Java implementation of required APIs.

About

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc.

Resources

Code of conduct

Stars

213 stars

Watchers

3 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
GitHub - MayakaApps/ComposeWindowStyler: Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc. · GitHub
Skip to content

Repository files navigation


Logo

Compose Window Styler

Compose Window StylerGitHub starsGitHub licenseMaven CentralSonatype Nexus (Snapshots)Twitter

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica, ...etc.


Demo Screenshot


Setup (Gradle)

repositories {
mavenCentral()
// Add only if you're using snapshot version
maven("https://s01.oss.sonatype.org/content/repositories/snapshots/")
}
dependencies {
implementation("com.mayakapps.compose:window-styler:<version>")
}

Don't forget to replace <version> with the latest/desired version found on the badges above.

Usage

You can apply the desired style to your window by using WindowStyle inside the WindowScope of Window or similar composable calls. It can be placed anywhere inside them.

Sample Code:

Window(onCloseRequest = ::exitApplication) {
WindowStyle(
isDarkTheme = isDarkTheme,
backdropType = backdropType,
frameStyle =WindowFrameStyle(cornerPreference =WindowCornerPreference.NOT_ROUNDED),
)
App()
}

Documentation

See documentation here

Available Styles

isDarkTheme

This property should match the theming system used in your application. Its effect depends on the used backdrop as follows:

  • If the backdropType is WindowBackdrop.Mica or WindowBackdrop.Tabbed, it is used to manage the color of the background whether it is light or dark.
  • Otherwise, it is used to control the color of the title bar of the window white/black.

backdropType

  • WindowBackdrop.Default: Though its name may imply that the window will be left unchanged, this is not the case as once the transparency is hacked into the window, it can't be reverted. So, this effect provides a simple solid backdrop colored as white or black according to isDarkTheme. This allows the backdrop to blend with the title bar as well.
  • WindowBackdrop.Solid(val color: Color): This applies the color as a solid background which means that any alpha component is ignored and the color is rendered as opaque.
  • WindowBackdrop.Transparent: This makes the window fully transparent.
  • WindowBackdrop.Transparent(val color: Color): Same as Solid but allows transparency taking into account the alpha value. If the passed color is fully opaque, the alpha is set to 0.5F.
  • WindowBackdrop.Aero: This applies Aero backdrop which is Windows Vista and Windows 7 version of blur. This effect doesn't allow any customization.
  • WindowBackdrop.Acrylic(val color: Color): This applies Acrylic backdrop blended with the supplied color. If the backdrop is rendered opaque, double check that color has a reasonable alpha value. Supported on Windows 10 version 1803 or greater.
  • WindowBackdrop.Mica: This applies Mica backdrop themed according to isDarkTheme value. Supported on Windows 11 21H2 or greater.
  • WindowBackdrop.Tabbed: This applies Tabbed backdrop themed according to isDarkTheme value. This is a backdrop that is similar to Mica but targeted at tabbed windows. Supported on Windows 11 22H2 or greater.

Fallback Strategy

In case of unsupported effect the library tries to fall back to the nearest supported effect as follows (If an effect is not supported, check for the next):

Tabbed -> Mica -> Acrylic -> Transparent

Aero is dropped as it is much more transparent than Tabbed or Mica and not customizable as Acrylic. If Tabbed or Mica falls back to Acrylic or Transparent, high alpha is used with white or black color according to isDarkTheme to emulate these effects.

frameStyle

All the following properties are only supported on Windows 11 or greater and has no effect on other OSes.

  • borderColor: specifies the color of the window border that is running around the window if the window is decorated. This property doesn't support transparency.
  • titleBarColor: specifies the color of the window title bar (caption bar) if the window is decorated. This property doesn't support transparency.
  • captionColor: specifies the color of the window caption (title) text if the window is decorated. This property doesn't support transparency.
  • cornerPreference: specifies the shape of the corners you want. For example, you can use this property to avoid rounded corners in a decorated window or get the corners rounded in an undecorated window.

License

This library is distributed under Apache 2.0 License. See LICENSE for more information.

Contributing

All contributions are welcome. If you are reporting an issue, please use the provided template. If you're planning to contribute to the code, please open an issue first describing what feature you're planning to add or what issue you're planning to fix. This allows better discussion and coordination of efforts. You can also check open issues for bugs/features that needs to be fixed/implemented.

Acknowledgements

  • flutter_acrylic: This library is heavily based on flutter_acrylic.
  • Swing Acrylic: as a reference for the Java implementation of required APIs.

About

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc.

Resources

Code of conduct

Stars

213 stars

Watchers

3 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Force GitHub README to respect dark mode (function() { var style = document.createElement('style'); style.textContent = ' .markdown-body { color-scheme: dark light; } .markdown-body pre { background: #161b22 !important; } .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; } .markdown-body table th, .markdown-body table td { border-color: #30363d !important; } .markdown-body img { background: #0d1117; } .markdown-body blockquote { border-left-color: #8b949e; } .markdown-body hr { border-color: #30363d; } '; document.head.appendChild(style); })(); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' GitHub - MayakaApps/ComposeWindowStyler: Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc. · GitHub
Skip to content

Repository files navigation


Logo

Compose Window Styler

Compose Window StylerGitHub starsGitHub licenseMaven CentralSonatype Nexus (Snapshots)Twitter

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica, ...etc.


Demo Screenshot


Setup (Gradle)

repositories {
mavenCentral()
// Add only if you're using snapshot version
maven("https://s01.oss.sonatype.org/content/repositories/snapshots/")
}
dependencies {
implementation("com.mayakapps.compose:window-styler:<version>")
}

Don't forget to replace <version> with the latest/desired version found on the badges above.

Usage

You can apply the desired style to your window by using WindowStyle inside the WindowScope of Window or similar composable calls. It can be placed anywhere inside them.

Sample Code:

Window(onCloseRequest = ::exitApplication) {
WindowStyle(
isDarkTheme = isDarkTheme,
backdropType = backdropType,
frameStyle =WindowFrameStyle(cornerPreference =WindowCornerPreference.NOT_ROUNDED),
)
App()
}

Documentation

See documentation here

Available Styles

isDarkTheme

This property should match the theming system used in your application. Its effect depends on the used backdrop as follows:

  • If the backdropType is WindowBackdrop.Mica or WindowBackdrop.Tabbed, it is used to manage the color of the background whether it is light or dark.
  • Otherwise, it is used to control the color of the title bar of the window white/black.

backdropType

  • WindowBackdrop.Default: Though its name may imply that the window will be left unchanged, this is not the case as once the transparency is hacked into the window, it can't be reverted. So, this effect provides a simple solid backdrop colored as white or black according to isDarkTheme. This allows the backdrop to blend with the title bar as well.
  • WindowBackdrop.Solid(val color: Color): This applies the color as a solid background which means that any alpha component is ignored and the color is rendered as opaque.
  • WindowBackdrop.Transparent: This makes the window fully transparent.
  • WindowBackdrop.Transparent(val color: Color): Same as Solid but allows transparency taking into account the alpha value. If the passed color is fully opaque, the alpha is set to 0.5F.
  • WindowBackdrop.Aero: This applies Aero backdrop which is Windows Vista and Windows 7 version of blur. This effect doesn't allow any customization.
  • WindowBackdrop.Acrylic(val color: Color): This applies Acrylic backdrop blended with the supplied color. If the backdrop is rendered opaque, double check that color has a reasonable alpha value. Supported on Windows 10 version 1803 or greater.
  • WindowBackdrop.Mica: This applies Mica backdrop themed according to isDarkTheme value. Supported on Windows 11 21H2 or greater.
  • WindowBackdrop.Tabbed: This applies Tabbed backdrop themed according to isDarkTheme value. This is a backdrop that is similar to Mica but targeted at tabbed windows. Supported on Windows 11 22H2 or greater.

Fallback Strategy

In case of unsupported effect the library tries to fall back to the nearest supported effect as follows (If an effect is not supported, check for the next):

Tabbed -> Mica -> Acrylic -> Transparent

Aero is dropped as it is much more transparent than Tabbed or Mica and not customizable as Acrylic. If Tabbed or Mica falls back to Acrylic or Transparent, high alpha is used with white or black color according to isDarkTheme to emulate these effects.

frameStyle

All the following properties are only supported on Windows 11 or greater and has no effect on other OSes.

  • borderColor: specifies the color of the window border that is running around the window if the window is decorated. This property doesn't support transparency.
  • titleBarColor: specifies the color of the window title bar (caption bar) if the window is decorated. This property doesn't support transparency.
  • captionColor: specifies the color of the window caption (title) text if the window is decorated. This property doesn't support transparency.
  • cornerPreference: specifies the shape of the corners you want. For example, you can use this property to avoid rounded corners in a decorated window or get the corners rounded in an undecorated window.

License

This library is distributed under Apache 2.0 License. See LICENSE for more information.

Contributing

All contributions are welcome. If you are reporting an issue, please use the provided template. If you're planning to contribute to the code, please open an issue first describing what feature you're planning to add or what issue you're planning to fix. This allows better discussion and coordination of efforts. You can also check open issues for bugs/features that needs to be fixed/implemented.

Acknowledgements

  • flutter_acrylic: This library is heavily based on flutter_acrylic.
  • Swing Acrylic: as a reference for the Java implementation of required APIs.

About

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc.

Resources

Code of conduct

Stars

213 stars

Watchers

3 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Highlight search terms from Google/DuckDuckGo/Bing referrer (function() { var ref = document.referrer; var terms = []; if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) { var url = new URL(ref); var q = url.searchParams.get('q') || url.searchParams.get('p'); if (q) { terms = q.split(/\s+/).filter(function(t) { return t.length > 2; }); } } if (terms.length === 0) return; var style = document.createElement('style'); style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }'; document.head.appendChild(style); function highlight(node) { if (node.nodeType === 3) { // text node var text = node.textContent; var found = false; terms.forEach(function(term) { var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' GitHub - MayakaApps/ComposeWindowStyler: Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc. · GitHub
Skip to content

Repository files navigation


Logo

Compose Window Styler

Compose Window StylerGitHub starsGitHub licenseMaven CentralSonatype Nexus (Snapshots)Twitter

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica, ...etc.


Demo Screenshot


Setup (Gradle)

repositories {
mavenCentral()
// Add only if you're using snapshot version
maven("https://s01.oss.sonatype.org/content/repositories/snapshots/")
}
dependencies {
implementation("com.mayakapps.compose:window-styler:<version>")
}

Don't forget to replace <version> with the latest/desired version found on the badges above.

Usage

You can apply the desired style to your window by using WindowStyle inside the WindowScope of Window or similar composable calls. It can be placed anywhere inside them.

Sample Code:

Window(onCloseRequest = ::exitApplication) {
WindowStyle(
isDarkTheme = isDarkTheme,
backdropType = backdropType,
frameStyle =WindowFrameStyle(cornerPreference =WindowCornerPreference.NOT_ROUNDED),
)
App()
}

Documentation

See documentation here

Available Styles

isDarkTheme

This property should match the theming system used in your application. Its effect depends on the used backdrop as follows:

  • If the backdropType is WindowBackdrop.Mica or WindowBackdrop.Tabbed, it is used to manage the color of the background whether it is light or dark.
  • Otherwise, it is used to control the color of the title bar of the window white/black.

backdropType

  • WindowBackdrop.Default: Though its name may imply that the window will be left unchanged, this is not the case as once the transparency is hacked into the window, it can't be reverted. So, this effect provides a simple solid backdrop colored as white or black according to isDarkTheme. This allows the backdrop to blend with the title bar as well.
  • WindowBackdrop.Solid(val color: Color): This applies the color as a solid background which means that any alpha component is ignored and the color is rendered as opaque.
  • WindowBackdrop.Transparent: This makes the window fully transparent.
  • WindowBackdrop.Transparent(val color: Color): Same as Solid but allows transparency taking into account the alpha value. If the passed color is fully opaque, the alpha is set to 0.5F.
  • WindowBackdrop.Aero: This applies Aero backdrop which is Windows Vista and Windows 7 version of blur. This effect doesn't allow any customization.
  • WindowBackdrop.Acrylic(val color: Color): This applies Acrylic backdrop blended with the supplied color. If the backdrop is rendered opaque, double check that color has a reasonable alpha value. Supported on Windows 10 version 1803 or greater.
  • WindowBackdrop.Mica: This applies Mica backdrop themed according to isDarkTheme value. Supported on Windows 11 21H2 or greater.
  • WindowBackdrop.Tabbed: This applies Tabbed backdrop themed according to isDarkTheme value. This is a backdrop that is similar to Mica but targeted at tabbed windows. Supported on Windows 11 22H2 or greater.

Fallback Strategy

In case of unsupported effect the library tries to fall back to the nearest supported effect as follows (If an effect is not supported, check for the next):

Tabbed -> Mica -> Acrylic -> Transparent

Aero is dropped as it is much more transparent than Tabbed or Mica and not customizable as Acrylic. If Tabbed or Mica falls back to Acrylic or Transparent, high alpha is used with white or black color according to isDarkTheme to emulate these effects.

frameStyle

All the following properties are only supported on Windows 11 or greater and has no effect on other OSes.

  • borderColor: specifies the color of the window border that is running around the window if the window is decorated. This property doesn't support transparency.
  • titleBarColor: specifies the color of the window title bar (caption bar) if the window is decorated. This property doesn't support transparency.
  • captionColor: specifies the color of the window caption (title) text if the window is decorated. This property doesn't support transparency.
  • cornerPreference: specifies the shape of the corners you want. For example, you can use this property to avoid rounded corners in a decorated window or get the corners rounded in an undecorated window.

License

This library is distributed under Apache 2.0 License. See LICENSE for more information.

Contributing

All contributions are welcome. If you are reporting an issue, please use the provided template. If you're planning to contribute to the code, please open an issue first describing what feature you're planning to add or what issue you're planning to fix. This allows better discussion and coordination of efforts. You can also check open issues for bugs/features that needs to be fixed/implemented.

Acknowledgements

  • flutter_acrylic: This library is heavily based on flutter_acrylic.
  • Swing Acrylic: as a reference for the Java implementation of required APIs.

About

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc.

Resources

Code of conduct

Stars

213 stars

Watchers

3 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ' GitHub - MayakaApps/ComposeWindowStyler: Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc. · GitHub
Skip to content

Repository files navigation


Logo

Compose Window Styler

Compose Window StylerGitHub starsGitHub licenseMaven CentralSonatype Nexus (Snapshots)Twitter

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica, ...etc.


Demo Screenshot


Setup (Gradle)

repositories {
mavenCentral()
// Add only if you're using snapshot version
maven("https://s01.oss.sonatype.org/content/repositories/snapshots/")
}
dependencies {
implementation("com.mayakapps.compose:window-styler:<version>")
}

Don't forget to replace <version> with the latest/desired version found on the badges above.

Usage

You can apply the desired style to your window by using WindowStyle inside the WindowScope of Window or similar composable calls. It can be placed anywhere inside them.

Sample Code:

Window(onCloseRequest = ::exitApplication) {
WindowStyle(
isDarkTheme = isDarkTheme,
backdropType = backdropType,
frameStyle =WindowFrameStyle(cornerPreference =WindowCornerPreference.NOT_ROUNDED),
)
App()
}

Documentation

See documentation here

Available Styles

isDarkTheme

This property should match the theming system used in your application. Its effect depends on the used backdrop as follows:

  • If the backdropType is WindowBackdrop.Mica or WindowBackdrop.Tabbed, it is used to manage the color of the background whether it is light or dark.
  • Otherwise, it is used to control the color of the title bar of the window white/black.

backdropType

  • WindowBackdrop.Default: Though its name may imply that the window will be left unchanged, this is not the case as once the transparency is hacked into the window, it can't be reverted. So, this effect provides a simple solid backdrop colored as white or black according to isDarkTheme. This allows the backdrop to blend with the title bar as well.
  • WindowBackdrop.Solid(val color: Color): This applies the color as a solid background which means that any alpha component is ignored and the color is rendered as opaque.
  • WindowBackdrop.Transparent: This makes the window fully transparent.
  • WindowBackdrop.Transparent(val color: Color): Same as Solid but allows transparency taking into account the alpha value. If the passed color is fully opaque, the alpha is set to 0.5F.
  • WindowBackdrop.Aero: This applies Aero backdrop which is Windows Vista and Windows 7 version of blur. This effect doesn't allow any customization.
  • WindowBackdrop.Acrylic(val color: Color): This applies Acrylic backdrop blended with the supplied color. If the backdrop is rendered opaque, double check that color has a reasonable alpha value. Supported on Windows 10 version 1803 or greater.
  • WindowBackdrop.Mica: This applies Mica backdrop themed according to isDarkTheme value. Supported on Windows 11 21H2 or greater.
  • WindowBackdrop.Tabbed: This applies Tabbed backdrop themed according to isDarkTheme value. This is a backdrop that is similar to Mica but targeted at tabbed windows. Supported on Windows 11 22H2 or greater.

Fallback Strategy

In case of unsupported effect the library tries to fall back to the nearest supported effect as follows (If an effect is not supported, check for the next):

Tabbed -> Mica -> Acrylic -> Transparent

Aero is dropped as it is much more transparent than Tabbed or Mica and not customizable as Acrylic. If Tabbed or Mica falls back to Acrylic or Transparent, high alpha is used with white or black color according to isDarkTheme to emulate these effects.

frameStyle

All the following properties are only supported on Windows 11 or greater and has no effect on other OSes.

  • borderColor: specifies the color of the window border that is running around the window if the window is decorated. This property doesn't support transparency.
  • titleBarColor: specifies the color of the window title bar (caption bar) if the window is decorated. This property doesn't support transparency.
  • captionColor: specifies the color of the window caption (title) text if the window is decorated. This property doesn't support transparency.
  • cornerPreference: specifies the shape of the corners you want. For example, you can use this property to avoid rounded corners in a decorated window or get the corners rounded in an undecorated window.

License

This library is distributed under Apache 2.0 License. See LICENSE for more information.

Contributing

All contributions are welcome. If you are reporting an issue, please use the provided template. If you're planning to contribute to the code, please open an issue first describing what feature you're planning to add or what issue you're planning to fix. This allows better discussion and coordination of efforts. You can also check open issues for bugs/features that needs to be fixed/implemented.

Acknowledgements

  • flutter_acrylic: This library is heavily based on flutter_acrylic.
  • Swing Acrylic: as a reference for the Java implementation of required APIs.

About

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc.

Resources

Code of conduct

Stars

213 stars

Watchers

3 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' GitHub - MayakaApps/ComposeWindowStyler: Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc. · GitHub
Skip to content

Repository files navigation


Logo

Compose Window Styler

Compose Window StylerGitHub starsGitHub licenseMaven CentralSonatype Nexus (Snapshots)Twitter

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica, ...etc.


Demo Screenshot


Setup (Gradle)

repositories {
mavenCentral()
// Add only if you're using snapshot version
maven("https://s01.oss.sonatype.org/content/repositories/snapshots/")
}
dependencies {
implementation("com.mayakapps.compose:window-styler:<version>")
}

Don't forget to replace <version> with the latest/desired version found on the badges above.

Usage

You can apply the desired style to your window by using WindowStyle inside the WindowScope of Window or similar composable calls. It can be placed anywhere inside them.

Sample Code:

Window(onCloseRequest = ::exitApplication) {
WindowStyle(
isDarkTheme = isDarkTheme,
backdropType = backdropType,
frameStyle =WindowFrameStyle(cornerPreference =WindowCornerPreference.NOT_ROUNDED),
)
App()
}

Documentation

See documentation here

Available Styles

isDarkTheme

This property should match the theming system used in your application. Its effect depends on the used backdrop as follows:

  • If the backdropType is WindowBackdrop.Mica or WindowBackdrop.Tabbed, it is used to manage the color of the background whether it is light or dark.
  • Otherwise, it is used to control the color of the title bar of the window white/black.

backdropType

  • WindowBackdrop.Default: Though its name may imply that the window will be left unchanged, this is not the case as once the transparency is hacked into the window, it can't be reverted. So, this effect provides a simple solid backdrop colored as white or black according to isDarkTheme. This allows the backdrop to blend with the title bar as well.
  • WindowBackdrop.Solid(val color: Color): This applies the color as a solid background which means that any alpha component is ignored and the color is rendered as opaque.
  • WindowBackdrop.Transparent: This makes the window fully transparent.
  • WindowBackdrop.Transparent(val color: Color): Same as Solid but allows transparency taking into account the alpha value. If the passed color is fully opaque, the alpha is set to 0.5F.
  • WindowBackdrop.Aero: This applies Aero backdrop which is Windows Vista and Windows 7 version of blur. This effect doesn't allow any customization.
  • WindowBackdrop.Acrylic(val color: Color): This applies Acrylic backdrop blended with the supplied color. If the backdrop is rendered opaque, double check that color has a reasonable alpha value. Supported on Windows 10 version 1803 or greater.
  • WindowBackdrop.Mica: This applies Mica backdrop themed according to isDarkTheme value. Supported on Windows 11 21H2 or greater.
  • WindowBackdrop.Tabbed: This applies Tabbed backdrop themed according to isDarkTheme value. This is a backdrop that is similar to Mica but targeted at tabbed windows. Supported on Windows 11 22H2 or greater.

Fallback Strategy

In case of unsupported effect the library tries to fall back to the nearest supported effect as follows (If an effect is not supported, check for the next):

Tabbed -> Mica -> Acrylic -> Transparent

Aero is dropped as it is much more transparent than Tabbed or Mica and not customizable as Acrylic. If Tabbed or Mica falls back to Acrylic or Transparent, high alpha is used with white or black color according to isDarkTheme to emulate these effects.

frameStyle

All the following properties are only supported on Windows 11 or greater and has no effect on other OSes.

  • borderColor: specifies the color of the window border that is running around the window if the window is decorated. This property doesn't support transparency.
  • titleBarColor: specifies the color of the window title bar (caption bar) if the window is decorated. This property doesn't support transparency.
  • captionColor: specifies the color of the window caption (title) text if the window is decorated. This property doesn't support transparency.
  • cornerPreference: specifies the shape of the corners you want. For example, you can use this property to avoid rounded corners in a decorated window or get the corners rounded in an undecorated window.

License

This library is distributed under Apache 2.0 License. See LICENSE for more information.

Contributing

All contributions are welcome. If you are reporting an issue, please use the provided template. If you're planning to contribute to the code, please open an issue first describing what feature you're planning to add or what issue you're planning to fix. This allows better discussion and coordination of efforts. You can also check open issues for bugs/features that needs to be fixed/implemented.

Acknowledgements

  • flutter_acrylic: This library is heavily based on flutter_acrylic.
  • Swing Acrylic: as a reference for the Java implementation of required APIs.

About

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc.

Resources

Code of conduct

Stars

213 stars

Watchers

3 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); })(); GitHub - MayakaApps/ComposeWindowStyler: Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc. · GitHub
Skip to content

Repository files navigation


Logo

Compose Window Styler

Compose Window StylerGitHub starsGitHub licenseMaven CentralSonatype Nexus (Snapshots)Twitter

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica, ...etc.


Demo Screenshot


Setup (Gradle)

repositories {
mavenCentral()
// Add only if you're using snapshot version
maven("https://s01.oss.sonatype.org/content/repositories/snapshots/")
}
dependencies {
implementation("com.mayakapps.compose:window-styler:<version>")
}

Don't forget to replace <version> with the latest/desired version found on the badges above.

Usage

You can apply the desired style to your window by using WindowStyle inside the WindowScope of Window or similar composable calls. It can be placed anywhere inside them.

Sample Code:

Window(onCloseRequest = ::exitApplication) {
WindowStyle(
isDarkTheme = isDarkTheme,
backdropType = backdropType,
frameStyle =WindowFrameStyle(cornerPreference =WindowCornerPreference.NOT_ROUNDED),
)
App()
}

Documentation

See documentation here

Available Styles

isDarkTheme

This property should match the theming system used in your application. Its effect depends on the used backdrop as follows:

  • If the backdropType is WindowBackdrop.Mica or WindowBackdrop.Tabbed, it is used to manage the color of the background whether it is light or dark.
  • Otherwise, it is used to control the color of the title bar of the window white/black.

backdropType

  • WindowBackdrop.Default: Though its name may imply that the window will be left unchanged, this is not the case as once the transparency is hacked into the window, it can't be reverted. So, this effect provides a simple solid backdrop colored as white or black according to isDarkTheme. This allows the backdrop to blend with the title bar as well.
  • WindowBackdrop.Solid(val color: Color): This applies the color as a solid background which means that any alpha component is ignored and the color is rendered as opaque.
  • WindowBackdrop.Transparent: This makes the window fully transparent.
  • WindowBackdrop.Transparent(val color: Color): Same as Solid but allows transparency taking into account the alpha value. If the passed color is fully opaque, the alpha is set to 0.5F.
  • WindowBackdrop.Aero: This applies Aero backdrop which is Windows Vista and Windows 7 version of blur. This effect doesn't allow any customization.
  • WindowBackdrop.Acrylic(val color: Color): This applies Acrylic backdrop blended with the supplied color. If the backdrop is rendered opaque, double check that color has a reasonable alpha value. Supported on Windows 10 version 1803 or greater.
  • WindowBackdrop.Mica: This applies Mica backdrop themed according to isDarkTheme value. Supported on Windows 11 21H2 or greater.
  • WindowBackdrop.Tabbed: This applies Tabbed backdrop themed according to isDarkTheme value. This is a backdrop that is similar to Mica but targeted at tabbed windows. Supported on Windows 11 22H2 or greater.

Fallback Strategy

In case of unsupported effect the library tries to fall back to the nearest supported effect as follows (If an effect is not supported, check for the next):

Tabbed -> Mica -> Acrylic -> Transparent

Aero is dropped as it is much more transparent than Tabbed or Mica and not customizable as Acrylic. If Tabbed or Mica falls back to Acrylic or Transparent, high alpha is used with white or black color according to isDarkTheme to emulate these effects.

frameStyle

All the following properties are only supported on Windows 11 or greater and has no effect on other OSes.

  • borderColor: specifies the color of the window border that is running around the window if the window is decorated. This property doesn't support transparency.
  • titleBarColor: specifies the color of the window title bar (caption bar) if the window is decorated. This property doesn't support transparency.
  • captionColor: specifies the color of the window caption (title) text if the window is decorated. This property doesn't support transparency.
  • cornerPreference: specifies the shape of the corners you want. For example, you can use this property to avoid rounded corners in a decorated window or get the corners rounded in an undecorated window.

License

This library is distributed under Apache 2.0 License. See LICENSE for more information.

Contributing

All contributions are welcome. If you are reporting an issue, please use the provided template. If you're planning to contribute to the code, please open an issue first describing what feature you're planning to add or what issue you're planning to fix. This allows better discussion and coordination of efforts. You can also check open issues for bugs/features that needs to be fixed/implemented.

Acknowledgements

  • flutter_acrylic: This library is heavily based on flutter_acrylic.
  • Swing Acrylic: as a reference for the Java implementation of required APIs.

About

Compose Window Styler is a library that lets you style your Compose for Desktop window to have more native and modern UI. This includes styling the window to use acrylic, mica ...etc.

Resources

Code of conduct

Stars

213 stars

Watchers

3 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages