| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566 |
- @Component
- export struct YTButton {
- btHeight: number = 37
- btWidth: Length = '100%'
- btContent: string = ''
- btPadding: Length | Padding = 0
- btFontSize: number = 12
- bgc?: ResourceColor
- btFontColor: ResourceColor = Color.White
- btBorder?: BorderOptions
- btState: boolean = true
- btBorderRadius: Length | BorderRadiuses | LocalizedBorderRadiuses = 999
- btLinearGradient?: LinearGradientOptions
- btFontFamily?: ResourceStr
- btFontWeight?: string | number | FontWeight
- btShadow?: ShadowOptions | ShadowStyle
- @State private isClick: boolean = true
- click = () => {
- }
- @Styles
- pressStyles() {
- .opacity(0.9)
- }
- @Styles
- normalStyles() {
- .opacity(1)
- }
- aboutToAppear(): void {
- if (!this.bgc) {
- this.btLinearGradient = { angle: 92, colors: [['#FF4597F7', 0.023], ['#FF6B6DF7', 1.081]] }
- }
- }
- build() {
- Text(this.btContent)
- .fontSize(this.btFontSize)
- .fontColor(this.btFontColor)
- .backgroundColor(this.bgc)
- .height(this.btHeight)
- .width(this.btWidth)
- .textAlign(TextAlign.Center)
- .onClick(() => {
- this.isClick = false
- this.click()
- setTimeout(() => {
- this.isClick = true
- }, 1000)
- })
- .padding(this.btPadding ?? {})
- .border(this.btBorder)
- .shadow(this.btShadow)
- .enabled(this.btState ?? this.isClick)
- .borderRadius(this.btBorderRadius)
- .linearGradient(this.btLinearGradient)
- .fontFamily(this.btFontFamily)
- .fontWeight(this.btFontWeight)
- .stateStyles({
- pressed: this.pressStyles,
- normal: this.normalStyles
- })
- }
- }
|