diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CollapsingToolbarScaffold.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CollapsingToolbarScaffold.kt index f4b81826bc02..b2c61701f626 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CollapsingToolbarScaffold.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CollapsingToolbarScaffold.kt @@ -14,15 +14,18 @@ import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.layout.onGloballyPositioned +import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.unit.dp import com.google.accompanist.systemuicontroller.rememberSystemUiController +import kotlinx.coroutines.delay import me.onebone.toolbar.CollapsingToolbarScaffold import me.onebone.toolbar.CollapsingToolbarScaffoldScope import me.onebone.toolbar.CollapsingToolbarScaffoldState import me.onebone.toolbar.CollapsingToolbarScope import me.onebone.toolbar.ExperimentalToolbarApi import me.onebone.toolbar.ScrollStrategy +import net.mullvad.mullvadvpn.compose.constant.AnimationDurationConstant.SCREEN_ENTER_TRANSITION @OptIn(ExperimentalToolbarApi::class) @Composable @@ -36,9 +39,9 @@ fun CollapsingToolbarScaffold( toolbar: @Composable CollapsingToolbarScope.() -> Unit, body: @Composable CollapsingToolbarScaffoldScope.() -> Unit, ) { + val context = LocalContext.current val dynamic = remember { mutableStateOf(0.dp) } val systemUiController = rememberSystemUiController() - systemUiController.setStatusBarColor(backgroundColor) systemUiController.setNavigationBarColor(backgroundColor) var isCollapsable by remember { mutableStateOf(false) } @@ -48,6 +51,11 @@ fun CollapsingToolbarScaffold( state.toolbarState.expand() } } + LaunchedEffect(Unit) { + delay(SCREEN_ENTER_TRANSITION) + systemUiController.setStatusBarColor(backgroundColor) + } + val totalHeights = remember { mutableStateOf(0.dp) } val localDensity = LocalDensity.current diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt index fb9e3b380b60..02f02e16a000 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt @@ -14,14 +14,17 @@ import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.layout.onGloballyPositioned +import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.platform.LocalDensity import com.google.accompanist.systemuicontroller.rememberSystemUiController +import kotlinx.coroutines.delay import me.onebone.toolbar.CollapsingToolbarScaffold import me.onebone.toolbar.CollapsingToolbarScaffoldScope import me.onebone.toolbar.CollapsingToolbarScaffoldState import me.onebone.toolbar.CollapsingToolbarScope import me.onebone.toolbar.ExperimentalToolbarApi import me.onebone.toolbar.ScrollStrategy +import net.mullvad.mullvadvpn.R @OptIn(ExperimentalMaterial3Api::class) @Composable @@ -61,8 +64,8 @@ fun CollapsableAwareToolbarScaffold( toolbar: @Composable CollapsingToolbarScope.() -> Unit, body: @Composable CollapsingToolbarScaffoldScope.() -> Unit ) { + val context = LocalContext.current val systemUiController = rememberSystemUiController() - systemUiController.setStatusBarColor(backgroundColor) systemUiController.setNavigationBarColor(backgroundColor) var isCollapsable by remember { mutableStateOf(false) } @@ -72,6 +75,10 @@ fun CollapsableAwareToolbarScaffold( state.toolbarState.expand() } } + LaunchedEffect(Unit) { + delay(context.resources.getInteger(R.integer.transition_animation_duration).toLong()) + systemUiController.setStatusBarColor(backgroundColor) + } CollapsingToolbarScaffold( modifier = modifier.background(backgroundColor), diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/constant/AnimationDurationConstant.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/constant/AnimationDurationConstant.kt new file mode 100644 index 000000000000..37dc9d584cde --- /dev/null +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/constant/AnimationDurationConstant.kt @@ -0,0 +1,5 @@ +package net.mullvad.mullvadvpn.compose.constant + +object AnimationDurationConstant { + const val SCREEN_ENTER_TRANSITION: Long = 400 +} diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/SelectLocationScreen.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/SelectLocationScreen.kt index b76b097ad1f6..21dbc3179389 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/SelectLocationScreen.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/SelectLocationScreen.kt @@ -18,6 +18,7 @@ import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect +import androidx.compose.runtime.getValue import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.ExperimentalComposeUiApi @@ -26,6 +27,7 @@ import androidx.compose.ui.draw.rotate import androidx.compose.ui.focus.FocusRequester import androidx.compose.ui.focus.focusProperties import androidx.compose.ui.focus.focusRequester +import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.platform.testTag import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource @@ -34,6 +36,8 @@ import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.tooling.preview.Preview import androidx.core.text.HtmlCompat +import com.google.accompanist.systemuicontroller.rememberSystemUiController +import kotlinx.coroutines.delay import kotlinx.coroutines.flow.MutableSharedFlow import kotlinx.coroutines.flow.SharedFlow import net.mullvad.mullvadvpn.R @@ -69,7 +73,16 @@ fun SelectLocationScreen( onSearchTermInput: (searchTerm: String) -> Unit = {}, onBackClick: () -> Unit = {} ) { + val context = LocalContext.current + val backgroundColor = MaterialTheme.colorScheme.background + val systemUiController = rememberSystemUiController() + LaunchedEffect(Unit) { uiCloseAction.collect { onBackClick() } } + LaunchedEffect(Unit) { + delay(context.resources.getInteger(R.integer.transition_animation_duration).toLong()) + systemUiController.setStatusBarColor(backgroundColor) + } + val (backFocus, listFocus, searchBarFocus) = remember { FocusRequester.createRefs() } Column( modifier = diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/ui/fragment/SelectLocationFragment.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/ui/fragment/SelectLocationFragment.kt index 12f135ffed53..3c3f61598e1a 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/ui/fragment/SelectLocationFragment.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/ui/fragment/SelectLocationFragment.kt @@ -4,10 +4,8 @@ import android.os.Bundle import android.view.LayoutInflater import android.view.View import android.view.ViewGroup -import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.collectAsState import androidx.compose.ui.platform.ComposeView -import com.google.accompanist.systemuicontroller.rememberSystemUiController import net.mullvad.mullvadvpn.R import net.mullvad.mullvadvpn.compose.screen.SelectLocationScreen import net.mullvad.mullvadvpn.compose.theme.AppTheme @@ -28,10 +26,6 @@ class SelectLocationFragment : BaseFragment(), StatusBarPainter, NavigationBarPa return inflater.inflate(R.layout.fragment_compose, container, false).apply { findViewById(R.id.compose_view).setContent { AppTheme { - val systemUiController = rememberSystemUiController() - systemUiController.setStatusBarColor(MaterialTheme.colorScheme.background) - systemUiController.setNavigationBarColor(MaterialTheme.colorScheme.background) - val state = vm.uiState.collectAsState().value SelectLocationScreen( uiState = state,