Android开发：Jetpack Compose Button,IconButton等各种Button的讲解

最新推荐文章于 2024-08-28 09:49:35 发布
最新推荐文章于 2024-08-28 09:49:35 发布
阅读量2.2k 收藏 1
点赞数
文章标签： android apache jetpack react native android studio
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Eqiqi/article/details/121859544
版权

前言

本文会讲解Button，IconButton, ExtendedFloatingActionButton, FloatingActionButton,IconToggleButton,OutlinedButton,RadioButton,TextButton这几个Button的用法详解，感兴趣的请往下看

一：Button的用法

先来看看Button的源码(OutlinedButton跟Button的属性一样只是两个按钮的形状不太一样)

@Composable
fun Button(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    elevation: ButtonElevation? = ButtonDefaults.elevation(),
    shape: Shape = MaterialTheme.shapes.small,
    border: BorderStroke? = null,
    colors: ButtonColors = ButtonDefaults.buttonColors(),
    contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
    content: @Composable RowScope.() -> Unit
) {
   ...
}
  • content 是表示Button的内容。比如里面可以是一个Text
  • onClick点击的回调
    @Preview()
    @Composable
    fun buttonTest(){
      val context = LocalContext.current
      Column(modifier = Modifier.padding(10.dp,10.dp)) {
          Button(
              onClick = {
                  Toast.makeText(context,"点击了登录",Toast.LENGTH_SHORT).show()
               }
          ){
              Text(text = stringResource(id = R.string.login))
          }
      }
    }
  • modifier 修饰符
  • enabled 是否可以 (不可用默认是灰色，可用默认是蓝色)
    @Preview()
    @Composable
    fun buttonTest(){
      val context = LocalContext.current
      Column(modifier = Modifier.padding(10.dp,10.dp)) {
          Button(
              onClick = {
                  Toast.makeText(context,"点击了登录",Toast.LENGTH_SHORT).show()
               },
              modifier= Modifier.size(80.dp, 40.dp).clip(RoundedCornerShape(20.dp)),
              enabled = true
          ){
              Text(text = stringResource(id = R.string.login))
          }
      }
    }
  • border 边框，BorderStroke(width,color)可以设置边框的颜色跟线的宽度。第一个参数width是边框线的宽度，color是边框线的颜色
    @Preview()
    @Composable
    fun buttonTest(){
      val context = LocalContext.current
      Column(modifier = Modifier.padding(10.dp,10.dp)) {
          Button(
              onClick = {
                  Toast.makeText(context,"点击了登录",Toast.LENGTH_SHORT).show()
               },
              modifier= Modifier.size(80.dp, 40.dp).clip(RoundedCornerShape(20.dp)),
              enabled = true,
              border = BorderStroke(1.dp,color = Color.Black)
          ){
              Text(text = stringResource(id = R.string.login))
          }
      }
    }
  • interactionSource 可以处理状态的，比如按下的时候什么效果，正常时候什么效果。类似之前再布局文件里写Selector。 比如我们下面的例子中设置，如果是选中时候边框线的颜色是绿色，没有选中时候是黑色。 interactionSource.collectIsPressedAsState() 判断是否按下状态interactionSource.collectIsFocusedAsState() 判断是否获取焦点的状态interactionSource.collectIsDraggedAsState() 判断是否拖动
    @Preview()
    @Composable
    fun buttonTest(){
      val context = LocalContext.current
      val interactionSource = remember {
          MutableInteractionSource()
      }
      val pressState = interactionSource.collectIsPressedAsState()
      val borderColor = if (pressState.value) Color.Green else Color.Black
      
      Column(modifier = Modifier.padding(10.dp,10.dp)) {
          Button(
              onClick = {
                  Toast.makeText(context,"点击了登录",Toast.LENGTH_SHORT).show()
               },
              modifier= Modifier.size(80.dp, 40.dp).clip(RoundedCornerShape(20.dp)),
              enabled = true,
              border = BorderStroke(1.dp,color = borderColor),
              interactionSource = interactionSource
          ){
              Text(text = stringResource(id = R.string.login))
          }
      }
    }
  • shape 形状 比如我们可以设置RoundedCornerShape(20)圆角20dp
  • elevation 阴影ButtonDefaults.elevation(defaultElevation,pressedElevation,disabledElevation)三个属性值，第一个defaultElevation表示默认的阴影，pressedElevation表示按下时的阴影，disabledElevation表示未启用时候的阴影。
    @Preview()
    @Composable
    fun buttonTest(){
      val context = LocalContext.current
      val interactionSource = remember {
          MutableInteractionSource()
      }
      val pressState = interactionSource.collectIsPressedAsState()
      val borderColor = if (pressState.value) Color.Green else Color.Black
      
      Column(modifier = Modifier.padding(10.dp,10.dp)) {
          Button(
              onClick = {
                  Toast.makeText(context,"点击了登录",Toast.LENGTH_SHORT).show()
               },
              modifier= Modifier.size(80.dp, 40.dp).clip(RoundedCornerShape(20.dp)),
              enabled = true,
              border = BorderStroke(1.dp,color = borderColor),
              interactionSource = interactionSource,
              shape = RoundedCornerShape(20),
              elevation = ButtonDefaults.elevation(2.dp,8.dp,0.dp)
          ){
              Text(text = stringResource(id = R.string.login))
          }
      }
    }
  • colors 通过ButtonDefaults.buttonColors(backgroundColor,contentColor,disabledBackgroundColor,disabledContentColor)设置颜色。第一个参数backgroundColor表示设置背景颜色，第二个参数contentColor表示设置内容颜色这里比如说是登录文本的颜色。第三个参数disabledBackgroundColor表示enable等于false的时候的背景颜色，第四个参数disabledContentColor表示enable等于false时候的内容的颜色。
    @Preview()
    @Composable
    fun buttonTest(){
      val context = LocalContext.current
      val interactionSource = remember {
          MutableInteractionSource()
      }
      val pressState = interactionSource.collectIsPressedAsState()
      val borderColor = if (pressState.value) Color.Green else Color.Black
      
      Column(modifier = Modifier.padding(10.dp,10.dp)) {
          Button(
              onClick = {
                  Toast.makeText(context,"点击了登录",Toast.LENGTH_SHORT).show()
               },
              modifier= Modifier.size(80.dp, 40.dp).clip(RoundedCornerShape(20.dp)),
              enabled = true,
              border = BorderStroke(1.dp,color = borderColor),
              interactionSource = interactionSource,
              elevation = ButtonDefaults.elevation(2.dp,8.dp,0.dp),
              shape = RoundedCornerShape(20),
              colors = ButtonDefaults.buttonColors(backgroundColor = Color.Red,contentColor = Color.Yellow,disabledBackgroundColor = Color.DarkGray,disabledContentColor = Color.Black)
          ){
              Text(text = stringResource(id = R.string.login))
          }
      }
    }

  • contentPadding 通过 PaddingValues()去设置。默认是ButtonDefaults.ContentPadding。表示内容的内边距。 PaddingValues有如下几个方法

    • PaddingValues(all) all表示上下左右都用该边距
    • PaddingValues(horizontal: Dp, vertical: Dp)
    • PaddingValues( start: Dp = 0.dp, top: Dp = 0.dp, end: Dp = 0.dp, bottom: Dp = 0.dp)
    @Preview()
@Composable
fun buttonTest(){
 val context = LocalContext.current
 val interactionSource = remember {
     MutableInteractionSource()
 }
 val pressState = interactionSource.collectIsPressedAsState()
 val borderColor = if (pressState.value) Color.Green else Color.Black
 
 Column(modifier = Modifier.padding(10.dp,10.dp)) {
     Button(
         onClick = {
             Toast.makeText(context,"点击了登录",Toast.LENGTH_SHORT).show()
          },
         modifier= Modifier.size(80.dp, 40.dp).clip(RoundedCornerShape(20.dp)),
         enabled = true,
         border = BorderStroke(1.dp,color = borderColor),
         interactionSource = interactionSource,
         elevation = ButtonDefaults.elevation(2.dp,8.dp,0.dp),
         shape = RoundedCornerShape(20),
         colors = ButtonDefaults.buttonColors(backgroundColor = Color.Red,contentColor = Color.Yellow,disabledBackgroundColor = Color.DarkGray,disabledContentColor = Color.Black),
         contentPadding = ButtonDefaults.ContentPadding
         // 或者是contentPadding = PaddingValues(4.dp)
     ){
         Text(text = stringResource(id = R.string.login))
     }
 }
}

二：IconButton的用法

IconButton的构造方法如下

@Composable
fun IconButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    content: @Composable () -> Unit
){
   ...
}
  • onClick 点击回调
  • modifier 修饰符
  • enabled 是否可用
  • content 该控件包含的内容
  • interactionSource 跟Button一样，可以根据不同状态去处理一些逻辑。比如按下时候如何，没有按下时候如何。

如下举例。比如IconButton是一个左边是+的icon，右边是文本的控件。该文本如果按下时候是显示减少，不按下显示添加。

@Preview()
@Composable
fun iconButtonTest(){
    val context = LocalContext.current
    val interactionSource = remember {
        MutableInteractionSource()
    }
    val pressState = interactionSource.collectIsPressedAsState()
    val pressText = if(pressState.value) "减少" else "添加"
    Column(modifier = Modifier.padding(10.dp,10.dp)) {
        IconButton(
            onClick = {
              Toast.makeText(context,"点击了添加",Toast.LENGTH_SHORT).show()
            },
            modifier = Modifier.size(80.dp,40.dp).clip(RoundedCornerShape(20)),
            enabled = true,
            interactionSource = interactionSource
            ){
             Row(verticalAlignment=Alignment.CenterVertically) {
               Icon(imageVector = Icons.Filled.Add, contentDescription = "添加的按钮",tint = Color.Red)
               Text(text = pressText,fontSize = 8.sp)
             }
        }
    }
}

三：FloatingActionButton和ExtendedFloatingActionButton的用法

FloatingActionButton是Material风格的控件，默认是浮动在右下角的圆形控件。FloatingActionButton的构造函数方法如下：

@Composable
fun FloatingActionButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    shape: Shape = MaterialTheme.shapes.small.copy(CornerSize(percent = 50)),
    backgroundColor: Color = MaterialTheme.colors.secondary,
    contentColor: Color = contentColorFor(backgroundColor),
    elevation: FloatingActionButtonElevation = FloatingActionButtonDefaults.elevation(),
    content: @Composable () -> Unit
){
    ...
}
  • onClick 点击回调
  • modifier 修饰符
  • interactionSource 跟上面一样，处理不同状态的
  • shape 形状
  • backgroundColor 背景颜色
  • contentColor内容颜色
  • elevation阴影
  • content 内容控件（其实ExtendedFloatingActionButton就是在该内容里添加了一个Row，Row里放了个文本跟Icon）
@Preview()
@Composable
fun floatingActionButtonTest(){
    val context = LocalContext.current
    val interactionSource = remember {
        MutableInteractionSource()
    }
    val pressState = interactionSource.collectIsPressedAsState()
    val pressText = if(pressState.value) "减少" else "添加"
    Column(modifier = Modifier.padding(10.dp,10.dp)) {
       FloatingActionButton(
            onClick = {
              Toast.makeText(context,"点击了按钮",Toast.LENGTH_SHORT).show()
            },
            modifier = Modifier.size(80.dp),
            interactionSource = interactionSource,
            shape = RoundedCornerShape(25.dp),
            backgroundColor = Color.Green,
            contentColor = Color.Blue,
            elevation = FloatingActionButtonDefaults.elevation(defaultElevation=8.dp,pressedElevation = 10.dp)
        ){
            Row(verticalAlignment=Alignment.CenterVertically) {
                Icon(imageVector = Icons.Filled.Add, contentDescription = "Add",tint = Color.Red)
                Spacer(modifier = Modifier.width(10.dp))
                Text(text = "按钮",fontSize =12.sp,color = Color.White)
            }
        }
}

ExtendedFloatingActionButton是FloatingActionButton的扩展 ExtendedFloatingActionButton的构造方法如下

@Composable
fun ExtendedFloatingActionButton(
    text: @Composable () -> Unit,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    icon: @Composable (() -> Unit)? = null,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    shape: Shape = MaterialTheme.shapes.small.copy(CornerSize(percent = 50)),
    backgroundColor: Color = MaterialTheme.colors.secondary,
    contentColor: Color = contentColorFor(backgroundColor),
    elevation: FloatingActionButtonElevation = FloatingActionButtonDefaults.elevation()
) {
    ...
}
  • text显示的文本控件
  • onClick 点击回调
  • modifier 修饰符
  • icon 显示的icon控件
  • interactionSource 跟上面一样，处理不同状态的
  • shape 形状
  • backgroundColor 背景颜色
  • contentColor内容颜色
  • elevation阴影 通过FloatingActionButtonDefaults.elevation(defaultElevation,pressedElevation)设置，第一个参数是默认阴影，第二个是按下时候的阴影
@Preview()
@Composable
fun extendedFloatingActionButtonTest(){
    val context = LocalContext.current
    val interactionSource = remember {
        MutableInteractionSource()
    }
    val pressState = interactionSource.collectIsPressedAsState()
    val pressText = if(pressState.value) "减少" else "添加"
    Column(modifier = Modifier.padding(10.dp,10.dp)) {
        ExtendedFloatingActionButton(text = { Text(text = pressText,fontSize =12.sp,color = Color.White)},onClick = {
            Toast.makeText(context,"点击了按钮",Toast.LENGTH_SHORT).show()
        },
//            modifier = Modifier.size(50.dp),
            icon ={
              Icon(imageVector = Icons.Filled.Add, contentDescription = "Add",tint = Color.Red)
            },
            interactionSource = interactionSource,
            shape = RoundedCornerShape(25.dp),
            backgroundColor = Color.Green,
            contentColor = Color.Blue,
            elevation = FloatingActionButtonDefaults.elevation(defaultElevation=8.dp,pressedElevation = 10.dp))
    }
}

四：IconToggleButton的用法

IconToggleButton是属于那种用于点赞，收藏的那种Icon可以改变状态的控件。代码如下：

@Composable
fun IconToggleButton(
    checked: Boolean,
    onCheckedChange: (Boolean) -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    content: @Composable () -> Unit
) {
   ...
}
  • checked 是否选中的状态
  • onCheckedChange 是否选中状态变化的监听
  • modifier 修饰符
  • enabled 是否可用
  • interactionSource 跟上面Button解释一致
  • content 控件内容

比如我们举个例子，在点赞按下或者选中的时候，用红色的点赞，否则用黑色的点赞图标

@Preview()
@Composable
fun iconToggleButtonTest(){
    val context = LocalContext.current
    val interactionSource = remember {
        MutableInteractionSource()
    }
    val pressState = interactionSource.collectIsPressedAsState()
    var isCheck = remember {
        mutableStateOf(false)
    }
    Column(modifier = Modifier.padding(10.dp,10.dp)) {
         IconToggleButton(
            checked = isCheck.value,
            onCheckedChange = {
             isCheck.value = it
            },
            modifier = Modifier.size(50.dp),
            enabled = true,
            interactionSource = interactionSource
        ){
               Icon(imageVector = Icons.Filled.Favorite, contentDescription = "点赞图标",tint = if(isCheck.value || pressState.value) Color.Red else Color.Black)
        }
    }
}

五：RadioButton的用法

RadioButton是单选按钮，RadioButton的代码如下

@Composable
fun RadioButton(
    selected: Boolean,
    onClick: (() -> Unit)?,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    colors: RadioButtonColors = RadioButtonDefaults.colors()
){
    ...
}
  • selected 是否选中
  • onClick 点击回调
  • modifier 修饰符
  • enabled 是否可用
  • interactionSource 跟上面Button解释一致
  • colors 设置颜色 RadioButtonDefaults.colors(selectedColor, unselectedColor,disabledColor)方法有三个参数，第一个selectedColor表示选中时候的颜色，第二个参数unselectedColor表示没有选中时候的颜色，第三个disabledColor表示不可用时候的颜色。
@Preview()
@Composable
fun iconToggleButtonTest(){
    val context = LocalContext.current
    val interactionSource = remember {
        MutableInteractionSource()
    }
    val pressState = interactionSource.collectIsPressedAsState()
    var isCheck = remember {
        mutableStateOf(false)
    }
    Column(modifier = Modifier.padding(10.dp,10.dp)) {
          RadioButton(
          selected = isCheck.value,
          onClick = {
            isCheck.value = !isCheck.value
          },
          modifier = Modifier.size(50.dp),
          enabled = true,
          interactionSource = interactionSource,
          colors = RadioButtonDefaults.colors(selectedColor = Color.Red,unselectedColor = Color.Black,disabledColor = Color.Gray))
    }
}

六：TextButton的用法

TextButton文本按钮，来看看TextButton的代码，其实TextButton就是new了Button。

@Composable
fun TextButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    elevation: ButtonElevation? = null,
    shape: Shape = MaterialTheme.shapes.small,
    border: BorderStroke? = null,
    colors: ButtonColors = ButtonDefaults.textButtonColors(),
    contentPadding: PaddingValues = ButtonDefaults.TextButtonContentPadding,
    content: @Composable RowScope.() -> Unit
) = Button(
    onClick = onClick,
    modifier = modifier,
    enabled = enabled,
    interactionSource = interactionSource,
    elevation = elevation,
    shape = shape,
    border = border,
    colors = colors,
    contentPadding = contentPadding,
    content = content
)
  • onClick 点击事件
  • modifier 修饰符
  • enabled 是否可用
  • interactionSource 跟Button一致
  • elevation 阴影
  • shape 形状设置
  • border 边框设置
  • colors 颜色设置
  • contentPadding 内容边距的设置
  • content 包含的控件
@Preview()
@Composable
fun textButtonTest(){
    val context = LocalContext.current
    val interactionSource = remember {
        MutableInteractionSource()
    }
    val pressState = interactionSource.collectIsPressedAsState()
    Column(modifier = Modifier.padding(10.dp,10.dp)) {
         TextButton(
            onClick = {
                Toast.makeText(context,"点击了登录",Toast.LENGTH_SHORT).show()
            },
            modifier = Modifier
                .size(80.dp, 40.dp)
                .clip(RoundedCornerShape(20)),
            enabled = true,
            interactionSource = interactionSource,
            elevation = ButtonDefaults.elevation(2.dp,8.dp,0.dp),
            shape = RoundedCornerShape(20),
            border = BorderStroke(1.dp, if(pressState.value) Color.Red else Color.Yellow),
            colors = ButtonDefaults.buttonColors(backgroundColor = Color.Blue,contentColor = Color.White,disabledBackgroundColor = Color.Gray,disabledContentColor = Color.Black),
            contentPadding = ButtonDefaults.ContentPadding) {
                Text(text = stringResource(id = R.string.login),fontSize = 14.sp)
        }
    }
}

文末

今天的文章就到这里，感谢您的阅读，有问题可以在评论区留言探讨，期待与大家共同进步。喜欢的话不要忘了三连。大家的支持和认可，是我分享的最大动力。

程序员一东
关注
Compose UI 之 Buttons 按钮 & IconButtons 图标按钮
VoidHope的博客
03-14 557
5 中类型的Button在渲染的效果上不尽相同，因此对于它们的使用描述总结如下。Button即：它是一个基础组件，通过不同的参数和子组件来创建特定的视觉效果和行为。在需要使用通用按钮，并且希望通过自定义来实现特殊外观或行为时，开发者直接使用Button。：它通常用于突出显示主要的操作或强调一个重要的交互点。它的背景色通常与品牌的主题色或强调色相一致，以便吸引用户的注意力。当用户看到一个填充按钮时，他们通常会认为这是页面上的一个主要行动点。：它是一个带有描边的按钮，但没有填充色。
Jetpack Compose 核心组件(Text, Images, Buttons)(6)
最新发布
面向价值，效用至上
09-16 967
在 Jetpack Compose 的世界里,核心组件是构建 Android UI的基础元素这些可组合元素是由Compose 框架提供的预构建 UI 组件它们是创建从简单文本显示到复杂交互式布局的基本构件核心组件的用途简化用户界面开发核心可组合元素抽象化创建和管理用户界面元素的复杂性.您无需编写冗长的代码来填充布局、创建视图和设置属性只需使用可组合函数,就能事半功倍地实现同样的效果.确保一致性核心组件遵循 Material Design 原则可确保在您的应用程序中提供。
Compose IconButton
罗小黑的博客
04-20 486
可以帮助我们生成一个可点击的图标按钮IconButton是一个可点击的图标，用于表示动作（复制，粘贴，保存，等等）。IconButton的整体最小触摸目标尺寸为，以满足无障碍准则。content会在IconButton内居中。这个组件通常用于应用栏内的导航图标/动作。content通常应该是一个图标，使用中的一个图标。如果使用自定义图标，请注意内部图标的典型尺寸是。
Android控件IconButton.zip
07-16
IconButton 是 Android 的 Button 子类，可以设置图片与文字都居中。 标签：IconButton
推荐项目：Android IconButton
gitblog_00413的博客
08-28 337
推荐项目：Android IconButton IconButtonA Button subclass for Android that provides better control over drawable positioning项目地址:https://gitcode.com/gh_mirrors/ic/IconButton 在Android应用开发中，如何优雅地展现带有图标的按钮，一直...
Android开发：Jetpack Compose编程知识全汇总 （含详细实例讲解）
2401_84010176的博客
05-04 705
Column和Row可以理解为在View/Layout体系中的纵向和横向的ViewGroupColumn(verticalArrangement:Arrangement // 控制纵向布局关系horizontalAlignment:Alignment // 控制横向对齐关系)Row(horizontalArrangement:Alignment // 控制横向布局关系verticalAlignment:Arrangement // 控制纵向对齐关系)@Composablefun TestColumnRow(
现代化 Android 开发：Jetpack Compose 最佳实践
1
07-17 1327
Compose 业务上能做的优化大体上就是这些了。总之我们就是我们要保持组件的颗粒度尽可能的小，容易变动的要独立出来，非常稳定的也要独立出来，尽量使用 Immutable 的数据结构。如此之后， Compose 的流畅度还是非常不错的。如果还觉得卡，那多半是因为你使用的是 Debug 包，Compose 会在 Debug 包加很多调试信息，会很影响其流畅度的。切换到 Release 包，可能丝滑感就出来了。为了帮助大家更好的熟知Jetpack Compose 这一套体系的知识点，
Android Compose 六：常用组件 Button
weixin_41648633的博客
05-16 1018
默认 elevation: ButtonElevation?= ButtonDefaults.buttonElevation(),Button可以添加子组件，那么问题来了，子组件也有点击事件，会冲突么，是被拦截了，还是都可以触发呢？再点方法 发现 用的是 buttonElevation。interactionSource 另找时间统一瞅瞅吧。前面Text里我们讲过 主题色会影响组件的颜色。结果： 点击到文字时 内部Text被点击了。滑动事件的拦截，瀑布流的效果。等 后续单独研究吧喇叭喇叭。
android button加icon
peakerli的专栏
06-28 3834
Button中是可以添加icon，用android:drawableLeft，icon可以用top,left等设置显示位置,drawableleft也可以是selector的xml                 android:layout_width="wrap_content" android:layout_height="wrap_content"
Android Jetpack Compose - Button
u011215710的博客
02-11 1264
简单示例 @Composable fun Button( text: String, modifier: Modifier = Modifier.None, onClick: (() -> Unit)? = null, style: ButtonStyle = ContainedButtonStyle() ) { Button(modifier = m...
Android控件IconButton扩展版.zip
07-17
IconButton 是一个老外大概两年前写的 Android 控件，可以让drawableLeft或drawableRight设置的图片与文字一起居中（那些用一个layout套一个ImageView和一个TextView来实现的感到解放了没？），效果如下图。 基于老外的这个项目，我将它迁入Android Studio，作了扩展以及打包成aar发布到JCenter中央仓库（可以通过声明依赖的方式引用了，不用再导入项目或拷贝代码到你的项目中）。 对其扩展的目的主要是为满足我们的设计师，所以实现了可以选择居中方式的策略（详见代码中的app里的布局文件），可以选择图文及间距居中，文字及间距居中以及只文字居中。且在此基础上新增了同样功能的IconCheckBox。 标签：IconButton
Android Compose Button按钮控件
qq_41899289的博客
09-13 1366
@Composable fun ButtonDemo(){ val btnValue=remember{ mutableStateOf("点击此处") } val count=remember{ mutableStateOf(0) } Column(modifier = Modifier.statusBarsPadding()) { //状态栏高度间距 //点击按钮 Butt.
countdown-timer:Jetpack Compose倒数计时器
03-06
在Android开发领域，Jetpack Compose是Google推出的新一代用户界面构建工具，它采用声明式编程方式，使得UI设计更加简洁高效。本项目"countdown-timer"是一个基于Jetpack Compose实现的倒数计时器，对于理解和掌握...
Jetpack Compose Button,IconButton等各种Button的讲解，安卓应用开发项目
2401_84149592的博客
04-08 981
最后为了帮助大家深刻理解。
android开发按钮图标(png)
03-26
android开发精美小按钮图标(png),包括各种规格大小的图片
ImageButton
jianchibuxie5的专栏
09-20 623
除了Android系统自带的Button按钮一万，还提供了带图标的按钮ImageButton   要制作带图标的按钮，首先要在布局文件中定义ImageButton，然后通过setImageDrawable方法来设置要显示的图标。 注意： 我们可以在布局文件中就直接设置按钮
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值