Skip to content

Commit 84c491f

Browse files
UmairKhalid786UmairKhalid786
authored
Merge pull request #27 from UmairKhalid786/feature/sesstings
Profile and About me copies added with sub menu
2 parents c642cbe + 54048d7 commit 84c491f

File tree

20 files changed

+468
-75
lines changed

20 files changed

+468
-75
lines changed

‎app/src/main/java/com/techlads/composetv/home/carousel/CarouselItem.kt‎

Lines changed: 23 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import androidx.compose.foundation.clickable
77
import androidx.compose.foundation.focusable
88
import androidx.compose.foundation.layout.*
99
import androidx.compose.material3.Card
10+
import androidx.compose.material3.CardDefaults
1011
import androidx.compose.material3.MaterialTheme
1112
import androidx.tv.material3.Text
1213
import androidx.compose.runtime.*
@@ -19,8 +20,12 @@ import androidx.compose.ui.text.style.TextAlign
1920
import androidx.compose.ui.tooling.preview.Preview
2021
import androidx.compose.ui.unit.dp
2122
import androidx.compose.ui.zIndex
23+
import androidx.tv.material3.ExperimentalTvMaterial3Api
24+
import androidx.tv.material3.contentColorFor
25+
import com.techlads.composetv.theme.AppTheme
2226

2327

28+
@OptIn(ExperimentalTvMaterial3Api::class)
2429
@Composable
2530
fun CarouselItem(parent: Int, child: Int, onItemFocus: (item: Int) -> Unit) {
2631

@@ -47,13 +52,17 @@ fun CarouselItem(parent: Int, child: Int, onItemFocus: (item: Int) -> Unit) {
4752
border = BorderStroke(
4853
1.dp,
4954
if (isFocused)
50-
Color.LightGray
55+
contentColorFor(backgroundColor = AppTheme.surface)
5156
else
5257
Color.Transparent
5358
), shape = MaterialTheme.shapes.medium
5459
)
5560
.clickable { }
56-
.focusable()
61+
.focusable(),
62+
colors = CardDefaults.cardColors(
63+
containerColor = AppTheme.surface,
64+
contentColor = contentColorFor(backgroundColor = AppTheme.surface)
65+
)
5766
) {
5867
Box(contentAlignment = Alignment.Center, modifier = Modifier.fillMaxSize()) {
5968
Text(text = "Item $parent x $child", textAlign = TextAlign.Center)
@@ -62,6 +71,7 @@ fun CarouselItem(parent: Int, child: Int, onItemFocus: (item: Int) -> Unit) {
6271
}
6372

6473

74+
@OptIn(ExperimentalTvMaterial3Api::class)
6575
@Composable
6676
fun VerticalCarouselItem(parent: Int, child: Int) {
6777

@@ -86,24 +96,31 @@ fun VerticalCarouselItem(parent: Int, child: Int) {
8696
border = BorderStroke(
8797
1.dp,
8898
if (isFocused)
89-
Color.LightGray
99+
contentColorFor(backgroundColor = AppTheme.surface)
90100
else
91101
Color.Transparent
92102
), shape = MaterialTheme.shapes.medium
93103
)
94104
.clickable { }
95-
.focusable()
105+
.focusable(),
106+
colors = CardDefaults.cardColors(
107+
containerColor = AppTheme.surface,
108+
contentColor = contentColorFor(backgroundColor = AppTheme.surface)
109+
)
96110
) {
97111
Box(contentAlignment = Alignment.Center, modifier = Modifier.fillMaxSize()) {
98-
Text(text = "Item $parent x $child", textAlign = TextAlign.Center)
112+
Text(
113+
text = "Item $parent x $child",
114+
textAlign = TextAlign.Center,
115+
)
99116
}
100117
}
101118
}
102119

103120
@Preview
104121
@Composable
105122
fun CarouselItemPrev() {
106-
CarouselItem(1, 1){}
123+
CarouselItem(1, 1) {}
107124
}
108125

109126

‎app/src/main/java/com/techlads/composetv/leftmenu/LeftMenu.kt‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ import androidx.compose.runtime.LaunchedEffect
88
import androidx.compose.runtime.remember
99
import androidx.compose.ui.Modifier
1010
import androidx.compose.ui.focus.FocusRequester
11-
import androidx.compose.ui.graphics.Color
1211
import androidx.compose.ui.tooling.preview.Preview
1312
import androidx.compose.ui.unit.dp
1413
import com.techlads.composetv.home.navigation.NestedScreens
1514
import com.techlads.composetv.leftmenu.model.MenuItem
15+
import com.techlads.composetv.theme.AppTheme
1616
import compose.icons.LineAwesomeIcons
1717
import compose.icons.lineawesomeicons.CogSolid
1818
import compose.icons.lineawesomeicons.Comment
@@ -43,7 +43,7 @@ fun LeftMenu(
4343

4444
Box(
4545
modifier = modifier
46-
.background(Color.DarkGray.copy(alpha = 0.2f))
46+
.background(AppTheme.surface.copy(alpha = 0.5f))
4747
.wrapContentWidth()
4848
) {
4949
Column(

‎app/src/main/java/com/techlads/composetv/leftmenu/LeftMenuItem.kt‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
package com.techlads.composetv.leftmenu
22

3-
import android.util.Log
43
import androidx.compose.animation.AnimatedVisibility
54
import androidx.compose.animation.core.animateDpAsState
65
import androidx.compose.animation.core.keyframes
@@ -9,16 +8,16 @@ import androidx.compose.foundation.clickable
98
import androidx.compose.foundation.focusable
109
import androidx.compose.foundation.layout.*
1110
import androidx.compose.material3.Icon
12-
import androidx.compose.material3.MaterialTheme
11+
import androidx.compose.material3.MaterialTheme.colorScheme
1312
import androidx.compose.material3.ShapeDefaults
14-
import androidx.tv.material3.Text
1513
import androidx.compose.runtime.*
1614
import androidx.compose.ui.Alignment
1715
import androidx.compose.ui.Modifier
1816
import androidx.compose.ui.focus.FocusRequester
1917
import androidx.compose.ui.focus.focusRequester
2018
import androidx.compose.ui.focus.onFocusChanged
2119
import androidx.compose.ui.unit.dp
20+
import androidx.tv.material3.Text
2221
import com.techlads.composetv.leftmenu.model.MenuItem
2322

2423
@Composable
@@ -45,12 +44,11 @@ fun LeftMenuItem(
4544
.focusRequester(requester)
4645
.onFocusChanged {
4746
isFocused = it.isFocused
48-
Log.e("isFocused", it.isFocused.toString())
4947
onMenuFocused?.invoke(menuItem, it.isFocused)
5048
}
5149
.focusable()
5250
.background(
53-
color = if (isFocused) MaterialTheme.colorScheme.onSurface else MaterialTheme.colorScheme.surface,
51+
color = if (isFocused) colorScheme.surface else colorScheme.onSurface,
5452
shape = ShapeDefaults.Small
5553
)
5654
.clickable {
@@ -64,18 +62,18 @@ fun LeftMenuItem(
6462
modifier = Modifier.size(20.dp),
6563
imageVector = it,
6664
contentDescription = menuItem.text,
67-
tint = if (!isFocused)
68-
MaterialTheme.colorScheme.onSurface
65+
tint = if (isFocused)
66+
colorScheme.onSurface
6967
else
70-
MaterialTheme.colorScheme.surface
68+
colorScheme.surface
7169
)
7270
Spacer(modifier = Modifier.padding(horizontal = padding.value))
7371
}
7472

7573
AnimatedVisibility(visible = expanded, modifier = Modifier.height(20.dp)) {
7674
Text(
7775
text = menuItem.text,
78-
color = if (!isFocused) MaterialTheme.colorScheme.onSurface else MaterialTheme.colorScheme.surface,
76+
color = if (isFocused) colorScheme.onSurface else colorScheme.surface,
7977
maxLines = 1
8078
)
8179
}

‎app/src/main/java/com/techlads/composetv/settings/SearchScreen.kt‎

Lines changed: 0 additions & 23 deletions
This file was deleted.

‎app/src/main/java/com/techlads/composetv/settings/SettingsMenu.kt‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
package com.techlads.composetv.settings
2+
3+
import androidx.compose.foundation.layout.width
4+
import androidx.compose.runtime.Composable
5+
import androidx.compose.runtime.remember
6+
import androidx.compose.ui.Modifier
7+
import androidx.compose.ui.tooling.preview.Preview
8+
import androidx.compose.ui.unit.dp
9+
import androidx.tv.foundation.lazy.list.TvLazyColumn
10+
import com.techlads.composetv.settings.data.SettingsMenuModel
11+
12+
@Composable
13+
fun SettingsMenu(modifier: Modifier = Modifier, onMenuSelected: (SettingsMenuModel) -> Unit) {
14+
val settingsMenu = remember {
15+
SettingsMenuData.menu
16+
}
17+
TvLazyColumn(modifier = modifier.width(200.dp)) {
18+
items(settingsMenu.size) {
19+
val item = settingsMenu[it]
20+
SettingsMenuItem(item) {
21+
onMenuSelected(item)
22+
}
23+
}
24+
}
25+
}
26+
27+
@Preview
28+
@Composable
29+
fun SettingsMenuPrev() {
30+
SettingsMenu {
31+
32+
}
33+
}

‎app/src/main/java/com/techlads/composetv/settings/SettingsMenuData.kt‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
package com.techlads.composetv.settings
2+
3+
import com.techlads.composetv.settings.data.SettingsMenuModel
4+
import com.techlads.composetv.settings.navigation.SettingsScreens
5+
6+
7+
object SettingsMenuData {
8+
val menu by lazy {
9+
listOf(
10+
SettingsMenuModel("Profile", SettingsScreens.Profile.title),
11+
SettingsMenuModel("About Me", SettingsScreens.AboutMe.title)
12+
)
13+
}
14+
}

‎app/src/main/java/com/techlads/composetv/settings/SettingsMenuItem.kt‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
package com.techlads.composetv.settings
2+
3+
import androidx.compose.foundation.layout.padding
4+
import androidx.compose.runtime.Composable
5+
import androidx.compose.ui.Modifier
6+
import androidx.compose.ui.tooling.preview.Preview
7+
import androidx.compose.ui.unit.dp
8+
import androidx.tv.material3.Text
9+
import com.techlads.composetv.settings.data.SettingsMenuModel
10+
import com.techlads.composetv.widgets.FocusableItem
11+
12+
@Composable
13+
fun SettingsMenuItem(item: SettingsMenuModel, onMenuSelected: (SettingsMenuModel) -> Unit) {
14+
FocusableItem(
15+
modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp),
16+
onClick = { onMenuSelected(item) }) {
17+
Text(
18+
text = item.text,
19+
modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp)
20+
)
21+
}
22+
}
23+
24+
@Preview
25+
@Composable
26+
fun SettingsMenuItemPrev() {
27+
SettingsMenuItem(SettingsMenuModel("Menu", "")){
28+
29+
}
30+
}

‎app/src/main/java/com/techlads/composetv/settings/SettingsScreen.kt‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
package com.techlads.composetv.settings
2+
3+
import androidx.compose.animation.ExperimentalAnimationApi
4+
import androidx.compose.foundation.background
5+
import androidx.compose.foundation.layout.*
6+
import androidx.compose.runtime.Composable
7+
import androidx.compose.ui.Modifier
8+
import androidx.compose.ui.tooling.preview.Preview
9+
import androidx.compose.ui.unit.dp
10+
import androidx.navigation.NavHostController
11+
import com.google.accompanist.navigation.animation.rememberAnimatedNavController
12+
import com.techlads.composetv.settings.navigation.NestedSettingsScreenNavigation
13+
import com.techlads.composetv.theme.AppTheme
14+
15+
@OptIn(ExperimentalAnimationApi::class)
16+
@Composable
17+
fun SettingsScreen() {
18+
val navController = rememberAnimatedNavController()
19+
20+
Row(
21+
Modifier
22+
.fillMaxSize()) {
23+
SettingsMenu(
24+
Modifier
25+
.fillMaxHeight()
26+
.background(AppTheme.surface.copy(alpha = 0.2f))
27+
.padding(vertical = 32.dp, horizontal = 16.dp)
28+
) {
29+
navController.navigate(it.navigation)
30+
}
31+
SettingsNavigation(navController)
32+
}
33+
}
34+
35+
@Composable
36+
fun SettingsNavigation(navController: NavHostController) {
37+
NestedSettingsScreenNavigation(navController = navController)
38+
}
39+
40+
41+
@Preview
42+
@Composable
43+
fun SettingsScreenPrev() {
44+
SettingsScreen()
45+
}

‎app/src/main/java/com/techlads/composetv/settings/data/SettingsMenuModel.kt‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
package com.techlads.composetv.settings.data
2+
3+
data class SettingsMenuModel(val text: String, val navigation: String)

‎app/src/main/java/com/techlads/composetv/settings/navigation/NestedHomeScreenNavigation.kt‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
package com.techlads.composetv.settings.navigation
2+
3+
import androidx.compose.animation.ExperimentalAnimationApi
4+
import androidx.compose.runtime.Composable
5+
import androidx.navigation.NavHostController
6+
import com.google.accompanist.navigation.animation.AnimatedNavHost
7+
import com.google.accompanist.navigation.animation.composable
8+
import com.techlads.composetv.navigation.tabEnterTransition
9+
import com.techlads.composetv.navigation.tabExitTransition
10+
import com.techlads.composetv.settings.screens.about.AboutScreen
11+
import com.techlads.composetv.settings.screens.profile.ProfileScreen
12+
13+
@OptIn(ExperimentalAnimationApi::class)
14+
@Composable
15+
fun NestedSettingsScreenNavigation(navController: NavHostController) {
16+
AnimatedNavHost(navController = navController, startDestination = SettingsScreens.Profile.title) {
17+
// e.g will add auth routes here if when we will extend project
18+
composable(
19+
SettingsScreens.Profile.title,
20+
enterTransition = { tabEnterTransition() },
21+
exitTransition = { tabExitTransition() }) {
22+
ProfileScreen()
23+
}
24+
composable(
25+
SettingsScreens.AboutMe.title,
26+
enterTransition = { tabEnterTransition() },
27+
exitTransition = { tabExitTransition() }) {
28+
AboutScreen()
29+
}
30+
}
31+
}

0 commit comments

Comments
 (0)