大丰区住房和城乡建设局网站,小城镇建设网站,小程序 开发公司,c语言软件开和网站开发区别Scaffold 脚手架
Scaffold 脚手架组件是一个核心组件#xff0c;它为开发者提供了一个标准的、可定制的应用界面框架。androidx.compose.material3.Scaffold 包含了应用界面的基础元素#xff0c;如状态栏、导航栏、顶部应用栏#xff08;TopAppBar#xff09;等。通过 Sc…Scaffold 脚手架
Scaffold 脚手架组件是一个核心组件它为开发者提供了一个标准的、可定制的应用界面框架。androidx.compose.material3.Scaffold 包含了应用界面的基础元素如状态栏、导航栏、顶部应用栏TopAppBar等。通过 Scaffold开发者可以轻松地为应用添加这些常见组件并对其进行自定义。
Scaffold 特点
内置组件Scaffold 内置了状态栏、导航栏等常见组件开发者只需简单地配置参数就可以使用。易于定制Scaffold 虽然提供了默认的配置但开发者可以轻松地自定义这些组件的外观和行为。高度灵活Scaffold 的设计允许开发者在需要时添加或删除组件使其能够高度适应不同的应用需求。
Scaffold 声明及参数
Composable
fun Scaffold(modifier: Modifier Modifier,topBar: Composable () - Unit {},bottomBar: Composable () - Unit {},snackbarHost: Composable () - Unit {},floatingActionButton: Composable () - Unit {},floatingActionButtonPosition: FabPosition FabPosition.End,containerColor: Color MaterialTheme.colorScheme.background,contentColor: Color contentColorFor(containerColor),contentWindowInsets: WindowInsets ScaffoldDefaults.contentWindowInsets,content: Composable (PaddingValues) - Unit
): Unit参数名描述modifier用于修改 Scaffold 的布局属性比如大小、位置等。默认是 Modifier表示没有任何额外修饰。topBar用于定义应用的顶部栏通常是一个 TopAppBar。bottomBar用于定义应用的底部导航栏可以是一个 BottomAppBar 或其他自定义组件。floatingActionButton用于定义浮动的操作按钮通常是一个 FloatingActionButton。floatingActionButtonPosition定义浮动按钮的位置如 FabPosition.EndFabPosition.Center FabPosition.Start 或 FabPosition.EndOverlay。snackbarHost定义 Snackbar 的显示位置通常用于显示简短的提示信息。containerColor定义 Scaffold 容器的背景颜色。默认是 MaterialTheme.colorScheme.background即 Material 主题的颜色方案中的背景颜色。contentColor定义 Scaffold 内容区域的颜色。默认是 contentColorFor(containerColor)该函数会根据容器颜色自动选择一个合适的内容颜色。contentWindowInsets定义窗口内边距这些内边距通常用于考虑系统界面元素如状态栏、导航栏的空间。默认是 ScaffoldDefaults.contentWindowInsets。content一个可组合函数接受 PaddingValues 参数用于定义 Scaffold 的主要内容。这个函数是必需的因为它定义了用户在应用中看到的主界面。
Scaffold 运行示例
下例是 Scaffold 的使用及运行结果。
Composable
fun ScaffoldDemo() {Scaffold(topBar {// 定义顶部应用栏的内容TopAppBar(title { Text(顶部标题栏) })},bottomBar {// 定义底部应用栏的内容BottomAppBar( containerColor Color.Blue,contentColor Color.White,) {Text(modifier Modifier.fillMaxWidth(), text 底部导航栏, fontSize 20.sp, textAlign TextAlign.Center)}},floatingActionButton {// 定义浮动操作按钮的内容FloatingActionButton(onClick {}) {Icon(imageVector Icons.Default.Add, contentDescription Add)}},floatingActionButtonPosition FabPosition.Center,containerColor Color.LightGray,contentColor Color.Red,content { paddingValues -// 定义主要内容可以使用 paddingValues 来添加内边距Box(modifier Modifier.fillMaxSize().padding(paddingValues)) {Text(modifierModifier.fillMaxSize(), text 主界面, fontSize 24.sp, textAlign TextAlign.Center)}})
}