Skip to content

Commit bc84cc5

Browse files
authoredJan 21, 2021
Merge pull request android#358 from android/jv/js_lazy
[Jetnews] Migrate to LazyColumn and LazyRow
2 parents 87f862e + 11260e4 commit bc84cc5

File tree

3 files changed

+50
-43
lines changed

3 files changed

+50
-43
lines changed
 

‎JetNews/app/src/main/java/com/example/jetnews/ui/article/PostContent.kt

Lines changed: 29 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@
1717
package com.example.jetnews.ui.article
1818

1919
import androidx.compose.foundation.Image
20-
import androidx.compose.foundation.ScrollableColumn
2120
import androidx.compose.foundation.background
2221
import androidx.compose.foundation.layout.Box
2322
import androidx.compose.foundation.layout.Column
@@ -29,6 +28,7 @@ import androidx.compose.foundation.layout.padding
2928
import androidx.compose.foundation.layout.preferredHeight
3029
import androidx.compose.foundation.layout.preferredSize
3130
import androidx.compose.foundation.layout.preferredWidth
31+
import androidx.compose.foundation.lazy.LazyColumn
3232
import androidx.compose.foundation.shape.CircleShape
3333
import androidx.compose.material.AmbientContentAlpha
3434
import androidx.compose.material.AmbientContentColor
@@ -75,27 +75,39 @@ private val defaultSpacerSize = 16.dp
7575

7676
@Composable
7777
fun PostContent(post: Post, modifier: Modifier = Modifier) {
78-
ScrollableColumn(
78+
LazyColumn(
7979
modifier = modifier.padding(horizontal = defaultSpacerSize)
8080
) {
81-
Spacer(Modifier.preferredHeight(defaultSpacerSize))
82-
PostHeaderImage(post)
83-
Text(text = post.title, style = MaterialTheme.typography.h4)
84-
Spacer(Modifier.preferredHeight(8.dp))
81+
item {
82+
Spacer(Modifier.preferredHeight(defaultSpacerSize))
83+
PostHeaderImage(post)
84+
}
85+
item {
86+
Text(text = post.title, style = MaterialTheme.typography.h4)
87+
Spacer(Modifier.preferredHeight(8.dp))
88+
}
8589
post.subtitle?.let { subtitle ->
86-
Providers(AmbientContentAlpha provides ContentAlpha.medium) {
87-
Text(
88-
text = subtitle,
89-
style = MaterialTheme.typography.body2,
90-
lineHeight = 20.sp
91-
)
90+
item {
91+
Providers(AmbientContentAlpha provides ContentAlpha.medium) {
92+
Text(
93+
text = subtitle,
94+
style = MaterialTheme.typography.body2,
95+
lineHeight = 20.sp
96+
)
97+
}
98+
Spacer(Modifier.preferredHeight(defaultSpacerSize))
9299
}
93-
Spacer(Modifier.preferredHeight(defaultSpacerSize))
94100
}
95-
PostMetadata(post.metadata)
96-
Spacer(Modifier.preferredHeight(24.dp))
97-
PostContents(post.paragraphs)
98-
Spacer(Modifier.preferredHeight(48.dp))
101+
item {
102+
PostMetadata(post.metadata)
103+
Spacer(Modifier.preferredHeight(24.dp))
104+
}
105+
items(post.paragraphs) {
106+
Paragraph(paragraph = it)
107+
}
108+
item {
109+
Spacer(Modifier.preferredHeight(48.dp))
110+
}
99111
}
100112
}
101113

@@ -139,13 +151,6 @@ private fun PostMetadata(metadata: Metadata) {
139151
}
140152
}
141153

142-
@Composable
143-
private fun PostContents(paragraphs: List<Paragraph>) {
144-
paragraphs.forEach {
145-
Paragraph(paragraph = it)
146-
}
147-
}
148-
149154
@Composable
150155
private fun Paragraph(paragraph: Paragraph) {
151156
val (textStyle, paragraphStyle, trailingPadding) = paragraph.type.getTextAndParagraphStyle()

‎JetNews/app/src/main/java/com/example/jetnews/ui/home/HomeScreen.kt

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,15 @@
1616

1717
package com.example.jetnews.ui.home
1818

19-
import androidx.compose.foundation.ScrollableColumn
20-
import androidx.compose.foundation.ScrollableRow
2119
import androidx.compose.foundation.clickable
2220
import androidx.compose.foundation.layout.Box
2321
import androidx.compose.foundation.layout.Column
2422
import androidx.compose.foundation.layout.fillMaxSize
2523
import androidx.compose.foundation.layout.padding
2624
import androidx.compose.foundation.layout.preferredSize
2725
import androidx.compose.foundation.layout.wrapContentSize
26+
import androidx.compose.foundation.lazy.LazyColumn
27+
import androidx.compose.foundation.lazy.LazyRow
2828
import androidx.compose.foundation.shape.CircleShape
2929
import androidx.compose.material.CircularProgressIndicator
3030
import androidx.compose.material.Divider
@@ -292,11 +292,11 @@ private fun PostList(
292292
val postsPopular = posts.subList(2, 7)
293293
val postsHistory = posts.subList(7, 10)
294294

295-
ScrollableColumn(modifier = modifier) {
296-
PostListTopSection(postTop, navigateTo)
297-
PostListSimpleSection(postsSimple, navigateTo, favorites, onToggleFavorite)
298-
PostListPopularSection(postsPopular, navigateTo)
299-
PostListHistorySection(postsHistory, navigateTo)
295+
LazyColumn(modifier = modifier) {
296+
item { PostListTopSection(postTop, navigateTo) }
297+
item { PostListSimpleSection(postsSimple, navigateTo, favorites, onToggleFavorite) }
298+
item { PostListPopularSection(postsPopular, navigateTo) }
299+
item { PostListHistorySection(postsHistory, navigateTo) }
300300
}
301301
}
302302

@@ -374,8 +374,8 @@ private fun PostListPopularSection(
374374
style = MaterialTheme.typography.subtitle1
375375
)
376376

377-
ScrollableRow(modifier = Modifier.padding(end = 16.dp)) {
378-
posts.forEach { post ->
377+
LazyRow(modifier = Modifier.padding(end = 16.dp)) {
378+
items(posts) { post ->
379379
PostCardPopular(post, navigateTo, Modifier.padding(start = 16.dp, bottom = 16.dp))
380380
}
381381
}

‎JetNews/app/src/main/java/com/example/jetnews/ui/interests/InterestsScreen.kt

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,13 +17,13 @@
1717
package com.example.jetnews.ui.interests
1818

1919
import androidx.compose.foundation.Image
20-
import androidx.compose.foundation.ScrollableColumn
2120
import androidx.compose.foundation.layout.Box
2221
import androidx.compose.foundation.layout.Column
2322
import androidx.compose.foundation.layout.Row
2423
import androidx.compose.foundation.layout.Spacer
2524
import androidx.compose.foundation.layout.padding
2625
import androidx.compose.foundation.layout.preferredSize
26+
import androidx.compose.foundation.lazy.LazyColumn
2727
import androidx.compose.foundation.selection.toggleable
2828
import androidx.compose.foundation.shape.RoundedCornerShape
2929
import androidx.compose.material.Divider
@@ -287,8 +287,8 @@ private fun TabWithTopics(
287287
selectedTopics: Set<String>,
288288
onTopicSelect: (String) -> Unit
289289
) {
290-
ScrollableColumn(modifier = Modifier.padding(top = 16.dp)) {
291-
topics.forEach { topic ->
290+
LazyColumn(modifier = Modifier.padding(top = 16.dp)) {
291+
items(topics) { topic ->
292292
TopicItem(
293293
topic,
294294
selected = selectedTopics.contains(topic)
@@ -311,14 +311,16 @@ private fun TabWithSections(
311311
selectedTopics: Set<TopicSelection>,
312312
onTopicSelect: (TopicSelection) -> Unit
313313
) {
314-
ScrollableColumn {
314+
LazyColumn {
315315
sections.forEach { (section, topics) ->
316-
Text(
317-
text = section,
318-
modifier = Modifier.padding(16.dp),
319-
style = MaterialTheme.typography.subtitle1
320-
)
321-
topics.forEach { topic ->
316+
item {
317+
Text(
318+
text = section,
319+
modifier = Modifier.padding(16.dp),
320+
style = MaterialTheme.typography.subtitle1
321+
)
322+
}
323+
items(topics) { topic ->
322324
TopicItem(
323325
itemTitle = topic,
324326
selected = selectedTopics.contains(TopicSelection(section, topic))

0 commit comments

Comments
 (0)