dark mode-v3
This commit is contained in:
parent
4683f5ab22
commit
e8dbf812d5
9 changed files with 102 additions and 24 deletions
|
|
@ -13,12 +13,10 @@ import androidx.compose.foundation.layout.padding
|
|||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.material.icons.Icons
|
||||
import androidx.compose.material.icons.automirrored.filled.Help
|
||||
import androidx.compose.material.icons.filled.Devices
|
||||
import androidx.compose.material.icons.filled.Help
|
||||
import androidx.compose.material.icons.filled.Palette
|
||||
import androidx.compose.material.icons.filled.Person
|
||||
import androidx.compose.material.icons.filled.Settings
|
||||
import androidx.compose.material.icons.filled.Subscriptions
|
||||
import androidx.compose.material3.Icon
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
|
|
@ -32,13 +30,15 @@ import androidx.compose.ui.graphics.vector.ImageVector
|
|||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import androidx.lifecycle.viewmodel.compose.viewModel
|
||||
import androidx.navigation.compose.NavHost
|
||||
import androidx.navigation.compose.composable
|
||||
import androidx.navigation.compose.rememberNavController
|
||||
import com.example.login_v3.home.setting.setting_detail_page.setting_devices_page
|
||||
import com.example.login_v3.home.setting.setting_detail_page.setting_profile_page
|
||||
import com.example.login_v3.home.setting.setting_detail_page.setting_subscription_page
|
||||
import com.example.login_v3.home.setting.setting_detail_page.setting_theme_page
|
||||
import com.example.login_v3.home.setting.setting_detail_page.detail_UI.setting_devices_page
|
||||
import com.example.login_v3.home.setting.setting_detail_page.detail_UI.setting_profile_page
|
||||
import com.example.login_v3.home.setting.setting_detail_page.detail_UI.setting_subscription_page
|
||||
import com.example.login_v3.home.setting.setting_detail_page.detail_UI.setting_theme_page
|
||||
import com.example.login_v3.home.setting.setting_detail_page.viewmodel.Theme_ViewModel
|
||||
import com.example.login_v3.navigation.BottomBarViewModel
|
||||
|
||||
@Composable
|
||||
|
|
@ -113,12 +113,17 @@ fun SharedTransitionScope.setting_detail_Screen(
|
|||
//spacing between content and title
|
||||
Spacer(modifier = Modifier.height(26.dp))
|
||||
|
||||
|
||||
NavHost(
|
||||
navController = setting_detail_page_navController,
|
||||
startDestination = startRoute
|
||||
) {
|
||||
|
||||
composable("setting_Profile") { setting_profile_page() }
|
||||
composable("setting_Theme") { setting_theme_page() }
|
||||
composable("setting_Theme") {
|
||||
val ThemeViewModel: Theme_ViewModel = viewModel()
|
||||
setting_theme_page(ThemeViewModel)
|
||||
}
|
||||
composable("setting_Devices") { setting_devices_page() }
|
||||
composable("setting_Subscription") { setting_subscription_page() }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
package com.example.login_v3.home.setting.setting_detail_page
|
||||
package com.example.login_v3.home.setting.setting_detail_page.detail_UI
|
||||
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.material3.Text
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
package com.example.login_v3.home.setting.setting_detail_page
|
||||
package com.example.login_v3.home.setting.setting_detail_page.detail_UI
|
||||
|
||||
import androidx.compose.foundation.Image
|
||||
import androidx.compose.foundation.background
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
package com.example.login_v3.home.setting.setting_detail_page
|
||||
package com.example.login_v3.home.setting.setting_detail_page.detail_UI
|
||||
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.material3.Text
|
||||
|
|
@ -0,0 +1,58 @@
|
|||
package com.example.login_v3.home.setting.setting_detail_page.detail_UI
|
||||
|
||||
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.selection.selectable
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.material3.RadioButton
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.unit.dp
|
||||
import com.example.login_v3.home.setting.setting_detail_page.viewmodel.Theme_ViewModel
|
||||
import com.example.login_v3.ui.theme.AppTheme
|
||||
|
||||
@Composable
|
||||
fun setting_theme_page(
|
||||
viewModel: Theme_ViewModel
|
||||
){
|
||||
val selectedTheme = viewModel.currentTheme.value
|
||||
|
||||
Column(modifier = Modifier.padding(16.dp)) {
|
||||
Text(text = "主題設定", style = MaterialTheme.typography.headlineMedium)
|
||||
|
||||
Spacer(modifier = Modifier.height(8.dp))
|
||||
|
||||
// 遍歷所有 Enum 選項
|
||||
AppTheme.entries.forEach { theme ->
|
||||
Row(
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.selectable(
|
||||
selected = (theme == selectedTheme),
|
||||
onClick = { viewModel.updateTheme(theme) }
|
||||
)
|
||||
.padding(8.dp)
|
||||
) {
|
||||
RadioButton(
|
||||
selected = (theme == selectedTheme),
|
||||
onClick = { viewModel.updateTheme(theme) }
|
||||
)
|
||||
Text(
|
||||
text = when(theme) {
|
||||
AppTheme.SYSTEM -> "跟隨系統設定"
|
||||
AppTheme.LIGHT -> "淺色模式"
|
||||
AppTheme.DARK -> "深色模式"
|
||||
},
|
||||
modifier = Modifier.padding(start = 8.dp)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
package com.example.login_v3.home.setting.setting_detail_page
|
||||
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
|
||||
@Composable
|
||||
fun setting_theme_page(){
|
||||
Column() {
|
||||
Text(text = "setting_Theme_page")
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
package com.example.login_v3.home.setting.setting_detail_page.viewmodel
|
||||
|
||||
import androidx.compose.runtime.mutableStateOf
|
||||
import androidx.lifecycle.ViewModel
|
||||
import com.example.login_v3.ui.theme.AppTheme
|
||||
|
||||
class Theme_ViewModel : ViewModel() {
|
||||
var currentTheme = mutableStateOf(AppTheme.SYSTEM)
|
||||
private set
|
||||
|
||||
fun updateTheme(newTheme: AppTheme) {
|
||||
currentTheme.value = newTheme
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
package com.example.login_v3.ui.theme
|
||||
|
||||
enum class AppTheme {
|
||||
SYSTEM, // 跟隨系統
|
||||
LIGHT, // 強制淺色
|
||||
DARK // 強制深色
|
||||
}
|
||||
|
|
@ -35,11 +35,17 @@ private val LightColorScheme = lightColorScheme(
|
|||
|
||||
@Composable
|
||||
fun Login_V3Theme(
|
||||
darkTheme: Boolean = isSystemInDarkTheme(),
|
||||
appTheme: AppTheme = AppTheme.SYSTEM,
|
||||
// Dynamic color is available on Android 12+
|
||||
dynamicColor: Boolean = true,
|
||||
dynamicColor: Boolean = false,
|
||||
content: @Composable () -> Unit
|
||||
) {
|
||||
val darkTheme = when (appTheme) {
|
||||
AppTheme.SYSTEM -> isSystemInDarkTheme()
|
||||
AppTheme.LIGHT -> false
|
||||
AppTheme.DARK -> true
|
||||
}
|
||||
|
||||
val colorScheme = when {
|
||||
dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
|
||||
val context = LocalContext.current
|
||||
|
|
|
|||
Loading…
Reference in a new issue