From 36804a43bc69bc72f6c8cea78ac0bf1b34de8dc4 Mon Sep 17 00:00:00 2001 From: Harsh Shandilya Date: Fri, 25 Sep 2020 01:55:01 +0530 Subject: [PATCH 1/3] app: re-enable preview for LobstersItem Signed-off-by: Harsh Shandilya --- app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt | 2 ++ 1 file changed, 2 insertions(+) diff --git a/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt b/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt index 69530765..3846a816 100644 --- a/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt +++ b/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt @@ -16,6 +16,7 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp +import androidx.ui.tooling.preview.Preview import dev.msfjarvis.lobsters.model.LobstersPost import dev.msfjarvis.lobsters.model.Submitter @@ -61,6 +62,7 @@ fun LazyItemScope.LobstersItem( } @Composable +@Preview fun PreviewLobstersItem() { val post = LobstersPost( "zqyydb", From b68eda30511d66a94800416c8040381d0543d3e8 Mon Sep 17 00:00:00 2001 From: Harsh Shandilya Date: Fri, 25 Sep 2020 02:04:33 +0530 Subject: [PATCH 2/3] app: tweak padding for tags and add border Signed-off-by: Harsh Shandilya --- app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt b/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt index 3846a816..d57ec967 100644 --- a/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt +++ b/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt @@ -1,7 +1,9 @@ package dev.msfjarvis.lobsters.ui +import androidx.compose.foundation.BorderStroke import androidx.compose.foundation.Text import androidx.compose.foundation.background +import androidx.compose.foundation.border import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column @@ -46,8 +48,9 @@ fun LazyItemScope.LobstersItem( Text( text = tag, modifier = Modifier + .border(BorderStroke(1.dp, Color.Gray)) .background(Color(0xFFFFFCD7), RoundedCornerShape(4.dp)) - .padding(4.dp), + .padding(vertical = 2.dp, horizontal = 4.dp), color = Color.DarkGray, ) } From a14484583da05263fff85c71be393f652e5fb5d8 Mon Sep 17 00:00:00 2001 From: Harsh Shandilya Date: Fri, 25 Sep 2020 02:25:47 +0530 Subject: [PATCH 3/3] app: use ConstraintLayout for laying out LobstersItem Signed-off-by: Harsh Shandilya --- .../dev/msfjarvis/lobsters/ui/LobstersItem.kt | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt b/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt index d57ec967..f337b6d5 100644 --- a/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt +++ b/app/src/main/java/dev/msfjarvis/lobsters/ui/LobstersItem.kt @@ -6,7 +6,7 @@ import androidx.compose.foundation.background import androidx.compose.foundation.border import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Arrangement -import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.ConstraintLayout import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.padding import androidx.compose.foundation.lazy.LazyColumnFor @@ -33,15 +33,21 @@ fun LazyItemScope.LobstersItem( .fillParentMaxWidth() .clickable(onClick = { onClick.invoke(post) }), text = { - Column { + ConstraintLayout { + val (title, tags, submitter) = createRefs() Text( text = post.title, color = Color(0xFF7395D9), fontWeight = FontWeight.Bold, - modifier = Modifier.padding(top = 4.dp) + modifier = Modifier.padding(top = 4.dp).constrainAs(title) { + top.linkTo(parent.top) + start.linkTo(parent.start) + } ) Row( - modifier = Modifier.padding(vertical = 8.dp), + modifier = Modifier.padding(vertical = 8.dp).constrainAs(tags) { + top.linkTo(title.bottom) + }, horizontalArrangement = Arrangement.spacedBy(8.dp), ) { post.tags.forEach { tag -> @@ -57,7 +63,9 @@ fun LazyItemScope.LobstersItem( } Text( text = "submitted by ${post.submitterUser.username}", - modifier = Modifier.padding(bottom = 4.dp), + modifier = Modifier.padding(bottom = 4.dp).constrainAs(submitter) { + top.linkTo(tags.bottom) + }, ) } }