Crash Fatal Exception: java.lang.IllegalArgumentException The width of the balloon must bigger than zero.

[kostapostolakis]

Please complete the following information:

• Library Version: com.github.skydoves:balloon-compose:1.6.5
• Affected Device(s):

Describe the Bug: I have a crash reported in Firebase. I cannot reproduce it. Attached the stacktrace from firebase. balloon crash stacktrace.txt

I have created this reusable view:

@Composable
fun SimpleTooltip(
    context: Context,
    showTooltip: Boolean = false,
    onTooltipDismiss: (() -> Unit)? = null,
    selectedElement: @Composable () -> Unit = {}
) {
    Balloon(
        balloonContent = {
            // Tooltip UI
        },
        builder = rememberBalloonBuilder {
            setWidth(BalloonSizeSpec.WRAP)
            setHeight(BalloonSizeSpec.WRAP)

            setArrowSize(10)
            setArrowPositionRules(ArrowPositionRules.ALIGN_ANCHOR)
            setArrowPosition(0.5f)

            setMarginHorizontal(8)

            setPadding(12)
            setCornerRadius(16f)
            setBackgroundColor(SharedRes.colors.surface.getColor(context))
            setBalloonAnimation(BalloonAnimation.ELASTIC)

            setIsVisibleOverlay(true)
            setOverlayColor(Color(SharedRes.colors.background.getColor(context)).copy(0.8f))
            setOverlayPadding(16f)

            setBalloonHighlightAnimation(BalloonHighlightAnimation.SHAKE)
            setOverlayShape(BalloonOverlayCircle(100f))
            setDismissWhenClicked(true)
        }
    ) { balloonWindow ->
        selectedElement.invoke()

        if (showTooltip) {
            balloonWindow.setOnBalloonDismissListener {
                onTooltipDismiss?.invoke()
            }

            balloonWindow.showAlignBottom()
        }
    }
}

Expected Behavior: The app should not crash.

If that helps, all the crashes have been mentioned as "Early crashes", that means that they have occurred at the first 2" of the app launch. But the strange thing is that the class name is not from the name of the main Activity. 🤔

[skydoves]

Hey @kostapostolakis, I don't think calling showAlignBottom function directly inside the content, because it can try to display balloon before completely initializing it. Give it a try below or add some delays using the delay(100) method.

        ) { balloonWindow ->

          LaunchedEffect(Unit) {
            balloonWindow.awaitAlignBottom()
          }

[kostapostolakis]

Oh I see. If I call it inside "onBalloonWindowInitialized"?

[kostapostolakis]

Trying this also crashes.

    var balloonWindow: BalloonWindow? by remember { mutableStateOf(null) }

    val builder = rememberBalloonBuilder {
        ...
    }

    Balloon(
        balloonContent = {
            ...
        },
        onBalloonWindowInitialized = { balloonWindow = it },
        builder = builder,
        content = {
            selectedElement.invoke()

            balloonWindow?.showAlignStart()
        }
    )

[skydoves]

@kostapostolakis would you try with the solution below?

      content = { balloonWindow ->
  
          LaunchedEffect(Unit) {
           delay(100) // remove or not
            balloonWindow.showAlignStart()
          }
     }

[kostapostolakis]

Your solution didn't work. Any other ideas?

[skydoves]

Would you able to provide the composable functions inside the balloonContent lambda?

[kostapostolakis]

I use it in many places, having something like this:

IconButton(onClick = { mainGameViewModel.showInstructions() }) {
                    Icon(
                        modifier = Modifier.size(24.dp),
                        painter = painterResource(id = SharedRes.images.outline_info_black_24.drawableResId),
                        contentDescription = null,
                        tint = getKmmColor(id = SharedRes.colors.primaryVariant)
                    )
                }

Or something like this:

FloatingActionButton(
                    backgroundColor = getKmmColor(id = SharedRes.colors.secondary),
                    onClick = { mainGameViewModel.showCharacterDetailsButtonTapped() }
                ) {
                    Icon(
                        modifier = Modifier.size(24.dp),
                        painter = painterResource(mainGameViewModel.getFloatingButtonImageForCharacter().drawableResId),
                        contentDescription = null,
                        tint = getKmmColor(id = SharedRes.colors.onSecondary)
                    )
                }

I tried everywhere to set a fixed size, but it did not work.

[skydoves]

Hey @kostapostolakis, I'm really not sure what really makes this issue, since I rarely see this issue on the crash reports. Would you please make a very simple project that reproduce this issue on your side?

[kostapostolakis]

I cannot reproduce the crash. I can only see it in Firebase.

[skydoves]

@kostapostolakis How's the frequency of that issue happens, such as affected device percentages. Does this issue only happens in Android 14 and Xiaomi devices?

[kostapostolakis]

The issue happens at 2-6% of the users. I think the percentage is very high. Below you can find the device models and the operation system that happens and it has variety in both of them.

[skydoves]

@kostapostolakis is there any possibility of the content inside balloonContent can be empty with any conditions or something?

[kostapostolakis]

@skydoves in content there is no possibility. In balloonContent there is a possibility, but it is very difficult. Do you want me to try to upload a new version with not empty balloonContent?

[kostapostolakis]

I think this is the problem. I managed to reproduce the crash when I have no views in balloonContent or the views in the balloonContent has not a specific width (for example a Spacer without specifying the width).

I will upload a new version and I will inform you as soon as possible if the crash is still appearing.

[skydoves]

@skydoves Thanks for your updates. Please keep me updated if the issue is fixed

[kostapostolakis]

It seems that the crash has been resolved. We can close the issue and if it comes again, I will comment again to reopen it. Thank you very much for your support!

[skydoves]

@kostapostolakis I'm happy to help out your team!