Screenshot: https://screenshot.googleplex.com/3XqkTwJQwgfoPsT Change-Id: Iac7dc06c84523b4db8d05f538b74a08741d2c347pull/2/head
Manuel Vivo
3 years ago
committed by
Don Turner
parent
de2f07d1a4
commit
3558a6931e
@ -0,0 +1,189 @@
|
||||
/*
|
||||
* Copyright 2022 The Android Open Source Project
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* https://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
package com.google.samples.apps.nowinandroid.feature.following
|
||||
|
||||
import androidx.compose.foundation.clickable
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.foundation.layout.Row
|
||||
import androidx.compose.foundation.layout.Spacer
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.material.Icon
|
||||
import androidx.compose.material.MaterialTheme
|
||||
import androidx.compose.material.Surface
|
||||
import androidx.compose.material.icons.Icons.Filled
|
||||
import androidx.compose.material.icons.filled.Android
|
||||
import androidx.compose.material3.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.res.stringResource
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.Dp
|
||||
import androidx.compose.ui.unit.dp
|
||||
import coil.compose.AsyncImage
|
||||
import com.google.samples.apps.nowinandroid.core.ui.FollowButton
|
||||
import com.google.samples.apps.nowinandroid.core.ui.theme.NiaTheme
|
||||
import com.google.samples.apps.nowinandroid.feature.following.R.string
|
||||
|
||||
@Composable
|
||||
fun FollowingItem(
|
||||
name: String,
|
||||
following: Boolean,
|
||||
topicImageUrl: String,
|
||||
onClick: () -> Unit,
|
||||
onFollowButtonClick: (Boolean) -> Unit,
|
||||
modifier: Modifier = Modifier,
|
||||
iconModifier: Modifier = Modifier,
|
||||
description: String = "",
|
||||
itemSeparation: Dp = 16.dp
|
||||
) {
|
||||
Row(
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
modifier = modifier
|
||||
) {
|
||||
Row(
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
modifier = Modifier
|
||||
.weight(1f)
|
||||
.clickable { onClick() }
|
||||
.padding(vertical = itemSeparation)
|
||||
) {
|
||||
FollowingIcon(topicImageUrl, iconModifier.size(64.dp))
|
||||
Spacer(modifier = Modifier.width(16.dp))
|
||||
InterestContent(name, description)
|
||||
}
|
||||
FollowButton(
|
||||
following = following,
|
||||
onFollowChange = onFollowButtonClick,
|
||||
notFollowingContentDescription = stringResource(
|
||||
id = string.interests_card_follow_button_content_desc
|
||||
),
|
||||
followingContentDescription = stringResource(
|
||||
id = string.interests_card_unfollow_button_content_desc
|
||||
)
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun InterestContent(name: String, description: String, modifier: Modifier = Modifier) {
|
||||
Column(modifier) {
|
||||
Text(
|
||||
text = name,
|
||||
style = MaterialTheme.typography.h5,
|
||||
modifier = Modifier.padding(
|
||||
vertical = if (description.isEmpty()) 0.dp else 4.dp
|
||||
)
|
||||
)
|
||||
if (description.isNotEmpty()) {
|
||||
Text(
|
||||
text = description,
|
||||
style = MaterialTheme.typography.body2
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun FollowingIcon(topicImageUrl: String, modifier: Modifier = Modifier) {
|
||||
if (topicImageUrl.isEmpty()) {
|
||||
Icon(
|
||||
imageVector = Filled.Android,
|
||||
tint = Color.Magenta,
|
||||
contentDescription = null,
|
||||
modifier = modifier
|
||||
)
|
||||
} else {
|
||||
AsyncImage(
|
||||
model = topicImageUrl,
|
||||
contentDescription = null,
|
||||
modifier = modifier
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Preview
|
||||
@Composable
|
||||
private fun FollowingCardPreview() {
|
||||
NiaTheme {
|
||||
Surface {
|
||||
FollowingItem(
|
||||
name = "Compose",
|
||||
description = "Description",
|
||||
following = false,
|
||||
topicImageUrl = "",
|
||||
onClick = { },
|
||||
onFollowButtonClick = { }
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Preview
|
||||
@Composable
|
||||
private fun FollowingCardLongNamePreview() {
|
||||
NiaTheme {
|
||||
Surface {
|
||||
FollowingItem(
|
||||
name = "This is a very very very very long name",
|
||||
description = "Description",
|
||||
following = true,
|
||||
topicImageUrl = "",
|
||||
onClick = { },
|
||||
onFollowButtonClick = { }
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Preview
|
||||
@Composable
|
||||
private fun FollowingCardLongDescriptionPreview() {
|
||||
NiaTheme {
|
||||
Surface {
|
||||
FollowingItem(
|
||||
name = "Compose",
|
||||
description = "This is a very very very very very very very " +
|
||||
"very very very long description",
|
||||
following = false,
|
||||
topicImageUrl = "",
|
||||
onClick = { },
|
||||
onFollowButtonClick = { }
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Preview
|
||||
@Composable
|
||||
private fun FollowingCardWithEmptyDescriptionPreview() {
|
||||
NiaTheme {
|
||||
Surface {
|
||||
FollowingItem(
|
||||
name = "Compose",
|
||||
description = "",
|
||||
following = true,
|
||||
topicImageUrl = "",
|
||||
onClick = { },
|
||||
onFollowButtonClick = { }
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,77 @@
|
||||
/*
|
||||
* Copyright 2022 The Android Open Source Project
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* https://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
package com.google.samples.apps.nowinandroid.feature.following
|
||||
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.lazy.LazyColumn
|
||||
import androidx.compose.foundation.shape.CircleShape
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.draw.clip
|
||||
import androidx.compose.ui.unit.dp
|
||||
import com.google.samples.apps.nowinandroid.core.model.data.FollowableAuthor
|
||||
import com.google.samples.apps.nowinandroid.core.model.data.FollowableTopic
|
||||
|
||||
@Composable
|
||||
fun TopicsTabContent(
|
||||
topics: List<FollowableTopic>,
|
||||
onTopicClick: (Int) -> Unit,
|
||||
onFollowButtonClick: (Int, Boolean) -> Unit,
|
||||
modifier: Modifier = Modifier
|
||||
) {
|
||||
LazyColumn(
|
||||
modifier = modifier.padding(horizontal = 16.dp)
|
||||
) {
|
||||
topics.forEach { followableTopic ->
|
||||
item {
|
||||
FollowingItem(
|
||||
name = followableTopic.topic.name,
|
||||
following = followableTopic.isFollowed,
|
||||
description = followableTopic.topic.shortDescription,
|
||||
topicImageUrl = followableTopic.topic.imageUrl,
|
||||
onClick = { onTopicClick(followableTopic.topic.id) },
|
||||
onFollowButtonClick = { onFollowButtonClick(followableTopic.topic.id, it) }
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
fun AuthorsTabContent(
|
||||
authors: List<FollowableAuthor>,
|
||||
onAuthorClick: () -> Unit,
|
||||
onFollowButtonClick: (Int, Boolean) -> Unit,
|
||||
modifier: Modifier = Modifier
|
||||
) {
|
||||
LazyColumn(
|
||||
modifier = modifier.padding(horizontal = 16.dp)
|
||||
) {
|
||||
authors.forEach { followableTopic ->
|
||||
item {
|
||||
FollowingItem(
|
||||
name = followableTopic.author.name,
|
||||
following = followableTopic.isFollowed,
|
||||
topicImageUrl = followableTopic.author.imageUrl,
|
||||
onClick = onAuthorClick,
|
||||
onFollowButtonClick = { onFollowButtonClick(followableTopic.author.id, it) },
|
||||
iconModifier = Modifier.clip(CircleShape)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in new issue