Android Jetpack Compose是否支持工具栏小部件?

时间:2020-01-24 14:36:10

标签: android android-toolbar androidx android-jetpack android-jetpack-compose

我想在Jetpack Compose中使用工具栏。它有这样的可组合组件吗?

4 个答案:

答案 0 :(得分:5)

通过1.0.0-alpha01,您可以使用TopAppBar

类似的东西:

Scaffold(
    topBar = {
        TopAppBar(
            title = {
                Text(text = "TopAppBar")
            },
            navigationIcon = {
                IconButton(onClick = { }) {
                    Icon(Icons.Filled.Menu)
                }
            },
            backgroundColor = Color.Blue,
            contentColor = Color.White,
            elevation = 12.dp
        )
    }, bodyContent = {
        //bodyContent()
    })

enter image description here

答案 1 :(得分:2)

是的,它是for n in range(0,len(new_followed)): prev_user_list.append(new_followed[n]) updated_user_df = pd.DataFrame(prev_user_list) updated_user_df.to_csv('{}_users_followed_list.csv'.format(strftime("%Y%m%d-%H%M%S"))) (在TopAppBar中)。它允许您指定标题,颜色,导航图标和操作。有关更多信息,请参见the documentation

答案 2 :(得分:2)

TopAppBar是预定义的可组合内容,可帮助您完成所需的工作。您可以将其与Scaffold配合使用,以获取基本的材料设计支架以连接TopAppBar。

下面是一个带有详细注释的示例,以了解如何使用它-https://github.com/vinaygaba/Learn-Jetpack-Compose-By-Example/blob/1f843cb2bf18b9988a0dfc611b631f216f02149e/app/src/main/java/com/example/jetpackcompose/material/FixedActionButtonActivity.kt#L70

将其复制到此处以方便使用

// Scaffold is a pre-defined composable that implements the basic material design visual
    // layout structure. It takes in child composables for all the common elements that you see
    // in an app using material design - app bar, bottom app bar, floating action button, etc. It
    // also takes care of laying out these child composables in the correct positions - eg bottom
    // app bar is automatically placed at the bottom of the screen even though I didn't specify
    // that explicitly.
    Scaffold(
        scaffoldState = scaffoldState,
        topAppBar = { TopAppBar(title = { Text("Scaffold Examples") }) },
        bottomAppBar = { fabConfiguration ->
            // We specify the shape of the FAB bu passing a shape composable (fabShape) as a
            // parameter to cutoutShape property of the BottomAppBar. It automatically creates a
            // cutout in the BottomAppBar based on the shape of the Floating Action Button.
            BottomAppBar(fabConfiguration = fabConfiguration, cutoutShape = fabShape) {}
        },
        floatingActionButton = {
            FloatingActionButton(
                onClick = {},
                // We specify the same shape that we passed as the cutoutShape above.
                shape = fabShape,
                // We use the secondary color from the current theme. It uses the defaults when
                // you don't specify a theme (this example doesn't specify a theme either hence
                // it will just use defaults. Look at DarkModeActivity if you want to see an
                // example of using themes.
                backgroundColor = MaterialTheme.colors.secondary
            ) {
                IconButton(onClick = {}) {
                    Icon(asset = Icons.Filled.Favorite)
                }
            }
        },
        floatingActionButtonPosition = Scaffold.FabPosition.CenterDocked,
        bodyContent = { modifier ->
            // Vertical scroller is a composable that adds the ability to scroll through the
            // child views
            VerticalScroller {
                // Column is a composable that places its children in a vertical sequence. You
                // can think of it similar to a LinearLayout with the vertical orientation.
                Column(modifier) {
                    repeat(100) {
                        // Card composable is a predefined composable that is meant to represent
                        // the card surface as specified by the Material Design specification. We
                        // also configure it to have rounded corners and apply a modifier.
                        Card(color = colors[it % colors.size],
                            shape = RoundedCornerShape(8.dp),
                            modifier = Modifier.padding(8.dp)
                        ) {
                            Spacer(modifier = Modifier.fillMaxWidth() + Modifier.preferredHeight(200.dp))
                        }
                    }
                }
            }
        }
    )

答案 3 :(得分:2)

使用

<块引用>

compose_version = '1.0.0-beta01'

Trump <- with(results, sum(votes[candidate == "DONALD J TRUMP"]))
Biden <- with(results, sum(votes[candidate == "JOSEPH R BIDEN"]))