I have a row of 3 buttons, but in some locales the text of the third button gets displayed strangely. Is it possible to move the third button in the new row if the text of the third button does not fit?

Row(modifier = modifier) {
        Box(
            modifier = Modifier.clickable { onConfirmClicked.invoke() },
            contentAlignment = Alignment.CenterStart
        ) {
            Text(
                text = stringResource(id = R.string.confirm), textAlign = TextAlign.Left,
                fontWeight = FontWeight.Medium,
                fontSize = 16.sp,
                color = colorResource(id = R.color.red)
            )
        }
        Box(
            modifier = Modifier
                .padding(start = 32.dp)
                .clickable { onRemoveClicked.invoke() },
        ) {
            Text(
                text = stringResource(id = R.string.dont_repeat),
                fontWeight = FontWeight.Medium,
                fontSize = 16.sp,
                color = colorResource(id = R.color.red_clickable_link)
            )
        }
        if (showEditButton) {
            Box(
                modifier = Modifier
                    .padding(start = 32.dp)
                    .clickable { onEditClicked.invoke() },
            ) {
                Text(
                    text = stringResource(id = R.string.edit),
                    fontWeight = FontWeight.Medium,
                    fontSize = 16.sp,
                    color = colorResource(id = R.color.red_clickable_link)
                )
            }
        }
    }

Is it possible to request json data or read from DataStore in async during splash screen loading in android with Jetpack compose ? Using

the new SplashScreen API

Hello 👋 do you know how to perform click on this button with jetpack compose in a test ?

https://kotlinlang.slack.com/archives/CJLTWPH7S/p1632315801270100 Some times when you are coding tired, you may end up mistaking the onClick lambda with the Composable one...damn it.

AppButton(label = "TE\$T") {
                            mediaPlayback.playPause()
                        }

previously, we could have vector drawables with theme colors, ex:

<vector xmlns:android="<http://schemas.android.com/apk/res/android>"
    android:width="184dp"
    android:height="184dp"
    android:viewportWidth="184"
    android:viewportHeight="184">
    <path
        android:fillColor="?attr/colorPrimary"
        android:fillType="evenOdd"
        android:pathData="M22 92a70 70 0 1 1 140 0 70 70 0 1 1-140 0" />

Hello, again! 👋 This might be a silly question, but I’m having a hard time trying to understand. Does the recomposition for a

State

only occurs when inside an action from a

@Composable

? For example:

var state by rememberSaveable { mutableStateOf(StateA) }
when (state) {
    StateA -> { if(condition) { state = StateB } else { state = StateC } } // This does not trigger
    StateB -> Button(onClick = state = StateD) { Text("Click me") }        // This works fine when clicked
    ...
}

I’m trying to do some condition check before showing UI for the user and tried using

State

. Any thoughts? Thanks a lot! ❤️

Any clue how to fix this in intellij 2021.2?

This version of the Android Support plugin for IntelliJ IDEA (or Android Studio) cannot open this project, please retry with version 2020.3.1 or newer.

I've been using the experimental API

AnimatedNavHost

and now tried to introduce parameters into my navigation starting with the doc example

arguments = listOf(navArgument("userId") { defaultValue = "me" })

but I get the compiler error "Type mismatch: inferred type is List<androidx.navigation.NamedNavArgument> but List<androidx.navigation.compose.NamedNavArgument> was expected". Does anyone know how to fix this (other than going back to regular

NavHost

, which works)?

Hi, i am using permission from accompanist

@Composable
fun MyAwesomeCompose() {
  val cameraPermissionState = rememberPermissionState(Manifest.permission.READ_CONTACTS)
}

@Preview
@Composable
fun MyPreview() {
  MyAwesomeCompose()
}

it am getting the following error from the preview

java.lang.IllegalStateException: Permissions should be called in the context of an Activity
at com.google.accompanist.permissions.PermissionsUtilKt.findActivity(PermissionsUtil.kt:105)
at com.google.accompanist.permissions.MutablePermissionStateKt.rememberMutablePermissionState(MutablePermissionState.kt:48)
at com.google.accompanist.permissions.PermissionStateKt.rememberPermissionState(PermissionState.kt:35)

I think i’ve asked this once before but did not get a reply from anyone. I’m wondering if there’s any good way to ues ModalBottomSheetLayout without having the top most layer know about all the possible modal sheets that might appear. In the old world, you’d create a BottomSheetDialog somewhere in your code and call the .show() function. The way it works in compose it seems like the top container needs to know about all the possible dialogs. I had tried to remember a composable function, but that seems to not really work.

I'm searching for a UI component to display a log file onto the screen. The User should be able to scroll through the log file. The Log file can be huge, so it should probably load the needed rows lazy Is there anything for that in jetpack compose or a library you know? It es quite difficult to search for "log file jetpack compose" because the answers most of the time refer to logcat or other Android Studio components

Is there a way to animate (e.g. crossfading) a text change?

Hello everyone. Pretty new to working with compose, and I'm a bit stuck on animations. I've done quite a bit of searching, but I'm still stuck. I know I just don't know the proper syntax, but can't find a relevant example so I am reaching out for help here. Can anyone enlighten me on the correct way to use a different tween for different states? Here's what I have, but I get a compile error of "Not enough information to infer type variable T" if I put the tween call in a conditional:

val transition = updateTransition(starState, label = "twinkle transition")

val alpha: State<Float> = transition.animateFloat(transitionSpec = {
    if (StarState.IDLE isTransitioningTo StarState.TWINKLE) {
        tween(durationMillis = 3000, easing = LinearOutSlowInEasing)
    } else {
        tween(durationMillis = 1500, easing = LinearOutSlowInEasing)
    }

    tween(durationMillis = 3000, easing = LinearOutSlowInEasing)
}, label = "alpha transition") { state ->
    if (state == StarState.TWINKLE) 1F else 0F
}

how does Compose solve the following problem? there exists a Row with a child Row the child Row must know what it's size will be in order to compute how to place it's children but the parent Row cannot know the size of it's child Row until it has measured the child Row, and the child Row cannot know what it's size will be until the parent Row has measured it for example parent Row

measure child Row

> child Row needs to know how big it will be in order to be able to layout it's children

> child Row needs information from parent Row

> > parent Row has no information because it is still trying to measure child Row

> > parent Row does not know how big child Row should be

> child Row does not know how big parent Row wants child Row to be

> child Row cannot measure itself reliably without assuming how big it is going to be

Hey! I'm curious about how

elevation

works in Compose. If two

Surfaces

with the same

elevation

are directly adjacent, they still cast a shadow on each other. How come? Is it possible to avoid this somehow? I would be super grateful for some guidance! Example and code in thread.

Hello, I am wondering how to maintain a global state in Compose, like I have a user that i fetch from my backend, and i want to be able to access the user object throughout the app lifecycle

This might be another snippet that triggers a compiler error. However, my compose version is not the latest (and I'm unable to upgrade it right now). Would you tell me if it's not fixed yet, so I can open an issue? (similar version that compiles in thread).

@Composable
fun Err() {
    suspend fun AwaitPointerEventScope.handler() {
        awaitPointerEvent(pass = PointerEventPass.Initial).changes.forEach {
            it // <-- triggers the compiler error
        }
    }

    Spacer(modifier = Modifier.pointerInput(Unit) {
        awaitPointerEventScope {
            handler()
        }
    })
}

I'm trying to embedded a PDFViewer with this library into my jetpack compose app: https://github.com/barteksc/AndroidPdfViewer I have read that we have to use the AndroidView class for embedding legacy views:

AndroidView(
                factory = { context ->

                    PDFView(context)
                })

The problem is that the constructor consumes an AttributeSet Object.

public PDFView(Context context, AttributeSet set) {

From where do i get this object? Didn't find anything on stackoverflow/google

Is it possible to draw to a Compose UI to a android.graphics.Canvas directly, without using AbstractComposeView or generally having it directly attached to a View? Do any of the test functionality do something similar? I was curious whether Compose is usable with an API like Wear watchfaces that has a service that renders to Canvas directly

androidx.wear.watchface.CanvasRenderer.render(canvas: Canvas, bounds: Rect, zonedDateTime: ZonedDateTime)

.

Im seeing some strange behavior with a CompositionLocal: if my top level composable function accepts a value of X, and defaults to LocalX.current; the value is null, even though it can never be null. If I specify LocalX.current inside the composable I get the proper value. Bug in compose?

I’m declaring an

AnimatedNavHost

which has many screens and the first one is the

HomeScreen

.

HomeScreen

has another

NavHost

to implement the navigation between the bottom navigation tabs. Here’s the steps to reproduce: 1. Select second tab in

HomeScreen

(or any other tab but the first) 2. Navigate to another screen declared inside the

AnimatedNavHost

(let’s say

DetailsTab2Screen

3. Press back. So the

HomeScreen

is displayed again with the second tab selected. 4. Press back again. The first tab of the

HomeScreen

is selected. 5. Press back again. The expected result is: the application must be closed The actual result is: the user has to press the back button again to leave the app. And if you repeat the steps 2 and 3, N times, the user has to press the back key N + 2 times to leave the app. Any thoughts?

is there any code samples with dynamic typography (i know some jetSamples have dynamic colors) - but i was interested in dynamic typography

Is there something special I need to do to enable overscroll glowing effects on a scrollable Column? (code in thread)

What would be the correct modifier to have a Row containing 2 Text that are adjacent but with the second one always visible, so that max width of the first one would be total width - second text width?

How can I preview an AlertDialog in compose? It is always empty for the code in thread.

In this video Mitch says there is no way to have a viewModel scoped to the lifecycle of a composable. So, he would use fragments to architect applications. The video is from 2020 so I was wondering whether Jetpack Compose has found any way out of this. This code snippet from the page https://developer.android.com/jetpack/compose/state seems useful here.

class HelloViewModel : ViewModel() {

    // LiveData holds state which is observed by the UI
    // (state flows down from ViewModel)
    private val _name = MutableLiveData("")
    val name: LiveData<String> = _name

    // onNameChange is an event we're defining that the UI can invoke
    // (events flow up from UI)
    fun onNameChange(newName: String) {
        _name.value = newName
    }
}

@Composable
fun HelloScreen(helloViewModel: HelloViewModel = viewModel()) {
    // by default, viewModel() follows the Lifecycle as the Activity or Fragment
    // that calls HelloScreen(). This lifecycle can be modified by callers of HelloScreen.

    // name is the current value of [helloViewModel.name]
    // with an initial value of ""
    val name: String by helloViewModel.name.observeAsState("")
    HelloContent(name = name, onNameChange = { helloViewModel.onNameChange(it) })
}

@Composable
fun HelloContent(name: String, onNameChange: (String) -> Unit) {
    Column(modifier = Modifier.padding(16.dp)) {
        Text(
            text = "Hello, $name",
            modifier = Modifier.padding(bottom = 8.dp),
            style = MaterialTheme.typography.h5
        )
        OutlinedTextField(
            value = name,
            onValueChange = onNameChange,
            label = { Text("Name") }
        )
    }
}

However I couldn't use it on my environment. Particularly, this line of code

fun HelloScreen(helloViewModel: HelloViewModel = viewModel())

is where the problem lies. My IDE isn't able to identify the

viewModel()

function here. Where is it coming from? Do I need any other dependency to make it work?

I’m implementing DeepLinks in compose navigation and I just realised that: This works:

private const val DEEP_LINK_URI = "<https://example.com>"

This doesn’t:

private const val DEEP_LINK_URI = "<http://www.example.com|www.example.com>"

Is this intentional or I’m missing something? Thanks 🙏

How can I make the check left-aligned? Code in 🧵. (If the image is blank, clicking on it seems to help)

Any news on writing widgets in Compose?