diff --git a/app/build.gradle b/app/build.gradle index 1a232bf9..7c40666c 100644 --- a/app/build.gradle +++ b/app/build.gradle @@ -119,6 +119,10 @@ dependencies { implementation 'com.github.akshaaatt:Onboarding:1.0.3' implementation 'com.github.akshaaatt:Share-Android:Tag' + //ViewPager + implementation "com.google.accompanist:accompanist-pager:0.23.0" + implementation "com.google.accompanist:accompanist-pager-indicators:0.23.0" + //Barcode Scan implementation 'me.dm7.barcodescanner:zbar:1.9.13' @@ -143,6 +147,7 @@ dependencies { implementation "androidx.navigation:navigation-compose:2.5.0-alpha03" implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.4.1' implementation 'androidx.hilt:hilt-navigation-compose:1.0.0' + implementation 'androidx.compose.material3:material3:1.0.0-alpha09' //Test Setup testImplementation 'junit:junit:4.13.2' diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml index 4c8d4ec2..29c4ac98 100644 --- a/app/src/main/AndroidManifest.xml +++ b/app/src/main/AndroidManifest.xml @@ -25,6 +25,10 @@ android:usesCleartextTraffic="true" tools:targetApi="32"> + BottomNavigationItem( icon = { Icon(painterResource(id = item.icon), contentDescription = item.title, tint = Color.Unspecified) }, - label = { Text(text = item.title) }, + label = { Text(text = item.title, fontSize = 11.sp) }, selectedContentColor = colorResource(id = R.color.white), unselectedContentColor = colorResource(id = R.color.gray), alwaysShowLabel = true, diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/login/LoginActivity.kt b/app/src/main/java/org/metabrainz/android/presentation/features/login/LoginActivity.kt index 8adf1dae..af2058ce 100644 --- a/app/src/main/java/org/metabrainz/android/presentation/features/login/LoginActivity.kt +++ b/app/src/main/java/org/metabrainz/android/presentation/features/login/LoginActivity.kt @@ -15,6 +15,7 @@ import org.metabrainz.android.data.sources.api.entities.userdata.UserInfo import org.metabrainz.android.databinding.ActivityLoginBinding import org.metabrainz.android.presentation.features.base.MusicBrainzActivity import org.metabrainz.android.presentation.features.dashboard.DashboardActivity +import org.metabrainz.android.presentation.features.userprofile.ProfileActivity import org.metabrainz.android.util.Log.d @AndroidEntryPoint @@ -38,9 +39,8 @@ class LoginActivity : MusicBrainzActivity() { } when (LoginSharedPreferences.loginStatus) { LoginSharedPreferences.STATUS_LOGGED_IN -> { - binding!!.loginPromptId.setText(R.string.logout_prompt) - binding!!.loginBtn.setText(R.string.logout) - binding!!.loginBtn.setOnClickListener { logoutUser() } + startActivity(Intent(this,ProfileActivity::class.java)) + finish() } else -> binding!!.loginBtn.setOnClickListener { startLogin() } } @@ -95,14 +95,6 @@ class LoginActivity : MusicBrainzActivity() { } } - private fun logoutUser() { - LoginSharedPreferences.logoutUser() - Toast.makeText(applicationContext, - "User has successfully logged out.", - Toast.LENGTH_LONG).show() - startActivity(Intent(this, DashboardActivity::class.java)) - finish() - } override fun onCreateOptionsMenu(menu: Menu): Boolean { super.onCreateOptionsMenu(menu) diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ProfileActivity.kt b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ProfileActivity.kt new file mode 100644 index 00000000..6a25df29 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ProfileActivity.kt @@ -0,0 +1,227 @@ +package org.metabrainz.android.presentation.features.userprofile + +import android.content.Intent +import androidx.appcompat.app.AppCompatActivity +import android.os.Bundle +import android.widget.Toast +import androidx.activity.compose.setContent +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.* +import androidx.compose.material.TabRowDefaults.tabIndicatorOffset +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.filled.* +import androidx.compose.runtime.Composable +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.rememberCoroutineScope +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.res.colorResource +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import com.google.accompanist.pager.ExperimentalPagerApi +import com.google.accompanist.pager.HorizontalPager +import com.google.accompanist.pager.rememberPagerState +import kotlinx.coroutines.launch +import org.metabrainz.android.R +import org.metabrainz.android.presentation.features.dashboard.DashboardActivity +import org.metabrainz.android.presentation.features.login.LoginSharedPreferences +import org.metabrainz.android.presentation.features.settings.SettingsActivity +import org.metabrainz.android.presentation.features.userprofile.collections_section.CollectionsSectionScreen +import org.metabrainz.android.presentation.features.userprofile.profile_section.ProfileSectionScreen +import org.metabrainz.android.presentation.features.userprofile.ratings_section.RatingsSectionScreen +import org.metabrainz.android.presentation.features.userprofile.subscribers_section.SubscribersSectionScreen +import org.metabrainz.android.presentation.features.userprofile.subscriptions_section.SubscriptionSectionScreen +import org.metabrainz.android.presentation.features.userprofile.tags_section.TagsSectionScreen +import org.metabrainz.android.theme.Theme + +class ProfileActivity : AppCompatActivity() { + private val showDialog = mutableStateOf(false) + override fun onCreate(savedInstanceState: Bundle?) { + super.onCreate(savedInstanceState) + setContent { + Column { + TopAppBar() + TabBar() + if (showDialog.value) LogOutDialog() + TopAppBar() + } + } + } + + @Composable + fun TopAppBar() { + TopAppBar( + navigationIcon = { + IconButton(onClick = { + startActivity( + Intent( + applicationContext, + DashboardActivity::class.java + ) + ) + }) { + Icon(Icons.Filled.ArrowBack, "Go Back") + } + }, + title = { + Text(text = "User Profile") + }, + backgroundColor = colorResource(id = R.color.app_bg), + contentColor = colorResource(id = R.color.white), + elevation = 2.dp, + actions = { + + IconButton(onClick = { + showDialog.value = true + }) { + Icon( + painterResource(id = R.drawable.ic_user), + "Log Out", + tint = Color.Unspecified + ) + } + IconButton(onClick = { + startActivity(Intent(applicationContext, SettingsActivity::class.java)) + }) { + Icon( + painterResource(id = R.drawable.action_settings), + "Settings", + tint = Color.Unspecified + ) + } + } + ) + } + + @OptIn(ExperimentalPagerApi::class) + @Composable + fun TabBar() { + val tabdata = listOf( + ProfileTabItem.Profile, + ProfileTabItem.Subscriptions, + ProfileTabItem.Subscribers, + ProfileTabItem.Collection, + ProfileTabItem.Tags, + ProfileTabItem.Ratings + ) + val pagerState = rememberPagerState( + initialPage = 0 + ) + val tabIndex = pagerState.currentPage + val coroutineScope = rememberCoroutineScope() + Column { + ScrollableTabRow( + selectedTabIndex = tabIndex, + edgePadding = TabRowDefaults.ScrollableTabRowPadding, + backgroundColor = colorResource(R.color.dark_gray), + indicator = @Composable { tabPositions -> + TabRowDefaults.Indicator( + Modifier.tabIndicatorOffset(tabPositions[tabIndex]) + ) + } + ) { + tabdata.forEachIndexed { index, listItem -> + Tab(selected = tabIndex == index, onClick = { + coroutineScope.launch { + pagerState.animateScrollToPage(index) + } + }, text = { + Text(text = listItem.title, fontSize = 16.sp) + }, unselectedContentColor = colorResource(R.color.app_bg_light), + selectedContentColor = colorResource(R.color.white) + ) + } + } + HorizontalPager( + state = pagerState, + modifier = Modifier.weight(1f), + count = tabdata.size + ) { page -> + Theme { + Surface { + tabdata[page].screen() + } + } + } + } + } + + private fun logoutUser() { + LoginSharedPreferences.logoutUser() + Toast.makeText( + applicationContext, + "User has successfully logged out.", + Toast.LENGTH_LONG + ).show() + startActivity(Intent(this, DashboardActivity::class.java)) + finish() + } + + @Composable + fun LogOutDialog() { + if (showDialog.value) { + AlertDialog( + backgroundColor = colorResource(R.color.dark_gray), + onDismissRequest = { + showDialog.value = false + }, + title = { + Text( + text = "Log Out", + fontWeight = FontWeight.Bold, + fontSize = 20.sp, + color = colorResource(R.color.white) + ) + }, + text = { + Text( + fontSize = 16.sp, + text = "Confirm Log Out", + color = colorResource(R.color.white) + ) + }, + confirmButton = { + TextButton( + onClick = { + showDialog.value = false + logoutUser() + } + ) { + Text( + "CONFIRM", + fontSize = 15.sp, + color = colorResource(R.color.mb_purple_medium) + ) + } + }, + dismissButton = { + TextButton( + onClick = { + showDialog.value = false + } + ) { + Text( + "DISMISS", + fontSize = 15.sp, + color = colorResource(R.color.mb_purple_medium) + ) + } + }, + shape = RoundedCornerShape(24.dp) + ) + } + } +} + +sealed class ProfileTabItem(var title: String, var screen: @Composable () -> Unit){ + object Profile: ProfileTabItem("Profile", { ProfileSectionScreen() }) + object Subscriptions: ProfileTabItem("Subscriptions", { SubscriptionSectionScreen() }) + object Subscribers: ProfileTabItem("Subscribers", { SubscribersSectionScreen() }) + object Tags: ProfileTabItem("Tags", { TagsSectionScreen() }) + object Collection: ProfileTabItem("Collection",{ CollectionsSectionScreen() }) + object Ratings: ProfileTabItem("Ratings", { RatingsSectionScreen() }) +} + diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/collections_section/CollectionsSectionScreen.kt b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/collections_section/CollectionsSectionScreen.kt new file mode 100644 index 00000000..e72e0436 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/collections_section/CollectionsSectionScreen.kt @@ -0,0 +1,14 @@ +package org.metabrainz.android.presentation.features.userprofile.collections_section + +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.material.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier + +@Composable +fun CollectionsSectionScreen(){ + Column(modifier = Modifier.fillMaxSize()) { + Text("Coming Soon!!") + } +} \ No newline at end of file diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/profile_section/ProfileSectionScreen.kt b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/profile_section/ProfileSectionScreen.kt new file mode 100644 index 00000000..2ba056e3 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/profile_section/ProfileSectionScreen.kt @@ -0,0 +1,81 @@ +package org.metabrainz.android.presentation.features.userprofile.profile_section + + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.lazy.LazyColumn +import androidx.compose.foundation.lazy.itemsIndexed +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.* +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.layout.layoutId +import androidx.compose.ui.res.colorResource +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import org.metabrainz.android.R + +@Composable +fun ProfileSectionScreen() { + ProfileSection() +} + +@Composable +fun ProfileSection() { + val listOfProfileCards = arrayListOf( + Pair("Name", "YellowHatPro"), + Pair("Email", "yellowhatpro3119@gmail.com"), + Pair("Tags", "12"), + Pair("Ratings", "1"), + Pair("Collections", "5"), + Pair("Subscriptions", "2"), + Pair("Subscribers", "0") + ) + + LazyColumn(modifier = Modifier.fillMaxSize()) { + item { + Box( + modifier = Modifier.fillMaxWidth().padding(15.dp), + contentAlignment = Alignment.Center + ) { + Image( + painterResource(R.drawable.ic_editor_image), + "MusicBrainz Profile", + modifier = Modifier + .layoutId("mbProfileImage") + .size(155.dp) + ) + } + } + itemsIndexed(listOfProfileCards) { _, value -> + ProfileCard(key = value.first, value = value.second) + } + } +} + +@Composable +fun ProfileCard( + key:String, + value:String +){ + Card(modifier = Modifier + .padding(horizontal = 20.dp, vertical = 4.dp) + .fillMaxWidth() + .height(60.dp), + elevation = 3.dp, + shape = RoundedCornerShape(10.dp), + backgroundColor = colorResource(R.color.dark_gray) + ) { + Row(verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.SpaceBetween, + modifier = Modifier.padding(10.dp) + + ) { + Text(key, fontWeight = FontWeight.Bold, color = colorResource(R.color.white)) + Text(value,color = colorResource(R.color.white)) + } + } +} + diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ratings_section/RatingBar.kt b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ratings_section/RatingBar.kt new file mode 100644 index 00000000..9f70ae3b --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ratings_section/RatingBar.kt @@ -0,0 +1,103 @@ +package org.metabrainz.android.presentation.features.userprofile.ratings_section + +import androidx.compose.foundation.Canvas +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.shape.GenericShape +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.geometry.Offset +import androidx.compose.ui.geometry.Size +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.Path +import androidx.compose.ui.graphics.SolidColor +import kotlin.math.cos +import kotlin.math.sin + + +@Composable +fun RatingBar( + rating: Float, + modifier: Modifier = Modifier, + color: Color = Color.Yellow +) { + Row(modifier = modifier.wrapContentSize()) { + (1..5).forEach { step -> + val stepRating = when { + rating > step -> 1f + step.rem(rating) < 1 -> rating - (step - 1f) + else -> 0f + } + RatingStar(stepRating, color) + } + } +} + + +@Composable +private fun RatingStar( + rating: Float, + ratingColor: Color = Color.Yellow, + backgroundColor: Color = Color.Gray +) { + BoxWithConstraints( + modifier = Modifier + .fillMaxHeight() + .aspectRatio(1f) + .clip(starShape) + ) { + Canvas(modifier = Modifier.size(maxHeight)) { + drawRect( + brush = SolidColor(backgroundColor), + size = Size( + height = size.height * 1.4f, + width = size.width * 1.4f + ), + topLeft = Offset( + x = -(size.width * 0.1f), + y = -(size.height * 0.1f) + ) + ) + if (rating > 0) { + drawRect( + brush = SolidColor(ratingColor), + size = Size( + height = size.height * 1.1f, + width = size.width * rating + ) + ) + } + } + } +} + +private val starShape = GenericShape { size, _ -> + addPath(starPath(size.height)) +} + +private val starPath = { size: Float -> + Path().apply { + val outerRadius: Float = size / 1.8f + val innerRadius: Double = outerRadius / 2.5 + var rot: Double = Math.PI / 2 * 3 + val cx: Float = size / 2 + val cy: Float = size / 20 * 11 + var x: Float + var y: Float + val step = Math.PI / 5 + + moveTo(cx, cy - outerRadius) + repeat(5) { + x = (cx + cos(rot) * outerRadius).toFloat() + y = (cy + sin(rot) * outerRadius).toFloat() + lineTo(x, y) + rot += step + + x = (cx + cos(rot) * innerRadius).toFloat() + y = (cy + sin(rot) * innerRadius).toFloat() + lineTo(x, y) + rot += step + } + close() + } +} diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ratings_section/RatingsSectionScreen.kt b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ratings_section/RatingsSectionScreen.kt new file mode 100644 index 00000000..d1c144b6 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/ratings_section/RatingsSectionScreen.kt @@ -0,0 +1,92 @@ +package org.metabrainz.android.presentation.features.userprofile.ratings_section + +import androidx.compose.foundation.background +import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.lazy.LazyColumn +import androidx.compose.foundation.lazy.LazyRow +import androidx.compose.foundation.lazy.itemsIndexed +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.Card +import androidx.compose.material.Text +import androidx.compose.runtime.* +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.res.colorResource +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import org.metabrainz.android.R +import org.metabrainz.android.theme.ChipTextColor +import org.metabrainz.android.theme.DisabledChipColor +import org.metabrainz.android.theme.EnabledChipColor + +@Composable +fun RatingsSectionScreen() { + val ratingEntities = listOf("Artist", "Event", "Label", "Release Group", "Recording", "Work") + val ratedEntities = + listOf(Pair("Fall Out Boy", 3f), Pair("Sean Paul", 4.5f), Pair("Ed Sheeren", 5f), Pair("Passenger", 5f)) + LazyColumn(modifier = Modifier.fillMaxSize()) { + item { + RatingChipsSection(ratingEntities) + } + itemsIndexed(ratedEntities) { _, value -> + Card( + modifier = Modifier + .padding(horizontal = 20.dp, vertical = 4.dp) + .fillMaxWidth() + .height(60.dp), + elevation = 3.dp, + shape = RoundedCornerShape(10.dp), + backgroundColor = colorResource(R.color.dark_gray) + ) { + Row( + modifier = Modifier.padding(12.dp), + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.SpaceBetween + ) { + Text(value.first) + RatingBar( + value.second, modifier = Modifier + .height(25.dp) + .width(150.dp) + ) + } + } + } + } +} + +@Composable +fun RatingChipsSection( + ratingEntities: List +) { + var selectedChipIndex by remember { + mutableStateOf(0) + } + LazyRow( + verticalAlignment = Alignment.Top, + horizontalArrangement = Arrangement.Center + ) { + items(ratingEntities.size) { + Box(modifier = Modifier + .padding(start = 15.dp, top = 15.dp, bottom = 15.dp) + .clickable { selectedChipIndex = it } + .clip(RoundedCornerShape(30.dp)) + .background( + if (selectedChipIndex == it) EnabledChipColor + else DisabledChipColor + ) + .padding(12.dp)) { + Row { + Text( + text = ratingEntities[it], + color = ChipTextColor, + modifier = Modifier.padding(end = 4.dp), + fontWeight = FontWeight.Bold + ) + } + } + } + } +} diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/subscribers_section/SubscribersSectionScreen.kt b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/subscribers_section/SubscribersSectionScreen.kt new file mode 100644 index 00000000..6b314f72 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/subscribers_section/SubscribersSectionScreen.kt @@ -0,0 +1,44 @@ +package org.metabrainz.android.presentation.features.userprofile.subscribers_section + +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.lazy.LazyColumn +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.Card +import androidx.compose.material.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.colorResource +import androidx.compose.ui.unit.dp +import org.metabrainz.android.R + +@Composable +fun SubscribersSectionScreen() { + val name = "YellowHatpro" + LazyColumn(modifier = Modifier.fillMaxSize()) { + item { + SubscriberCard(name) + } + } +} + +@Composable +fun SubscriberCard(name: String) { + Card( + modifier = Modifier + .padding(horizontal = 20.dp, vertical = 4.dp) + .fillMaxWidth() + .height(60.dp), + elevation = 3.dp, + shape = RoundedCornerShape(10.dp), + backgroundColor = colorResource(R.color.dark_gray) + ) { + Row( + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.SpaceBetween, + modifier = Modifier.padding(13.dp) + ) { + Text(name) + } + } +} \ No newline at end of file diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/subscriptions_section/SubscriptionsSectionScreen.kt b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/subscriptions_section/SubscriptionsSectionScreen.kt new file mode 100644 index 00000000..90b44db0 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/subscriptions_section/SubscriptionsSectionScreen.kt @@ -0,0 +1,87 @@ +package org.metabrainz.android.presentation.features.userprofile.subscriptions_section + +import androidx.compose.foundation.background +import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.lazy.LazyColumn +import androidx.compose.foundation.lazy.LazyRow +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.Card +import androidx.compose.material.Text +import androidx.compose.runtime.* +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.res.colorResource +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import org.metabrainz.android.theme.ChipTextColor +import org.metabrainz.android.theme.DisabledChipColor +import org.metabrainz.android.theme.EnabledChipColor + +@Composable +fun SubscriptionSectionScreen(){ + val subscriptionEntities = listOf("Artist", "Series", "Label", "Collection", "Editor") + val subscriptions = listOf("P!nk","Arijit Singh","Coldplay","Khalid","The Weeknd") + LazyColumn(Modifier.fillMaxSize()) { + item { + Box(modifier = Modifier.fillMaxWidth(), contentAlignment = Alignment.Center) { + SubscriptionChipSection(subscriptionEntities) + } + } + items(subscriptions.size) { + Card( + modifier = Modifier + .padding(horizontal = 20.dp, vertical = 4.dp) + .fillMaxWidth() + .height(60.dp), + elevation = 3.dp, + shape = RoundedCornerShape(10.dp), + backgroundColor = colorResource(org.metabrainz.android.R.color.dark_gray) + ) { + Row( + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.SpaceBetween, + modifier = Modifier.padding(13.dp) + ) { + Text(subscriptions[it]) + } + } + } + } +} + +@Composable +fun SubscriptionChipSection( + subscriptionEntities: List +) { + var selectedChipIndex by remember { + mutableStateOf(0) + } + LazyRow( + verticalAlignment = Alignment.Top, + horizontalArrangement = Arrangement.Center + ) { + items(subscriptionEntities.size) { + Box(modifier = Modifier + .padding(start = 15.dp, top = 15.dp, bottom = 15.dp) + .clickable { selectedChipIndex = it } + .clip(RoundedCornerShape(30.dp)) + .background( + if (selectedChipIndex == it) EnabledChipColor + else DisabledChipColor + ) + .padding(12.dp)) { + Row { + Text( + text = subscriptionEntities[it], + color = ChipTextColor, + modifier = Modifier.padding(end = 4.dp), + fontWeight = FontWeight.Bold + ) + } + } + } + } +} + diff --git a/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/tags_section/TagsSectionScreen.kt b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/tags_section/TagsSectionScreen.kt new file mode 100644 index 00000000..fc104d35 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/presentation/features/userprofile/tags_section/TagsSectionScreen.kt @@ -0,0 +1,113 @@ +package org.metabrainz.android.presentation.features.userprofile.tags_section + +import androidx.compose.foundation.Image +import androidx.compose.foundation.background +import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.lazy.LazyColumn +import androidx.compose.foundation.lazy.LazyRow +import androidx.compose.foundation.lazy.itemsIndexed +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.Card +import androidx.compose.material.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.* +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.res.colorResource +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import org.metabrainz.android.R +import org.metabrainz.android.theme.ChipTextColor +import org.metabrainz.android.theme.DisabledChipColor +import org.metabrainz.android.theme.EnabledChipColor + +@Composable +fun TagsSectionScreen() { + val genreList = arrayListOf("Electronic", "Experimental", "Rock") + val otherTagList = arrayListOf("Cool", "Favourite", "Funny", "Cute", "Random") + val tags: ArrayList>> = arrayListOf( + Pair("Genre", genreList), + Pair("Other Tags", otherTagList) + ) + LazyColumn(modifier = Modifier.fillMaxSize()) { + item { + Box(contentAlignment = Alignment.Center, modifier = Modifier.fillMaxWidth()) { + TagsChipsSection(listOf(UpvotedDownvotedTag.UPVOTE, UpvotedDownvotedTag.DOWNVOTE)) + } + } + itemsIndexed(tags) { _, value -> + Text( + value.first, + fontSize = 28.sp, + modifier = Modifier.padding(14.dp) + ) + val lazyColumnHeight = value.second.size * 68 //68 denotes size of each card + padding + LazyColumn(modifier = Modifier.height((lazyColumnHeight).dp)) { + items(value.second.size) { index -> + Card( + modifier = Modifier + .padding(horizontal = 20.dp, vertical = 4.dp) + .fillMaxWidth() + .height(60.dp), + elevation = 3.dp, + shape = RoundedCornerShape(10.dp), + backgroundColor = colorResource(R.color.dark_gray) + ) { + Row( + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.SpaceBetween, + modifier = Modifier.padding(13.dp) + ) { + Text(value.second[index]) + } + } + } + } + } + } +} + +@Composable +fun TagsChipsSection( + chips : List +){ + var selectedChipIndex by remember { + mutableStateOf(0) + } + LazyRow(verticalAlignment = Alignment.Top, + horizontalArrangement = Arrangement.Center) { + items(chips.size){ + Box(modifier = Modifier + .padding( + start = 15.dp, + top = 15.dp, + bottom = 15.dp + ) + .clickable { selectedChipIndex = it } + .clip(RoundedCornerShape(10.dp)) + .background( + if (selectedChipIndex == it) EnabledChipColor + else DisabledChipColor + ) + .padding(12.dp)){ + Row { + Text(text = chips[it].value, + color = ChipTextColor, + modifier = Modifier.padding(end = 4.dp), + fontWeight = FontWeight.Bold) + Image(painter = painterResource(chips[it].icon),"") + } + } + } + } +} + +enum class UpvotedDownvotedTag(val value:String, val icon: Int){ + UPVOTE("Upvoted",R.drawable.ic_upvote), + DOWNVOTE("Downvoted",R.drawable.ic_downvote) +} \ No newline at end of file diff --git a/app/src/main/java/org/metabrainz/android/theme/Colors.kt b/app/src/main/java/org/metabrainz/android/theme/Colors.kt new file mode 100644 index 00000000..c7e0adb1 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/theme/Colors.kt @@ -0,0 +1,9 @@ +package org.metabrainz.android.theme + +import androidx.compose.ui.graphics.Color + +val Appbg = Color(0xFF263238) +val AppbgLight = Color(0xFFe0e0e0) +val EnabledChipColor = Color(0xFFccabff) +val DisabledChipColor = Color(0xFFd8cfe8) +val ChipTextColor = Color(0xFF323232) diff --git a/app/src/main/java/org/metabrainz/android/theme/Theme.kt b/app/src/main/java/org/metabrainz/android/theme/Theme.kt new file mode 100644 index 00000000..c24767d3 --- /dev/null +++ b/app/src/main/java/org/metabrainz/android/theme/Theme.kt @@ -0,0 +1,32 @@ +package org.metabrainz.android.theme + +import androidx.compose.foundation.isSystemInDarkTheme +import androidx.compose.material.MaterialTheme +import androidx.compose.material.darkColors +import androidx.compose.material.lightColors +import androidx.compose.runtime.Composable + + +private val DarkColorPalette = darkColors( + surface = Appbg +) +private val LightColorPalette = lightColors( + surface = AppbgLight +) +@Composable +fun Theme( + theme: Boolean = isSystemInDarkTheme(), + content: @Composable () -> Unit +) { + val colors = if (theme) { + DarkColorPalette + } else { + LightColorPalette + } + MaterialTheme( + colors = colors, + typography = MaterialTheme.typography, + shapes = MaterialTheme.shapes, + content = content + ) +} \ No newline at end of file diff --git a/app/src/main/res/drawable/ic_downvote.xml b/app/src/main/res/drawable/ic_downvote.xml new file mode 100644 index 00000000..6e9ca60f --- /dev/null +++ b/app/src/main/res/drawable/ic_downvote.xml @@ -0,0 +1,5 @@ + + + diff --git a/app/src/main/res/drawable/ic_editor_image.xml b/app/src/main/res/drawable/ic_editor_image.xml new file mode 100644 index 00000000..dfcd4e96 --- /dev/null +++ b/app/src/main/res/drawable/ic_editor_image.xml @@ -0,0 +1,18 @@ + + + + + + diff --git a/app/src/main/res/drawable/ic_upvote.xml b/app/src/main/res/drawable/ic_upvote.xml new file mode 100644 index 00000000..cea79240 --- /dev/null +++ b/app/src/main/res/drawable/ic_upvote.xml @@ -0,0 +1,5 @@ + + + diff --git a/app/src/main/res/layout/activity_dashboard.xml b/app/src/main/res/layout/activity_dashboard.xml index 7e10ce29..6092fcc6 100644 --- a/app/src/main/res/layout/activity_dashboard.xml +++ b/app/src/main/res/layout/activity_dashboard.xml @@ -37,8 +37,8 @@