theapache64

    theapache64

    1 year ago
    🧭 Navigation Compose : How do i start (
    navigate
    ) a page (
    composable
    ) as transparent?
    ✏️ Rephrased : How to overlay one
    composable
    on another
    composable
    when using
    navigation-compose
    library? OR how to create transparent page?
    Colton Idle

    Colton Idle

    1 year ago
    Not sure I understand the question, but the new compose navigation animation in accompanist seems like it would be able to help tween between pages like this (the latest compose nav) actually uses a crossfade as a default anim.
    Shakil Karim

    Shakil Karim

    1 year ago
    This composable will be visible after Animation is completed, Or do you mean some thing else? @Composable fun SomeComposable(content: @Composable (Modifier) -> Unit) { val animatedAlpha = remember { Animatable(0f) } LaunchedEffect(animatedAlpha) { animatedAlpha.animateTo(1f, HighlightAppearanceAnimationSpec) } val uiActive by remember(animatedAlpha) { derivedStateOf { animatedAlpha.value != 0f } } if(uiActive) { //// Some UI } }
    theapache64

    theapache64

    1 year ago
    I think i need to rephrase my question 😄
    I am not talking about animating the transition. I want to overlay one
    composable
    on another
    composable
    Example : I’ve two destinations,
    A
    and
    B
    . When navigated from
    A
    to
    B
    i want to see
    A
    through
    B
    provided I’ve a transparent background in
    B
    ?
    NavHost(navController = navController, startDestination = "A") {
        composable("A") {
            Box(
                modifier = Modifier
                    .background(Color.Red)
                    .clickable {
                        navController.navigate("B")
                    }
                    .fillMaxSize()
            )
        }
        composable("B") {
            Box(
                modifier = Modifier
                    .background(Color.Blue.copy(alpha = 0.5f)) // I want to see A :'(
                    .fillMaxSize()
            )
        }
    }
    equivalent of
    @android:style/Theme.Translucent
    😄
    cc @Colton Idle @Shakil Karim
    Shakil Karim

    Shakil Karim

    1 year ago
    Isn't a simple Box useful in this case? Box { ComposableA() ComposableB() }
    theapache64

    theapache64

    1 year ago
    i mean, the navigation-compose’s
    composable
    😄 not normal
    @Composable
    they should have named it something else 😄
    i

    Ian Lake

    1 year ago
    The only
    FloatingWindow
    destinations (those that don't fully replace the previous destination) are
    dialog
    and
    bottomSheet
    theapache64

    theapache64

    1 year ago
    @Ian Lake Is there any future plan to support transparency on
    composable
    also? something like
    NavHost{
        composable(route = "B", isTransparent = true){
            ...
        }
    }
    which would render both
    B
    and the previous entry
    i

    Ian Lake

    1 year ago
    Only
    FloatingWindow
    destinations live above the previous entry