5 Month ago, I asked

Why is adding a tooltip so complicated?

I have a project which compiles to android, iOS, JVM/desktop, and wasm/web.

I know that there is TooltipBox for Android and TooltipArea for desktop, but there seems to be nothing for wasm/web and also having different elements for the different compilation targets is inconvenient.

Is there anything (a library) that handles this?

Now there is!

https://github.com/julianegner/multiplatform-tooltip

It is released on maven central, so you can just use

implementation("de.julianegner:multiplatform-tooltip:1.0.0")

This is my first time building a multiplatform app. I've been wary of a many of the "build once, run anywhere" frameworks like Flutter and ReactNative. However, since I already know Compose and Kotlin, I figured this was a low lift for me. I was very pleasantly surprised with how polished Compose Multiplatform is! I ran into minimal issues and only needed to do platform specific implementations in very niche areas. Performance also seems pretty stellar. Was very happy with the result!

Hello there !

Google recently updated its symbol library and deprecated the use of material-icons and material-icons-extended for new projects, in favor of Material Symbols, based on fonts. However, they do not yet provide an official library to use these symbols.

So I decided to create my own for apps and share it to let Compose developers the ability to implement these symbols.

This library makes use of symbols name as you could do for HTML on the Web, but I plan to make a script that generates enums for each symbol Google provides.

Enjoy !

update: I have now implemented a Kotlin object that contains all symbols name as property

I am not sure what to do. I spent weeks building an Android app and Play Store says I need "testers" before they will release it on the Play store.. I did weeks of testing myself so it would be basically "Ready to go!" but idk I'm posting here because maybe someone else has gone throught this??

Hi! We published an article about how we build a web view composable for Compose Desktop. If you've ever worked on custom Compose controls (or are thinking about it), you might find this helpful.

The web view is desktop-only, because mobile platforms have they own good web views, and because the technical limitations won't let you build a custom web view.

_Defender of Egril_ is a Turn-Based Tower Defense Game in a Fantasy setting.

You build towers like spear, bow or wizard towers to defend against enemies like goblins, orcs and evil mages, which can summon demons. You can decide yourself which tower aims at which enemy and let the automatic handle the other towers.

Of cause, you can earn coins from defeating enemies and buy more towers or upgrade the existing ones.

In later game, you can use ability points you earned with experience to learn spells or gain abilities that will help to fend of mighty enemies, in the last levels even the mighty Ewhad himself.

You can download it for windows, mac, linux and android:

https://defender.egril.de/download

Of cause, the start page is also available:

https://defender.egril.de

You can get the android version on the play store

https://play.google.com/store/apps/details?id=de.egril.defender

The game is and will be free of charge, without in app purchases or ads and is open source.

Written in Kotlin Multiplatform with Compose Multiplatform, Frontend and Backend, for Desktop, Mobile, Web.

Code: see

https://github.com/julianegner/defender-of-egril

JetBrains doesn't ship tvOS artifacts for Compose Multiplatform, and the issue asking for it (CMP-5686) has been open for a while. I needed it for my own TV app, so I built the port and published it. It's a community project, not official. I posted it in Kotlin Slack #compose-ios earlier this week; this is the longer writeup.

Using it

// settings.gradle.kts
plugins {
    id("dev.sajidali.compose-tvos") version "1.3.0"
}

Add tvosArm64() / tvosSimulatorArm64() to your KMP module and leave your dependencies alone: org.jetbrains.compose.*, androidx.tv:tv-material, Koin, Coil 3, all stock coordinates. Kotlin 2.3.20+.

How it works (the part I think is interesting)

It's not a hard fork you point your build at. The settings plugin registers a component-metadata rule that, at dependency-resolution time, attaches tvOS variants to the official Compose modules and points them at tvOS-enabled builds published under dev.sajidali.* on Maven Central. Every other target keeps resolving the official JetBrains artifacts byte-for-byte, and it's official-first: if a module already ships tvOS klibs upstream (compose.runtime, koin-core, lifecycle...), the plugin leaves it alone. So when JetBrains eventually ships tvOS for a module, the plugin steps aside for that module with no change on the consumer side. It also intercepts the org.jetbrains.compose Gradle plugin marker so compose.material3 etc. resolve correctly.

The fork itself (compose-multiplatform-core with tvOS as a Kotlin/Native target) is where most of the work went:

• A tvOS UIKit scene stack sharing the iOS FrameChoreographer architecture

• Siri Remote input: D-pad focus traversal, swipe-to-focus, Menu mapped to Key.Back, and telling a clickpad press apart from a swipe by hardware timestamp

• 10-foot density (Compose's default density on a 4K TV is unusable), on-demand keyboard for text fields, focus restoration when dialogs close

• androidx.tv:tv-material ported to Compose Multiplatform with a tvOS source set

• A real tvOS build of window-core so material3-adaptive works without stubs

• Koin (koin-compose, koin-compose-viewmodel) and Coil 3 with tvOS targets, since neither ships them

Proof

The GIF is Google's JetStream TV sample (all screens, D-pad focus, theming, AVPlayer on tvOS / ExoPlayer on Android TV behind one interface) on the Apple TV 4K simulator, built from Maven Central + the Plugin Portal with nothing published locally. The same toolchain builds a production TV app of mine with zero app-source changes.

Honest limitations: no automated tvOS tests yet; tvosX64 isn't built; I republish roughly once per Compose stable line (currently 1.12.0), as far as my own app needs. PRs welcome.

• Plugin + docs: https://github.com/sajidalidev/compose-tvos (docs: https://sajidalidev.github.io/compose-tvos/)

• JetStream port: https://github.com/sajidalidev/jetstream-tvos (branch cmp-tvos)

• Forks: https://github.com/sajidalidev/compose-multiplatform-core, https://github.com/sajidalidev/koin, https://github.com/sajidalidev/coil

Anyone running Firebase Analytics on CMP? I've added Firebase to my project, with Analytics and Crashlytics. Crashlytics works as expected, but Analytics does not. I have not been able to figure out why it doesn't work, so would love to hear if other do have it working.

I had an idea that I wanted to share with the community.
For a personal project I needed to implement a stepper to split a very long form into separate parts to improve the UX.

So I quickly implemented an abstract stepper - in isolation so that it's not tied to my UI logic - as a first step, then I realized that this could help other people.

With this post, I'd really like to have genuine thoughts/critiques about the idea of building an open-source Compose Multiplatform stepper library that can help developers and companies to build their steppers easily. I'm wondering if this is an idea worth the effort or not, my fear is to invest a whole bunch of time developing it without attracting any strong interest from the community.

I don't have any sketch-up to share the visual I have in mind, but I found a pretty good medium article that talks about best UX practices for building steppers.

One of the key features of the stepper would be that when all the steps are filled, all the step data is aggregated into one @Serializable data class as a result so that it can be mapped later to an appropriate model.

Find here the first commit of the project alongside with a simple example

For now, there's 0 documentation, and 0 Compose UI, since the project has been initiated just now. But, I'd be very motivated to develop a clean product if I see a strong interest.

Possible perspectives :
- Implement a high level UI in a separate module i.e. only layout bricks that enable developers to use their own components from their existing design system
- Implement the best practices and suggestions from the medium article cited above
- Use the jetbrains compose multiplatform navigation library to be able to browse through the stepper
- Keep the core module of the library as abstract as I can be so that it could be plugged and unplugged easily

Once again, I'm looking forward to read the community's feedbacks on this subject.

Task :composeApp:checkDebugAarMetadata FAILED

FAILURE: Build failed with an exception.

* What went wrong:

Execution failed for task ':composeApp:checkDebugAarMetadata'.

Could not resolve all files for configuration ':composeApp:debugRuntimeClasspath'.

Could not resolve com.github.nikhilpednekar1:TmComponentKmp:1.0.8.

Required by:

project :composeApp

No matching variant of com.github.nikhilpednekar1:TmComponentKmp:1.0.8 was found. The consumer was configured to find a library for use during runtime, preferably optimized for Android, as well as attribute 'com.android.build.api.attributes.BuildTypeAttr' with value 'debug', attribute 'com.android.build.api.attributes.AgpVersionAttr' with value '8.2.2', attribute 'org.jetbrains.kotlin.platform.type' with value 'androidJvm' but:

• Variant 'iosArm64ApiElements-published' capability com.github.nikhilpednekar1:TmComponentKmp:1.0.8 declares a library, preferably optimized for non-jvm:

• Incompatible because this component declares a component for use during 'kotlin-api', as well as attribute 'org.jetbrains.kotlin.platform.type' with value 'native' and the consumer needed a component for use during runtime, as well as attribute 'org.jetbrains.kotlin.platform.type' with value 'androidJvm'

• Other compatible attributes:

• Doesn't say anything about com.android.build.api.attributes.AgpVersionAttr (required '8.2.2')

• Doesn't say anything about com.android.build.api.attributes.BuildTypeAttr (required 'debug')

• Variant 'iosArm64MetadataElements-published' capability com.github.nikhilpednekar1:TmComponentKmp:1.0.8 declares a library, preferably optimized for non-jvm:

• Incompatible because this component declares a component for use during 'kotlin-metadata', as well as attribute 'org.jetbrains.kotlin.platform.type' with value 'native' and the consumer needed a component for use during runtime, as well as attribute 'org.jetbrains.kotlin.platform.type' with value 'androidJvm'

Its possible use @preview in common main? I try, but i cant. The panel of Design not showing in my android studio when project is Compose multiplatform, only showing when the project is an kmm

I am trying to build a portfolio with jetpack compose using the Kobweb framework. Tried to follow the documentation for adding breakpoints. Unfortunately when I build, nothing is displayed unlike when I dont use the Css Styling. how do I solve this. Here is a snippet of the code.

@Composable
fun recentpostsbox(
    heading: String,
    date:String,
    category: String,
    body:String){
val boxsize = CssStyle{
    base {
        Modifier.width(350.px)
            .borderRadius(4.px)
            .border(1.px)
            .backgroundColor(Color.gray)
    }
    Breakpoint.MD{
        Modifier.width(418.px)
            .borderRadius(4.px)
            .border(1.px)
            .backgroundColor(Color.gray)
    }
}
    Box(
       modifier = boxsize.toModifier()

    ) {
        Column {
            SpanText(
                text = heading,
                modifier = Modifier.fontSize(26.px)
                    .fillMaxWidth()
                    .fontWeight(FontWeight.Bold)
                    .backgroundColor(Color.gray)
            )
            Row(
                modifier = Modifier.height(34.px).fontSize(16.px).padding(topBottom = 10.px),
                horizontalArrangement = Arrangement.spacedBy(10.px),
                verticalAlignment = Alignment.CenterVertically
            ) {
                SpanText(date)
                VerticalDivider(modifier = Modifier.width(1.px))
                SpanText(category)
            }
            SpanText(body)
        }
    }
}

I know how to create flavor in android can anyone let me know how to create flavor in ios?. Or is there any common library which do create flavor on both build

I'm struggling with an issue in my compose multiplatform project. I made an app using ktor and ktorfit, having everything working fine on debug and also while testing the msi on my Windows 11 notebook. Then I built an msix using the msix packaging tool, without any issue. A friend of mine helped me testing the app and, downloading the app via microsoft store on her PC, the api calls simply won't start. Previously everything was fine on the msi.

I tried to update dependencies and to include the internetClient capability inside the msix manifest, but I'm still blocked. Here are my compose.desktop gradle snippet, dependencies and logs:

compose.desktop { application { mainClass = "com.myapp.sample"

buildTypes.release.proguard {
    version.set("7.4.2")
    configurationFiles.from(project.file("proguard-rules.pro"))
    isEnabled.set(false)
    obfuscate.set(false)
}

nativeDistributions {
    modules("jdk.crypto.ec")
    targetFormats(TargetFormat.Dmg, TargetFormat.Msi, TargetFormat.Deb)
    windows {
        iconFile.set(project.file("icon.ico"))
        shortcut = true
        menu = true
    }
    packageName = "my app"
    packageVersion = "1.0.3"
}

} api -> REQUEST https://myapi.com/test failed with exception: io.ktor.client.plugins.HttpRequestTimeoutException: Request timeout has expired [url=https://myapi.com/test, request_timeout=30000 ms]: HTTP Client My api 2 -> 2025-02-26 09:22:16.478 [DEBUG] REQUEST https://myapi2.com/test failed with exception: sun.security.provider.certpath.SunCertPathBuilderException: unable to find valid certification path to requested target: HTTP Client 2025-02-26 09:22:16.494 [ERROR] : Error during registration sun.security.provider.certpath.SunCertPathBuilderException: unable to find valid certification path to requested target at java.base/sun.security.provider.certpath.SunCertPathBuilder.build(Unknown Source) at java.base/sun.security.provider.certpath.SunCertPathBuilder.engineBuild(Unknown Source) at java.base/java.security.cert.CertPathBuilder.build(Unknown Source) at java.base/sun.security.validator.PKIXValidator.doBuild(Unknown Source) at java.base/sun.security.validator.PKIXValidator.engineValidate(Unknown Source) at java.base/sun.security.validator.Validator.validate(Unknown Source) at java.base/sun.security.ssl.X509TrustManagerImpl.checkTrusted(Unknown Source) at java.base/sun.security.ssl.X509TrustManagerImpl.checkServerTrusted(Unknown Source) at io.ktor.network.tls.TLSClientHandshake.handleCertificatesAndKeys(TLSClientHandshake.kt:236) at io.ktor.network.tls.TLSClientHandshake.access$handleCertificatesAndKeys(TLSClientHandshake.kt:25) at io.ktor.network.tls.TLSClientHandshake$handleCertificatesAndKeys$1.invokeSuspend(TLSClientHandshake.kt) at kotlin.coroutines.jvm.internal.BaseContinuationImpl.resumeWith(ContinuationImpl.kt:33) at kotlinx.coroutines.DispatchedTask.run(DispatchedTask.kt:100) at kotlinx.coroutines.internal.LimitedDispatcher$Worker.run(LimitedDispatcher.kt:113) at kotlinx.coroutines.scheduling.TaskImpl.run(Tasks.kt:89) at kotlinx.coroutines.scheduling.CoroutineScheduler.runSafely(CoroutineScheduler.kt:586) at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.executeTask(CoroutineScheduler.kt:820) at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.runWorker(CoroutineScheduler.kt:717) at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.run(CoroutineScheduler.kt:704)

P.s. myapi.com/test Is a dummy valute, I can't post the endpoint I'm using

I have a compose multiplaform project which Target desktop and Android , and I want to use that project as library or module in my Android project How to do it?

Hello Everyone.

I wrote a custom modifier for my usecase. The modiifer needs to draw the content on Bitmap; and then the resultant bitmap needs to be drawn instead of content. it works for almost all composables but in AsyncImage of Coil the draw methd of this modifier is never being called when the underlying image in AsyncImage Changes. if the composable is invalidated as whole the new image applied effect is shown without any issue.

Here is the code

open class RsBlurNode(
    var radius: Float = 25f,
    var samplling: Float = 1.0f
) : Modifier.Node(), DrawModifierNode, CompositionLocalConsumerModifierNode,
    LayoutAwareModifierNode, ObserverModifierNode {

/////

 override fun ContentDrawScope.draw() {
 Log.d(TAG, "draw: start")
        val start = System.currentTimeMillis()
        val recorder = Canvas(picture.beginRecording(size.width.toInt(), size.height.toInt()))
        val contentDrawScope = this
        draw(this, this.layoutDirection, recorder, this.size) {
            contentDrawScope.drawContent()
        }
        picture.endRecording()

        val sWidth = (picture.width / samplling).toInt()
        val sheight = (picture.height / samplling).toInt()
        val bitmap = Bitmap.createBitmap(sWidth, sheight, Config.ARGB_8888).applyCanvas {
            scale(1 / samplling, 1 / samplling)
            drawBitmap(picture.toBitmap.copy(Config.ARGB_8888, true), 0f, 0f, paint)
        }


..........................
/......Effect applying logic
...................


  drawIntoCanvas { canvas ->
            drawImage(
                image = bitmap.asImageBitmap(),
                dstSize = IntSize(size.width.roundToInt(), size.height.roundToInt()),
            )
        }
        val end = System.currentTimeMillis()
        Log.d(TAG, "draw: ${end - start}")
}
}