Compose
文章平均质量分 51
lplj717
这个作者很懒,什么都没留下…
展开
-
Jetpack Compose——Slider(滑块控件)简单使用
基于compose_version=1.1.0-beta01版本 参数如下:Slider( value: Float,//当前值 onValueChange: (Float) -> Unit,//滑动时回调当前值 modifier: Modifier = Modifier,//布局修饰 enabled: Boolean = true,//是否启用或交互 valueRange: ClosedFloatingPointRange<Float> =原创 2021-12-22 14:23:13 · 1835 阅读 · 0 评论 -
Jetpack Compose——Scaffold(脚手架)、SnackBar(通知,类似Toast)的简单使用
该博客基于:compose_version = '1.1.0-beta01'脚手架实现了Material设计的页面基本结构。该组件通过确保其适当的布局策略从而将其他的多个组件组合在一起构成页面,包括标题栏、底部栏、SnackBar(类似Toast功能)、浮动按钮、抽屉组件、剩余内容布局等Scaffold首先来看看参数:Scaffold( modifier: Modifier = Modifier,//布局修饰 scaffoldState: ScaffoldState = r原创 2021-12-21 15:35:55 · 3242 阅读 · 0 评论 -
Jetpack Compose——TopAppBar(顶部应用程序栏)、BottomAppBar(底部应用程序栏)
该博客基于:compose_version = '1.1.0-beta01'TopAppBar:位于屏幕的顶部。一般包含标题,导航图标和其他的更多操作等BottomAppBar:位于屏幕的底部,一般显示导航和按键操作TopAppBar首先看看TopAppBar的参数:有两种参数类型TopAppBar( modifier: Modifier = Modifier,//布局修饰 backgroundColor: Color = MaterialTheme.colors.prim原创 2021-12-21 10:42:16 · 3318 阅读 · 0 评论 -
Jetpack Compose——DropdownMenu(下拉菜单)的简单使用
基于compose_version=1.1.0-beta01版本 参数如下:DropdownMenu( expanded: Boolean,//菜单栏状态 onDismissRequest: () -> Unit,//菜单栏被关闭回调 modifier: Modifier = Modifier,//布局修饰 offset: DpOffset = DpOffset(0.dp, 0.dp),//要添加到菜单位置的偏移量 properties: PopupPr原创 2021-12-20 17:17:44 · 3766 阅读 · 0 评论 -
Jetpack Compose——ProgressIndicator(进度条)的简单使用
CircularProgressIndicator(圆形进度条)首先看看参数,有两种构造CircularProgressIndicator( /*@FloatRange(from = 0.0, to = 1.0)*/ progress: Float,//进度 modifier: Modifier = Modifier,//布局修饰 color: Color = MaterialTheme.colors.primary,//进度指示器颜色 strokeWidt原创 2021-12-20 14:59:29 · 2474 阅读 · 0 评论 -
Jetpack Compose——AlertDialog的简单使用
参数:AlertDialog( onDismissRequest: () -> Unit,//当用户点击对话框外部或者按下返回按钮的时候会执行。注意:点击对话框的关闭按钮时并不会执行 buttons: @Composable () -> Unit,//可以自定义按钮的摆放位置及功能 modifier: Modifier = Modifier,//布局修饰 title: (@Composable () -> Unit)? = null,//对话框的标题原创 2021-12-16 14:48:21 · 871 阅读 · 0 评论 -
Jetpack Compose——AnimatedVisibility的简单使用
首先来看看参数:ColumnScope.AnimatedVisibility( visible: Boolean,//是否可见 modifier: Modifier = Modifier,//布局修饰 enter: EnterTransition = fadeIn() + expandVertically(),//进入动画,默认为垂直展开时淡入 exit: ExitTransition = fadeOut() + shrinkVertically(),//退出动画,原创 2021-12-16 10:28:09 · 441 阅读 · 1 评论 -
Jetpack Compose——ConstraintLayout简单使用
首先导入依赖implementation "androidx.constraintlayout:constraintlayout-compose:1.0.0-beta02"看看参数:ConstraintLayout( modifier: Modifier = Modifier,//布局修饰 optimizationLevel: Int = Optimizer.OPTIMIZATION_STANDARD,//布局修饰 crossinline content: @Comp原创 2021-12-15 17:40:45 · 2155 阅读 · 0 评论 -
Jetpack Compose——LazyRow、LazyColumn简单使用
LazyRow:LazyRow( modifier: Modifier = Modifier,//布局修饰 state: LazyListState = rememberLazyListState(),//列表状态 contentPadding: PaddingValues = PaddingValues(0.dp),//内边距 reverseLayout: Boolean = false,//反转滚动和布局的方向 horizontalArrangement:原创 2021-12-15 15:18:00 · 2344 阅读 · 1 评论 -
Jetpack Compose——Switch、CheckBox、RadioButton简单介绍
Switch首先看看参数:Switch( checked: Boolean,//是否选中 onCheckedChange: ((Boolean) -> Unit)?,//点击回调 modifier: Modifier = Modifier,//布局修饰 enabled: Boolean = true,//是否可用 interactionSource: MutableInteractionSource = remember { MutableIntera原创 2021-12-15 13:55:13 · 1689 阅读 · 0 评论 -
Jetpack Compose——remember、mutableStateOf、rememberSaveable
1,mutableStateOf:标识这个data是有状态的,如果状态发生了改变,所有引用这个状态的View都需要重新绘制2,remember:存储值,当界面重新绘制,会读取之前的值,相当于在mutableStateOf 之上又增加了一层内容:把这个变量的值存储脱离函数,即这个函数再次执行这个值并不会变成初始值,但如果页面切换,会失效3,rememberSaveable:在remember 上保证了可以在页面切换的过程中保存数据rememberSaveable== remeber + onSave原创 2021-12-15 11:21:53 · 1887 阅读 · 0 评论 -
Jetpack Compose——Modifier的基本属性简单介绍
首先来看一个简单的例子: Column { Box( Modifier .size(100.dp) .background(Color.Green) .padding(16.dp) ) Box( Modifier .size(100.dp) .原创 2021-12-14 17:27:19 · 3313 阅读 · 0 评论 -
Jetpack Compose——Image使用Coli加载网络图片(包含GIF、SVG)
首先添加依赖: implementation("io.coil-kt:coil:1.4.0") implementation("io.coil-kt:coil-compose:1.4.0")记得别忘记在manifest添加网络权限:<uses-permission android:name="android.permission.INTERNET" />简单使用: Image(modifier = Modifier ..原创 2021-12-14 10:40:11 · 6109 阅读 · 0 评论 -
Jetpack Compose——Image(图片)的使用
首先来看看基本的参数:@Composablefun Image( painter: Painter, contentDescription: String?, modifier: Modifier = Modifier, alignment: Alignment = Alignment.Center, contentScale: ContentScale = ContentScale.Fit, alpha: Float = DefaultAlpha,原创 2021-12-13 18:07:13 · 4043 阅读 · 0 评论 -
Jetpack Compose——TextField及OutlinedTextField(文本框)的使用
TextField的构造@Composablefun TextField( //输入的文本内容 value: String, //更新文本触发回调,类似EditText中addTextChangedListener onValueChange: (String) -> Unit, //样式 modifier: Modifier = Modifier, //控制TextField的启用状态,false:文本字段不可编辑不可聚焦 en原创 2021-12-13 15:24:58 · 4773 阅读 · 0 评论 -
Jetpack Compose——Button(按钮)的使用
Button这个组件,官方已经实现了Material Design的效果,一般来说我们直接使用这个即可,另外官方也是给我们封装了不同类型的Button,分别为IconButton、TextButton、OutlinedButton、IconToggleButton先来看一下简单的使用效果: Button(onClick = { println("点击了按钮") }) { Icon(Icons.Default.Search, contentDescription原创 2021-12-10 17:54:17 · 3811 阅读 · 0 评论 -
Jetpack Compose——Icon(图标)的使用
Compose获取资源方式:文本 -> stringResource(R.string.hello_world)颜色 -> colorResource(R.color.black)尺寸 -> dimensionResource(R.dimen.padding)图片 -> painterResource(R.drawable.head_icon)Icon:首先看看Icon的接收参数类型:contentDescription:是给无障碍人使用的文本描述,考虑到一些.原创 2021-12-10 15:35:44 · 6098 阅读 · 0 评论 -
Jetpack Compose——layout(布局)Column,Row,Box的简单介绍
在没有使用任何排列布局方式时,Compose默认会将他们堆叠在一起@Composablefun layoutTest() { Text("Alfred Sisley", color = colorResource(id = R.color.purple_500)) Text("3 minutes ago")}首先来看看Compose的标准布局组件上代码: Row {//行 Text("3 minutes ago", Mod原创 2021-12-10 10:54:54 · 3004 阅读 · 0 评论 -
Jetpack Compose——Text(文本)的使用
首先来看一些基础的参数: Text(text = "hello world", fontSize = 30.sp)//设置字体大小 Text( text = stringResource(id = R.string.hello_world),//设置为资源中的文字 color = colorResource(id = R.color.purple_500)//设置字体颜色 ) Text(tex原创 2021-12-09 15:53:40 · 3124 阅读 · 0 评论