-
Notifications
You must be signed in to change notification settings - Fork 6
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
UserInfoSheet: Show user info in a bottom sheet
Signed-off-by: Aayush Gupta <aayushgupta219@gmail.com>
- Loading branch information
1 parent
bd49be9
commit d02051d
Showing
8 changed files
with
196 additions
and
124 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
111 changes: 0 additions & 111 deletions
111
app/src/main/java/io/aayush/relabs/ui/components/UserHeader.kt
This file was deleted.
Oops, something went wrong.
145 changes: 145 additions & 0 deletions
145
app/src/main/java/io/aayush/relabs/ui/components/UserInfoSheet.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,145 @@ | ||
| package io.aayush.relabs.ui.components | ||
|
|
||
| import android.os.Build | ||
| import androidx.compose.foundation.Image | ||
| import androidx.compose.foundation.background | ||
| import androidx.compose.foundation.isSystemInDarkTheme | ||
| import androidx.compose.foundation.layout.Arrangement | ||
| import androidx.compose.foundation.layout.Box | ||
| import androidx.compose.foundation.layout.Column | ||
| import androidx.compose.foundation.layout.Row | ||
| import androidx.compose.foundation.layout.Spacer | ||
| import androidx.compose.foundation.layout.fillMaxWidth | ||
| import androidx.compose.foundation.layout.height | ||
| import androidx.compose.foundation.layout.padding | ||
| import androidx.compose.foundation.layout.requiredSize | ||
| import androidx.compose.foundation.layout.width | ||
| import androidx.compose.foundation.shape.CircleShape | ||
| import androidx.compose.foundation.shape.RoundedCornerShape | ||
| import androidx.compose.material.icons.Icons | ||
| import androidx.compose.material.icons.filled.Share | ||
| import androidx.compose.material3.ExperimentalMaterial3Api | ||
| import androidx.compose.material3.IconButton | ||
| import androidx.compose.material3.MaterialTheme | ||
| import androidx.compose.material3.ModalBottomSheet | ||
| import androidx.compose.material3.SheetState | ||
| import androidx.compose.material3.Text | ||
| import androidx.compose.runtime.Composable | ||
| import androidx.compose.ui.Alignment | ||
| import androidx.compose.ui.Modifier | ||
| import androidx.compose.ui.draw.clip | ||
| import androidx.compose.ui.graphics.Color | ||
| import androidx.compose.ui.graphics.ColorFilter | ||
| import androidx.compose.ui.layout.ContentScale | ||
| import androidx.compose.ui.platform.LocalContext | ||
| import androidx.compose.ui.res.painterResource | ||
| import androidx.compose.ui.text.font.FontWeight | ||
| import androidx.compose.ui.text.style.TextAlign | ||
| import androidx.compose.ui.unit.dp | ||
| import androidx.compose.ui.unit.sp | ||
| import coil.ImageLoader | ||
| import coil.compose.SubcomposeAsyncImage | ||
| import coil.decode.GifDecoder | ||
| import coil.decode.ImageDecoderDecoder | ||
| import coil.request.ImageRequest | ||
| import coil.size.Scale | ||
| import io.aayush.relabs.R | ||
| import io.aayush.relabs.network.data.user.User | ||
| import io.aayush.relabs.ui.theme.XDAYellow | ||
|
|
||
| @Composable | ||
| @OptIn(ExperimentalMaterial3Api::class) | ||
| fun UserInfoSheet(user: User, sheetState: SheetState, onDismissRequest: () -> Unit = {}) { | ||
| ModalBottomSheet(onDismissRequest = { onDismissRequest() }, sheetState = sheetState) { | ||
| UserHeader(user = user) | ||
| UserShowcase( | ||
| reactionScore = user.reaction_score, | ||
| trophyCount = user.trophy_points, | ||
| messageCount = user.message_count | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| @Composable | ||
| private fun UserHeader(user: User) { | ||
| Column( | ||
| modifier = Modifier | ||
| .fillMaxWidth() | ||
| .padding(20.dp), | ||
| horizontalAlignment = Alignment.CenterHorizontally, | ||
| verticalArrangement = Arrangement.spacedBy(5.dp, Alignment.CenterVertically) | ||
| ) { | ||
| SubcomposeAsyncImage( | ||
| model = ImageRequest.Builder(LocalContext.current) | ||
| .data(user.avatar?.data?.medium?.ifBlank { R.drawable.ic_account } | ||
| ?: R.drawable.ic_account) | ||
| .placeholder(R.drawable.ic_account) | ||
| .crossfade(true) | ||
| .build(), | ||
| contentDescription = "", | ||
| imageLoader = ImageLoader.Builder(LocalContext.current) | ||
| .components { | ||
| if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) { | ||
| add(ImageDecoderDecoder.Factory()) | ||
| } else { | ||
| add(GifDecoder.Factory()) | ||
| } | ||
| }.build(), | ||
| modifier = Modifier | ||
| .requiredSize(96.dp) | ||
| .clip(CircleShape) | ||
| ) | ||
| Text(text = user.username, fontSize = 25.sp, fontWeight = FontWeight.Bold) | ||
| Text( | ||
| text = user.title, | ||
| fontSize = 15.sp, | ||
| fontWeight = FontWeight.Medium, | ||
| textAlign = TextAlign.Center | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| @Composable | ||
| private fun UserShowcase(reactionScore: Int, trophyCount: Int, messageCount: Int) { | ||
| Row( | ||
| modifier = Modifier | ||
| .fillMaxWidth() | ||
| .padding(10.dp), | ||
| horizontalArrangement = Arrangement.SpaceEvenly, | ||
| verticalAlignment = Alignment.CenterVertically | ||
| ) { | ||
| Column( | ||
| verticalArrangement = Arrangement.spacedBy(5.dp, Alignment.CenterVertically), | ||
| horizontalAlignment = Alignment.CenterHorizontally | ||
| ) { | ||
| Image( | ||
| painter = painterResource(id = R.drawable.ic_recommended), | ||
| contentDescription = "", | ||
| colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.primary) | ||
| ) | ||
| Text(text = reactionScore.toString()) | ||
| } | ||
| Column( | ||
| verticalArrangement = Arrangement.spacedBy(5.dp, Alignment.CenterVertically), | ||
| horizontalAlignment = Alignment.CenterHorizontally | ||
| ) { | ||
| Image( | ||
| painter = painterResource(id = R.drawable.ic_trophy), | ||
| contentDescription = "", | ||
| colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.primary) | ||
| ) | ||
| Text(text = trophyCount.toString()) | ||
| } | ||
| Column( | ||
| verticalArrangement = Arrangement.spacedBy(5.dp, Alignment.CenterVertically), | ||
| horizontalAlignment = Alignment.CenterHorizontally | ||
| ) { | ||
| Image( | ||
| painter = painterResource(id = R.drawable.ic_comment), | ||
| contentDescription = "", | ||
| colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.primary) | ||
| ) | ||
| Text(text = messageCount.toString()) | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| <vector xmlns:android="http://schemas.android.com/apk/res/android" | ||
| android:width="24dp" | ||
| android:height="24dp" | ||
| android:viewportWidth="960" | ||
| android:viewportHeight="960" | ||
| android:tint="?attr/colorControlNormal"> | ||
| <path | ||
| android:fillColor="@android:color/white" | ||
| android:pathData="M360,720L580,720Q597,720 611.5,711.5Q626,703 632,688L716,492Q718,487 719,482Q720,477 720,472L720,440Q720,423 708.5,411.5Q697,400 680,400L496,400L520,264Q522,254 519,245Q516,236 509,229L480,200L296,400Q288,408 284,418Q280,428 280,440L280,640Q280,673 303.5,696.5Q327,720 360,720ZM480,880Q397,880 324,848.5Q251,817 197,763Q143,709 111.5,636Q80,563 80,480Q80,397 111.5,324Q143,251 197,197Q251,143 324,111.5Q397,80 480,80Q563,80 636,111.5Q709,143 763,197Q817,251 848.5,324Q880,397 880,480Q880,563 848.5,636Q817,709 763,763Q709,817 636,848.5Q563,880 480,880ZM480,800Q614,800 707,707Q800,614 800,480Q800,346 707,253Q614,160 480,160Q346,160 253,253Q160,346 160,480Q160,614 253,707Q346,800 480,800ZM480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Z"/> | ||
| </vector> |
Oops, something went wrong.