Hi! Is there a DatePicker / TimePicker for compose?

Attempting the Jetpack Compose Layouts Demo https://developer.android.com/codelabs/jetpack-compose-layouts?continue=https%3A%2F%2Fd[…]developer.android.com%2Fcodelabs%2Fjetpack-compose-layouts. Anyone know what to use instead of

Layout(
        modifier = modifier,
        children = children
    ) { measurables, constraints ->
       ...
    }

My Android Studio (on Compose alpha 9) is saying that API isn't available.

Is there a precompiled converter from vector drawable (or svg) to `ImageVector`’s builder code? I doubt that material icons from library are done by hand. I have a svg and I want to avoid converting to vector drawable altogether since it will convert to

ImageVector

in runtime anyway

hey everybody! how do you guys create a SearchView in Compose, you know, the one that is in the top bar? is there a native function for this?

How to set drawable left in android compose Text ?

What I am missing here in this layout arrangement, I want to bring Central Text to very next Dot , not in the center ? Here is my code :

ConstraintLayout(modifier = Modifier.fillMaxWidth()) {

    val (dot, title, deleteButton) = createRefs()

    Image(
        asset = vectorResource(id = if (!notifications.readFlag) R.drawable.ic_ellipse_red else R.drawable.ic_ellipse_white),

        modifier = Modifier
            .constrainAs(dot) {

                linkTo(
                    start = parent.start,
                    end = title.start
                )
                centerVerticallyTo(parent)
            }
    )

    Text(
        text = notifications.title,
        style = TextStyle(
            color = black33,
            fontSize = 14.sp,
            fontWeight = FontWeight.Bold,
            textAlign = TextAlign.Start
        ),
        modifier = Modifier.fillMaxWidth(0.9F).constrainAs(title) {

            linkTo(
                start = dot.end,
                end = deleteButton.start
            )
        }.padding(start = 10.dp)
    )

    Image(
        asset = vectorResource(id = R.drawable.ic_icon_delete_gray),
        modifier = Modifier.wrapContentSize()
            .clickable(
                onClick = {
                    showPopUpToDelete.value = true
                }
            ).constrainAs(deleteButton) {
                end.linkTo(parent.end)

                linkTo(
                    start = title.end,
                    end = parent.end
                )
            }
    )
}

This is how presently looking

Is there an working example from Google for implementing the BottomNavigationBar which includes navigation between multiple screens including onbackpress listener? For now i’ve only found these examples: https://cs.android.com/androidx/platform/frameworks/support/+/androidx-master-dev:na[…]in/java/androidx/navigation/compose/demos/BottomBarNavDemo.kt

I had prepared a

AutoCompleteTextField

few days ago but with the latest compose (alpha09) it seems like it's a bad idea to put a TextField inside a

LazyColumn

as one of its

item

, especially when its other items are decided based on what we type in the TextField, as I found my current implementation just gets stuck in an infinite loop of recomposition, freezing the textfield. Any best practices, guidelines to follow in this regard? What should we keep inside a LazyColumn and what we shouldn't?

Hi All! I'm working with

derivedStateOf

and wondering if there is any difference between the following 2 examples? Is one approach "better" than the other? Are there problems with one approach or the other? Is there an advantage to one over the other (other than just the amount of code)? Is example 2 a proper use of

derivedStateOf

? Am I likely to run into concurrency issues?

EXAMPLE 1

var UiState by mutableStateOf(MyCompositeDataClass(value1 = null, value2 = null))
   private set

init  {
    viewModelScope.launch {
        getValue1Flow().collect { UiState = UiState.copy(value1 = it) }
    }

    viewModelScope.launch {
        getValue2Flow().collect { UiState = UiState.copy(value2 = it) }
    }
}

EXAMPLE 2

private var state1 by mutableStateOf<String?>(null)
private var state2 by mutableStateOf<String?>(null)

val UiState by derivedStateOf {
    UiState(value1 = state1, value2 = state2)
}

init  {
    viewModelScope.launch {
        getValue1Flow().collect { state1 = it }
    }

    viewModelScope.launch {
        getValue2Flow().collect { state2 = it }
    }
}

I sometimes get warning of putting

modifier

as first optional argument. May I know why? I've some Custom Composables like

HeaderText

which used to have first parameter the text itself so I didn't need to write parameter names explicitly, but putting modifier as first parameter makes me lose this power.

Hey, anybody encountered an issue with the keyboard. It’s happening rarely. Textfield is not activating keyboard automatically when focused. Navigated to another screen and tapped to any other text field. No change. Then I restarted app

Hi I've been doing a deep dive into Compose these last few days. Am I correct in my understanding that

eventually

Compose will replace Fragments? Looking at the Compose navigation feature it leads me to believe that.

class MyActivity: AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            val navController = rememberNavController()
            NavHost(navController, startDestination = "") {
                composable("") { TestCompose() }
                composable("test") { TestCompose() }
            }
        }
    }
}

@Composable
fun TestCompose(vm: TestViewModel = viewModel()) {

}

Reading about the API viewModel it seems like using it in the manor I am, it's lifecycle gets attached to

MyActivity

and thus if I navigate multiple

TestCompose

views it will leak my ViewModel

Since Composables will eventually replace Fragments, I was wondering if we'll be able to scope ViewModels to Composables, or Composable destinations within Compose Navigation? Keeping lots of ViewModels all scoped to a single Activity, or keeping one god-ViewModel would both hold data for every page in memory concurrently, and that seems like a bad idea. Am I wrong, or is there another strategy the Compose folks are considering?

Do we have short syntx for remember in Compose?

var imageBitmap by remember { mutableStateOf<ImageBitmap?>(null) }

SwiftUI syntx read so much better @State var someValue = ""

Hello. Am looking into

JetNews

compose sample. It's still not migrated to navigation component nor does it use

LazyColumn

, it uses

ScrollableColumn

instead.

JetSurvey

doesn't implement navigation component too. Is there any sample that is up to date with everything, not just navigation and

LazyColumn

?

How to animate composable transitions when using

Navigation Component

?

Does using rememberSavedInstanceState always instead of remeber has any drawback? val list = rememberSavedInstanceState { mutableListOf<Int>() }

Hello, I'm struggling a bit with using Compose + Hilt ViewModel + Navigation component together. I took this code as an inspiration and at some point I'm calling the

viewModel

extension, which should use the Hilt factory underneath and create my

ViewModel

from it. Everything works fine, but when I'm adding the Compose

NavHost

to the mix, the composable inside it that calls

viewModel

just uses the generic factory instead the one generated by Hilt. I think it has something to do with this code from the source:

public fun NavHost(navController: NavHostController, graph: NavGraph) {
    var context = AmbientContext.current
    val lifecycleOwner = AmbientLifecycleOwner.current
    val viewModelStore = AmbientViewModelStoreOwner.current.viewModelStore
    ...
}

What is the right way to make them work together? I'm still not sure that I'm getting the Ambient concept right.

I'm receiving

java.lang.IllegalArgumentException: Invalid slot table detected

and I'm pretty sure it has nothing to do with using incompatible versions together. My setup is complicated, which means it would be very hard for me to isolate the issue. However, involved pieces are

AnimatedVisibility

and a button click listener. I would like to give more information if these ring any bells.

How can I combine 2 or more LazyRow/LazyVerticalGrid calls? I am trying to create a gridlayout with sections. Without compose I used

ConcatAdapter

once and it was very easy.

Hello! I’m trying to use webrtc with compose. I’ve created the following wrapper:

data class SurfaceViewContext(
    val eglBase: EglBase,
    val videoTrack: VideoTrack,
)

@Composable
fun SurfaceView(
    surfaceViewContext: SurfaceViewContext,
    modifier: Modifier,
) {
    val context = AmbientContext.current
    val customView = remember {
        SurfaceViewRenderer(context).apply {
            init(surfaceViewContext.eglBase.eglBaseContext, null)
            setEnableHardwareScaler(true)
            setMirror(true)
        }
    }

    AndroidView(
        { customView },
        modifier = modifier
    ) {
        surfaceViewContext.videoTrack.addSink(it)
    }
    onDispose {
        surfaceViewContext.videoTrack.removeSink(customView)
    }
}

And using it like this:

@Composable
fun TestView(context: SurfaceViewContext?) =
        Column(
                modifier = Modifier
                        .fillMaxWidth()
        ) {
            context?.let {
                SurfaceView(
                        it,
                        modifier = Modifier
                                .weight(1F)
                )
            }
            Box(
                    modifier = Modifier
                            .size(40.dp)
                            .background(Color.Red)
            )
            Text("hello",
                    color = Color.White,
                    modifier = Modifier
            )
            Box(
                    modifier = Modifier
                            .background(Color.Red)
                            .aspectRatio(1080F/1920)
                            .align(Alignment.End)
                            .padding(10.dp)
                            .weight(1F)
            ) {
                context?.let {
                    if (counter % 2 == 0) {
                        SurfaceView(
                                it,
                                modifier = Modifier
                                        .fillMaxSize()
                        )
                    }
                }
            }
            Text(
                    "hello again",
                    color = Color.White,
                    modifier = Modifier
                            .align(Alignment.End)
            )
        }

But there’s a bug. All views above SurfaceView, except an other SurfaceView, becomes invisible. I’ve added a counter and update the view once a second to add/remove a second SurfaceView. When it’s presented, the container containing it disappears, as well as other Box and Text. Text below is visible all the time. If I use Box instead of a Column as a main container, problem is the same. sample project: https://github.com/PhilipDukhov/ComposeWebRTCTest

Preview toolbar is not appearing for my compose function, is there any setting which I may be missing. PS I restarted android studio , it doesn't work As of now I am using compose alpha09 and its an existing project also consisting of non compose code for UI @Preview @Composable fun PreviewTopBar(){ SamplePreviewFunction() }

This message got lost in the noise, can anyone experienced with compose can give me a hand? Not sure if this is a but I should report or something I’m doing wrong

I am using a ScrollableColumn in an embedded ComposeView in a Fragment, but it is not scrolling all the way to the bottom as it should. I am sure it is sized properly, since I inserted the same way as the RecyclerView it replaces, and that works fine. Here is an example: the ‘time views’ are all locked to a constant height, so I would expect this to be okay. Has anybody else seen any issues with the ScrollableColumn like this?

Hello, I made a list of toggles but when I toggle them they are all moving at the same time instead of moving independently of each other. Any ideas how I can toggle them individually?

val checkedState = remember { mutableStateOf(true) }

    VerticalGrid(modifier = Modifier.padding(start = 30.dp, end = 30.dp)) {
        listOf(
            "Alarms",
            "Media",
            "Touch",
            "Reminders",
            "Events",
            "Repeat Callers"
        ).forEachIndexed { index, string ->
            Column(
                Modifier.fillMaxWidth().padding(20.dp),
                horizontalAlignment = CenterHorizontally,
                verticalArrangement = Arrangement.Center
            ) {
                CustomToggle(
                    color = accentColor,
                    selected = checkedState.value,
                    onClick = {
                        checkedState.value = !checkedState.value
                        toggleAtIndex(index)
                    }
                )
            }
        }
    }
}

fun toggleAtIndex(index: Int) {
    when (index) {
        0 -> println(0)
        1 -> println(1)
        2 -> println(2)
        3 -> println(3)
        4 -> println(4)
        5 -> println(5)
    }
}

Has anyone by chance tried using

GoogleMap.InfoWindowAdapter

in a Compose app? I tried returning a

ComposeView

from

getInfoContents()

but getting

java.lang.IllegalStateException: Composition view not present for measure!

I want to display list of items spanning multiple rows based on number of items, I'm tried putting

LazyRow

inside

FlowRow

but doesn't seem to work