如何给按钮添加图片?

如果使用Image语句,应该添什么

如何给按钮添加图片?-鸿蒙开发者社区

图形图像
2024-06-26 13:11:53
浏览
收藏 0
回答 5
待解决
回答 5
按赞同
/
按时间
Franced

你要按钮是要用来点击吗 我觉得可以搞一个row或text然后设置背景图片和点击事件 或者弄一个row 然后里面放图片和按钮 把按钮的绝对位置放在图片中央 把按钮的背景颜色设置透明


分享
微博
QQ
微信
回复
2024-06-26 19:36:04
dstt_l3
@Entry
@Component
struct Page {
  @State message: string = 'Hello World';

  build() {
    RelativeContainer() {
      Button(this.message)
        .id('PageHelloWorld')
        .fontSize(50)
        .width('100%')
        .backgroundImage('https://img.alicdn.com/tfs/TB1rA_Tek9l0K4jSZFKXXXFjpXa-512-272.png') //设置背景图片
        .backgroundImageSize({width:'100%'})// 设置背景图片大小
        .backgroundColor('#00FFFF') // 设置背景色
    }
    .height('100%')
    .width('100%')
  }
}
分享
微博
QQ
微信
回复
2024-06-27 22:32:53
droidzxy
  1. // 加载png格式图片
  2. Image($r('app.media.ic_camera_master_ai_leaf'))
  3. .width(110).height(110).margin(15)
  4. .overlay('png', {align:Alignment.Bottom,offset: {x:0,y:20} })
  5. // 加载gif格式图片
  6. Image($r('app.media.loading'))
  7. .width(110).height(110).margin(15)
  8. .overlay('gif', {align:Alignment.Bottom,offset: {x:0,y:20} })


详细请参考,​​https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-image-V5​

分享
微博
QQ
微信
回复
2024-06-28 09:55:06
大黑布林李子
      Button({ type: ButtonType.Circle, stateEffect: true }) {
        Image($r('app.media.thumbup')).width(40).height(40)
      }
      .width(55)
      .height(55)
      .backgroundColor(0xF55A42)

参考

​https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-common-components-button-V5#自定义样式​

分享
微博
QQ
微信
回复
2024-07-02 16:06:12
Oliverly

@Entry

@Component

struct Index {

private Max_Seconds = 60

@State count: number = this.Max_Seconds

build() {

Column() {

Button(this.count == this.Max_Seconds ? "获取验证码" : this.count + "s").onClick(() => {

let intervalId = setInterval(() => {

console.log("=======" + this.count)

if (this.count <= 0) {

this.count = this.Max_Seconds

clearInterval(intervalId)

}else{

this.count--

}


}, 1000)

}).enabled(this.count == this.Max_Seconds ? true : false)

}

.width('100%')

.height('100%')

.justifyContent(FlexAlign.Center)

}

}

分享
微博
QQ
微信
回复
2024-08-09 10:31:44
相关问题
如何组件添加双击事件?
508浏览 • 1回复 待解决
HarmonyOS 如何 app 添加水印
376浏览 • 1回复 待解决
如何文字添加下划线?
642浏览 • 1回复 待解决
文本添加上划线如何实现?
413浏览 • 1回复 待解决
图片如何添加渐变模糊
1938浏览 • 1回复 待解决
鸿蒙-富文本如何添加图片
7122浏览 • 1回复 待解决
如何Image组件动态更改图片?
711浏览 • 1回复 待解决
图片设置replaceholderImage的方法
211浏览 • 1回复 待解决
自定义组件中如何添加图片
2597浏览 • 1回复 待解决
RichEditor添加、删除、重载图片
1082浏览 • 1回复 待解决
图片编辑-如何添加多个贴纸功能
92浏览 • 0回复 待解决
TabList可以添加图片么?
7894浏览 • 3回复 待解决