Markdown (M3) does not scroll in fragment details view (tablet layout)

[johnjohndoe]

Environment

• Samsung Galaxy Tab S7 FE (SM-T733)
• Android 14
• com.mikepenz:multiplatform-markdown-renderer-m3:0.31.0

Context

I want to use com.mikepenz.markdown.m3.Markdown in a details view which is part of a tablet layout.

Observed behavior

When I place the Markdown composable in the fragment ...

class TabletDetailsFragment : Fragment() {

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?) =
        content {
            Screen()
        }
}

@Composable
private fun Screen() {
    Box(
        Modifier
            .verticalScroll(rememberScrollState())
    ) {
//        Text(loremIpsum)
        Markdown(loremIpsum)
    }
}

... then the text is not scrollable.

See this showcase: https://github.com/johnjohndoe/multiplatform-markdown-renderer/tree/tablet_details_scrolling

Expected behavior

The Markdown text scrolls like the androidx.compose.material3.Text text does.

[keta1]

Screenrecorder-2025-02-25-10-51-37-890.mp4

Unable to reproduce this issue

[mikepenz]

@johnjohndoe I feel the problem might be the size of the Box it's unbound and might be larger than the screen, filling the whole space needed for the contents of the scrollable.

Can you please make sure the box matches the size of the fragment.

[keta1]

2025-02-25.20-00-28.mp4

I tested it on the tablet and found that when the resize window, the program performed very terrible

[mikepenz]

the problem with the resizing is likely due to the animation. Disabling that should handle what you see @keta1 - https://github.com/mikepenz/multiplatform-markdown-renderer/blob/develop/multiplatform-markdown-renderer/src/commonMain/kotlin/com/mikepenz/markdown/model/MarkdownAnimations.kt#L29

[keta1]

the problem with the resizing is likely due to the animation. Disabling that should handle what you see @keta1 - https://github.com/mikepenz/multiplatform-markdown-renderer/blob/develop/multiplatform-markdown-renderer/src/commonMain/kotlin/com/mikepenz/markdown/model/MarkdownAnimations.kt#L29

You are right, when the animation is disabled, the twitching of the page disappears

[johnjohndoe]

Indeed, configuring animations to disable them, "quick fixes" the issue:

animations = DefaultMarkdownAnimation(fun Modifier.(): Modifier = this)

[mikepenz]

For you the animation is also the problem @johnjohndoe - did you check the size of the container as well?

[johnjohndoe]

Do you mean checking the heights of the box and fragment at runtime?

[mikepenz]

Yes to verify that the box itself is the size expected, as it seems like the box is larger than it should be and thus the scrolling doesn't work

[johnjohndoe]

I cannot see odd height values for the details_container and Box.

[mikepenz]

Btw. have you tested providing .verticalScroll(rememberScrollState()) directly to the Markdown composable instead of another box wrapping it?

[johnjohndoe]

Thanks for the idea. No improvement in the simplified example though:

@Composable
private fun Screen() {
    Box {
        Markdown(
            modifier = Modifier.verticalScroll(rememberScrollState()),
            content = loremIpsum,
        )
    }
}

Side note: For my use-case it would not apply because the screen structure is more complex.