【HarmonyOS】鸿蒙开发之Button组件——第3.4章
按钮范例[*]Capsule（默认值）：胶囊范例
Button("默认样式")
.height(40)//高度
.width(90)//宽度
.backgroundColor('#aabbcc')//背景颜色
运行结果:
https://i-blog.csdnimg.cn/blog_migrate/ffc2e38529a15160876b2ce726fe4cec.png
[*]Normal：矩形按钮，无圆角
Button({type:ButtonType.Normal}){
Text("自定义样式")
.fontSize(28)// 设置按钮文字大小
.fontColor(Color.Blue)
.padding(10)
}.borderRadius(8)// 设置圆角，但是没有效果
.backgroundColor("#aabbcc")
运行结果:
https://i-blog.csdnimg.cn/blog_migrate/2752fa0fe2a0590131982744392523b1.png
[*]Circle：圆形按钮
Button("样式二111",{type:ButtonType.Circle})
.width(100)
.backgroundColor('#aabbcc')
运行结果:
https://i-blog.csdnimg.cn/blog_migrate/79bc9e75f865f06377e9f4e7d09aff49.png
自定义样式
实例代码:
Button({type:ButtonType.Normal}){
Text("自定义样式")
.fontSize(28)// 设置按钮文字大小
.fontColor(Color.Blue)
.padding(10)
}.borderRadius(8)// 设置圆角，但是没有效果
.backgroundColor("#aabbcc")
Text().margin({top:10,bottom:10})
Button({type:ButtonType.Normal}){
Row(){
Image($r("app.media.app_icon"))
.width(50)
.margin({right:10})
Text("样式二")
}.padding(10)
}.borderRadius(8)// 设置圆角，但是没有效果
.backgroundColor("#aabbcc")
运行结果:
https://i-blog.csdnimg.cn/blog_migrate/72d479d4ddea570669915d5cfcf3e8dc.png
全部样式展示:
https://i-blog.csdnimg.cn/blog_migrate/037ee8fb81f4d627370ec28a16460cb6.png
button组件变乱介绍
常用变乱有:
onClick() 点击变乱
onHover() 鼠标指针移动到元素或它的子元素上时发生的变乱
onMouse() 鼠标移动变乱
onTouch() 触摸时发生的变乱
onKeyEvent() 按键时发生的变乱
onFocus() 按钮聚焦时发生的变乱
onBlur() 按钮失去焦点发生的变乱
onAppear() 按钮表现时发生的变乱
onDisAppear() 按钮消失发生的变乱
…
https://i-blog.csdnimg.cn/blog_migrate/4fb0271293efef50e02196c26d82ff9f.png
✨ 踩坑不易，还希望各位大佬支持一下 \textcolor{gray}{踩坑不易，还希望各位大佬支持一下} 踩坑不易，还希望各位大佬支持一下
页:
[1]