-
-
Save nglauber/64df9091c2e76bde648ce48d585ed3e1 to your computer and use it in GitHub Desktop.
package br.com.nglauber.jetpackcomposeplayground.screens | |
import androidx.compose.foundation.background | |
import androidx.compose.foundation.layout.* | |
import androidx.compose.foundation.lazy.LazyColumn | |
import androidx.compose.foundation.lazy.LazyRow | |
import androidx.compose.foundation.lazy.items | |
import androidx.compose.foundation.shape.RoundedCornerShape | |
import androidx.compose.material.MaterialTheme | |
import androidx.compose.material.Text | |
import androidx.compose.runtime.Composable | |
import androidx.compose.ui.Alignment | |
import androidx.compose.ui.Modifier | |
import androidx.compose.ui.graphics.Color | |
import androidx.compose.ui.unit.dp | |
val books = (1..10).map { "Book $it" }.toList() | |
val wishlisted = (1..50).map { "Wishlisted Book $it" } | |
@Composable | |
fun NestedScrollScreen() { | |
LazyColumn( | |
modifier = Modifier.fillMaxSize(), | |
) { | |
// My Books section | |
item { | |
Column(modifier = Modifier.fillMaxWidth()) { | |
Text("My Books", style = MaterialTheme.typography.h4) | |
LazyRow( | |
modifier = Modifier | |
.fillMaxWidth() | |
) { | |
items(books) { item -> | |
Box( | |
modifier = Modifier | |
.padding(4.dp) | |
.height(120.dp) | |
.width(90.dp) | |
.background(color = Color.Gray, shape = RoundedCornerShape(8.dp)) | |
) { | |
Text(item, modifier = Modifier.align(Alignment.Center)) | |
} | |
} | |
} | |
} | |
} | |
item { | |
Text("Whishlisted Books", style = MaterialTheme.typography.h4) | |
} | |
// Turning the list in a list of lists of two elements each | |
items(wishlisted.windowed(2, 2, true)) { sublist -> | |
Row(Modifier.fillMaxWidth()) { | |
sublist.forEach { item -> | |
Text( | |
item, modifier = Modifier | |
.height(120.dp) | |
.padding(4.dp) | |
.background(Color.Yellow) | |
.fillParentMaxWidth(.5f) | |
) | |
} | |
} | |
} | |
} | |
} |
@ma-za-kpe I copied and pasted the code above and worked fine for me... Did you make any change on it?
Hello, so I'm trying to load this https://raw.githubusercontent.com/DevTides/DogsApi/master/dogs.json data into the row. And that's the error I got.
It scrolls fine till the bottom, but at the very end crashes
Ive revereted to using this, val wishlisted = (1..50).map { "Wishlisted Book $it" }
, in the second grid view ... It crushes every time... with the same error
It's not happening here... Which compose version you're using? I'm using 1.2.0-alpha07
, but I don't think it's related to the version...
Oh man!
@ma-za-kpe I implemented your sample accessing the JSON file... it's working for me.
You can see the code in the links below...
https://github.com/nglauber/JetpackComposePlayground/tree/master/app/src/main/java/br/com/nglauber/jetpackcomposeplayground/rest2
https://github.com/nglauber/JetpackComposePlayground/blob/master/app/src/main/java/br/com/nglauber/jetpackcomposeplayground/screens/NestedScrollScreen.kt
Thank you for this...let me give it a go.
FYI: I was able to reproduce your issue when I tried to update my project to the latest version of compose and accompanist (1.2.0-alpha08 and 0.24.7-alpha respectively)
Check here: google/accompanist#1140
I reverted this change and it worked.
This is what i get when i scroll to the bottom