I'm working on a routing/navigation library for Jetpack compose (with a particular focus on being capable of supporting multiple modules). I'd like to hear about people's navigation requirements (beyond forward/back/modal presentation), such as a screen presenting another screen within itself, master/detail screens for tablets or larger devices. I would also like to hear suggestions on the API for the library - I've posted a small example of how I think it might work in the thread below.

Is there already any way of custom fonts eg. ttf or otf inside compose? I only found

fontStyle

and

fontFamily

but can I set a specific font for a fontFamily..?

@Composable fun onDispose(callback: () -> Unit)

will this accept a

@Composable

which actually returns a value now? Something like:

@Composable fun disposeEverything() : Boolean

?

I have a hard time understanding

Column

,

Row

,

modifier=

and

Gravity

Do anyone have reasonable (sane) explanation on how I can achieve following tricky thing (see picture). Here's the code where this layout is built, I want the "5 Center End me!" to be centered vertically (up-down) (as shown), but I can't find any reasonable way to do it in dev03, this was achievable in dev02...

@Composable
fun CardGravityTest()
{
    Card(
            modifier = Spacing(all = 4.dp),
            color = Color.LightGray,
            shape = RoundedCornerShape(
                    5.dp
            )
    ){
        Column {
            Row {
                Surface(color = Color.Red,
                        modifier = Spacing(all = 4.dp)) {
                    Text(text = "1 XX")
                }
                Column(modifier = Flexible(1f) wraps Expanded wraps Spacing(4.dp)){
                    Surface(color = Color.Green){
                        Text(text="2 Flexible wraps Expanded(1f) wraps Spacing(4.dp) x x xx xxx xxxx x xx xxx x xxx")
                    }
                    Surface(color = Color.Magenta){
                        Text(text = "3 Second line xxxxx xxx xx xxxxx xxxx")
                    }
                }
                Column() {
                    Surface(color = Color.DarkGray) {
                        Text(text = "4 Column: OK High on top!")
                    }

                    Surface(color = Color.Yellow,
                            modifier = Gravity.End){
                        Text(text = "5 Center End me!",
                                modifier = Gravity.End)
                    }
                }
            }

            Divider()

            Row (modifier = Spacing(top = 4.dp)){
                Column (modifier = Flexible(1f) wraps Expanded){
                    Surface(color = Color.Blue, modifier = Gravity.Start) {
                        Text(text = "6 Row spacing top, Column Flexible(1f) wraps Expanded, Surface gravity start")
                    }
                }
                Column(modifier = Flexible(1f) wraps Expanded){
                    Surface(color = Color.Cyan, modifier = Gravity.End) {
                        Text(text = "7 Column Flexible wraps Expanded, Surface gravity end, " +
                                "paragraphstyle TextAlign.end ", paragraphStyle = ParagraphStyle(textAlign = TextAlign.End))
                    }
                }
            }

            Row {
                Surface(modifier = Spacing(all = 4.dp), color = Color.White) {
                    Text(text = "8 on Row")
                }
                Surface(modifier = Spacing(all = 4.dp), color = Color.Green)
                {
                    Text(text = "9 on Row")
                }
                Column(modifier = Gravity.Center wraps Flexible(1f)){
                    Surface(color = Color.Red) {
                        Text(text = "10 col center flex, line 1")
                    }
                    Surface(color = Color.DarkGray)
                    {
                        Text(text = "11 line 2 xxxxxx")
                    }
                }
                Column(modifier = Gravity.Center wraps Expanded) {
                    Surface(color = Color.Magenta, modifier = Gravity.End) {
                        Text(text = "12 col cnt mod end")
                    }
                }
            }


        }
    }
}

I’m trying to figure out how to use legacy android `View`s from composable functions, using the WebComponent sample here: https://cs.android.com/androidx/platform/frameworks/support/+/androidx-master-dev:ui/ui-android-view/src/main/java/androidx/ui/androidview/WebComponent.kt The integration looks very simple (just call the view as a function), but I can’t do this in my own project and it looks like the sample requires the

ui-android-view-non-ir

artifact, which is not published to Maven. Is it actually possible to do this integration with the artifacts that are currently published?

it’s possible without it, but that artifact does add a lot of “adapters” that would make your life a lot easier

Maybe a silly question - Is there still a use for Live Data, Data Binding & View Models if using Compose? From my understanding, Compose takes care of observing data with @Model, persisting state across config changes, and there's no more layout for databinding.

This message was deleted.

Did you rename crossAxisAlignment?

Is there a way to make a layout stable for state/memo calls, while changing a parent composable? Example:

@Composable fun Foo(x: Int){
    val bar: @Composable() (@Composable() ()->Unit) -> Unit = if(x == 1) ::BooFar else ::FooBar 
    bar {
       val stable = +memo { UUID.randomUUID().toString() }
       Text(text = stable)
    }
}

In XML it is possible to align neighbouring

TextView

on baseline (text baseline

app:layout_constraintBaseline_toBaselineOf

), is/will this be possible in @Compose ?

Hi everyone, I did a search but no luck - has anyone integrated a standard MapView with Compose? It seems like it should be easy but I’m just not certain what steps to take. Thanks for any tips/links!

Not sure if it's related to the compiler plugin but is there a known issue with the IR compiler where a Java SAM within a suspend function fails to compile? Java interface:

public interface JavaInterface {
    // this only happens when the method returns void
    void test();
}

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        GlobalScope.launch {
            test()
        }
    }
}

suspend fun test() {
    withContext(Dispatchers.Default) {
        // sam conversion won't compile
        val listener1 = JavaInterface {
            println("")
        }

        // this works
        val listener2 = object : JavaInterface {
            override fun test() {
                println("")
            }
        }
    }
}

Did anyone tried to compile

compose-runtime

by Kotlin/Native? I did quick and dirty port, and it more or less works

Anyone see what I'm doing incorrectly? I get the following error here

val icon = +imageResource(R.drawable.ic_my_location_white_24dp)

java.lang.NullPointerException: Attempt to invoke virtual method 'android.content.res.Resources android.content.Context.getResources()' on a null object reference Something to note: Using setViewContent instead of setContent since I'm using a custom map view

class MainActivity : AppCompatActivity() {
    val mapContext = MapContext()
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setViewContent {
            AppTheme {
                MapStack(mapContext = mapContext)
            }
        }
    }
}

@Composable
fun MapStack(webMap: WebMap = WebMap(), mapContext: MapContext) {
    Stack {
        MapComponent(mapContext = mapContext, map = webMap.map)

        aligned(Alignment.BottomRight){
            val icon = +imageResource(R.drawable.ic_my_location_white_24dp)
            FloatingActionButton(
                        icon = icon,
                        modifier = Spacing(left = 8.dp, top = 8.dp, right = 20.dp, bottom = 48.dp)
                )
        }
    }
}

Is my understanding right that back press handling / back stack functionality is not supported, but is on the roadmap at some point? I'm playing around with something related to this and would be curious what's the official standpoint on this. Thanks!

When reading Flutter tutorial I see some resemblence to @Compose, is this because of Material pattern which both use or some other type of cooperation...?

When i write following class:

@Model
Test(var test: String)

the Compose framework will observe it and recompose the UI when it changes. Can i also observe this class in my custom code outside of a @Composable function?

Can someone explain to me what this does?

private fun WebView.setRef(ref: (WebView) -> Unit) {
    ref(this)
}

Taken from ui/ui-android-view/src/main/java/androidx/ui/androidview/WebComponent.kt

Just noticed that changing a var in a @Model annotated class constructor doesn't trigger recomposition, only if the var is declared in the class body.

Can I use

val context = +ambient(ContextAmbient)

from a composable nested within setViewContent{ }? Currently seem to be getting an NPE because of this. Is there an alternative way of getting context? EDIT: Currently I'm doing this from my activity to get context to a listener into my composable function.

val context: Context = this
setViewContent {
        MapApp(context = context)
}

Is it possible yet to navigate from a view nested in setViewContent{ } to a view made of Composables? I'm trying to use ComposeView{ }, but I get the error "Composition requires an active composition context"

how are you going between screens? what are you using for navigation?

(the solution in the architecture patterns was not bad: a viewmodel that is retrievable per Activity.. )

Has someone figured out a way of back button navigation for compose?

I’m struggling to make a “quote indent” component where a bar on the left expands to the full height of X lines of text.

Like Slack’s.

This is what I was expecting to work:

Row {
    ColoredRect(
        color = (+MaterialTheme.colors()).onSurface.copy(alpha = 0.12f),
        width = 4.dp
    )
    Space(Width(8.dp))
    Text(toDo.text)
}

But what happens is that the

ColoredRect

expands infinitely in height, pushing any elements below the row out of sight. I’m using it as the

text

element in an

AlertDialog

. What am I doing wrong?

Trying to pop up an Alert Dialog and getting this error. Anyone come across this? "java.lang.IllegalArgumentException: Constraints should be satisfiable, but minHeight(0.ipx) > maxHeight(-75.ipx)"

I see that composable official tutorial still is using dev02, should it be like that ? https://developer.android.com/jetpack/compose/setup

Hi, I've been playing around with back navigation + screen history, and managed to create a working solution. Published article with link to GitHub project inside: https://twitter.com/ZsoltKocsi/status/1208753898330247168