arkts_arkUI组件按钮点击改变颜色

import ark from '@system.ark';
import { View, Text, Button } from '@ui';
 
@Entry
@Component
struct MyComponent {
  @State color: string = '#ff0000'; // 初始颜色为红色
 
  build() {
    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
      Button('点击我')
        .onClick(() => {
          this.color = '#00ff00'; // 点击后改变颜色为绿色
        })
        .style({
          backgroundColor: this.color, // 使用状态变量动态设置背景色
          width: 200,
          height: 50,
        });
    }
    .width('100%')
    .height(300)
  }
}

arkts_arkUI组件按钮点击改变颜色

posted @ 2024-05-04 14:18  txwtech  阅读(796)  评论(0编辑  收藏  举报