icerockdev / moko-widgets

Multiplatform UI DSL with screen management in common code for mobile (android & ios) Kotlin Multiplatform development
https://moko.icerock.dev
Apache License 2.0
387 stars 32 forks source link

Disable scroll from ListWidget #261

Open Diy2210 opened 4 years ago

Diy2210 commented 4 years ago

How disable scroll from ListWidget inside Scroll Code: scroll( id = Ids.RootScroll, size = AsParent, child = linear( id = Ids.RootLinearId, size = WidthAsParentHeightWrapContent ) { ... }

Снимок экрана 2020-07-10 в 17 34 22

My ListWidget inside Constraint: Снимок экрана 2020-07-10 в 17 34 03

I try change Size from List but scroll is enabled too.

Server Status Block: Снимок экрана 2020-07-10 в 17 33 00 Снимок экрана 2020-07-10 в 17 32 40

Dorofeev commented 4 years ago

I'm not sure that it is possible with ListWidget inside ScrollWidget. But I think, you can rework screen and make it with just one big list, except of scroll with linear. It would be better solution for screen with dynamic data. And this will resolve problems with scroll inside scroll.

Diy2210 commented 4 years ago

I fixed it by changing the blocks in some places down!

Diy2210 commented 4 years ago

But I think this is bug, if container dont change size.

kkalisz commented 4 years ago

Basically you should avoid nesting containers with scroll support. https://developer.android.com/reference/android/widget/ScrollView

Never add a RecyclerView or ListView to a scroll view. Doing so results in poor user interface performance and a poor user experience.

For vertical scrolling, consider NestedScrollView instead of scroll view which offers greater user interface flexibility and support for the material design scrolling patterns.

Maybe you can consider adding NestedScrollView support.

Alex009 commented 4 years ago

hi, @Diy2210

in your case you should not use ScrollWidget with child ListWidget. You can achive required result with ListWidget - just use multiple UnitItems.

this your screen: screen

can be built from units like:

val headers = listOf(
    BasicItem(title = "System date".desc(), value = date.desc()),
    BasicItem(title = "Updates".desc(), value = "available 29".desc()),    
    HeaderItem(title = "Disk Usage".desc())
)
val disksUsage = disks.map { disk ->
    DiskUsageItem(name = disk.map { it.name.desc() }, available = disk.map { "${it.available} %".desc() }, space = disk.map { it.space }
}
val serverStatus = statuses.map { status ->
    ....
}
val softwareVersions = versions.map { version ->
    ....
}
viewModel.listUnits.value = headers
    .plus(DiskUsageHeaderItem()),
    .plus(disksUsage),
    .plus(HeaderItem(title = "Server status")),
    .plus(serverStatus),
    .plus(HeaderItem(title = "Software versions")),
    .plus(softwareVersions)

and in screen just observe in ListWidget - viewModel.listUnits