鸿蒙开发-stateStyles

2024-05-18  本文已影响0人  激扬飞雪

import backgroundTaskManager from '@ohos.backgroundTaskManager'

@Entry
@Component
struct StateCase {
  @State message: string = '测试'
  @State textEnable: boolean = false

  @Styles  pressTextStyle(){
  .width(180)
  .height(100)
  .backgroundColor(0x00ffff)
}

  @Styles
  disTextStyle(){
    // .width(180)
    // .height(100)
    .backgroundColor(Color.Red)
  }

  @Styles
  inputFouceStyle() {
    .backgroundColor(Color.Transparent)
    .border({
      color: Color.Red,
      width: 1
    })
  }

  @Styles
  inputNorStyle() {
    .backgroundColor(Color.Transparent)
    .border({
      color: Color.Red,
      width: 0
    })
  }
  build() {
    Row() {
      Column() {
        TextInput()
          .stateStyles(
            {
              focused: this.inputFouceStyle,
              normal: this.inputNorStyle
            }
          )

        TextInput()
          .stateStyles(
            {
              focused: this.inputFouceStyle,
              normal: this.inputNorStyle
            }
          )
        Text(this.message)
          .textAlign(TextAlign.Center)
          .width(100)
          .height(50)
          // .backgroundColor('#ff00ff')
          .stateStyles({
            pressed: this.pressTextStyle,
            disabled: this.disTextStyle
          })
          .enabled(this.textEnable)

        Button('文本设置')
          .onClick(() => {
            this.textEnable = !this.textEnable
          })
      }
      .width('100%')
    }
    .height('100%')
  }
}
上一篇 下一篇

猜你喜欢

热点阅读