源码 https://github.com/webabcd/HarmonyDemo
作者 webabcd
开天辟地 HarmonyOS(鸿蒙) - 组件（按钮类）: Chip（带文字和图标的支持双状态的按钮）
示例如下:
pages\component\button\ChipDemo.ets
/** Chip - 带文字和图标的支持双状态的按钮*/import { TitleBar } from '../../TitleBar';
import { Chip, ChipSize, SymbolGlyphModifier } from '@kit.ArkUI';@Entry
@Component
struct ChipDemo {@State message: string = ""@State isActivated: boolean = falsebuild() {Column({ space: 10 }) {TitleBar()Text(this.message).fontSize(16)/** Chip - 带文字和图标的支持双状态的按钮* size - 尺寸* ChipSize.SMALL 或 ChipSize.NORMAL 或指定一个具体的尺寸（width 和 height）* direction - 布局方向（Direction 枚举）* Auto - 使用系统的默认布局方向* Ltr - 从左到右布局* Rtl - 从右到左布局* borderRadius - 圆角半径* enabled - 是否可用* allowClose - 是否显示关闭按钮（点击此按钮后，会移除当前 Chip 组件）* label - 按钮文字* text - 文字内容* fontSize, fontColor, fontFamily - 字体样式* labelMargin - 文字与左右侧图标的间距* left, right* activatedFontColor - 激活状态时的颜色* prefixIcon, suffixIcon - 文字的左侧图标和右侧图标* src - 图标地址* size - 尺寸（width 和 height）* fillColor - 填充色* activatedFontColor - 激活状态时的颜色* prefixSymbol, suffixSymbol - 文字的左侧符号图标和右侧符号图标* normal - 普通状态的符号图标* activated - 激活状态的符号图标* activated - 是否是激活状态* backgroundColor - 普通状态的背景颜色* activatedBackgroundColor - 激活状态的背景颜色* onClose - 点击关闭按钮后的回调* onClicked - 点击 Chip 组件时的回调*/Chip({size: ChipSize.SMALL,direction: Direction.Auto,label: {text: "label",},enabled: true,allowClose: true,onClose:() => {this.message = "onClose()"},onClicked:() => {this.message = "onClicked()"},})Chip({allowClose: false,size: ChipSize.NORMAL,label: {text: "label",fontSize: 12,fontColor: Color.Red,fontFamily: "HarmonyOS Sans",labelMargin: { left: 20, right: 30 },activatedFontColor: Color.White},prefixIcon: {src: $r('app.media.app_icon'),size: { width: 16, height: 16 },fillColor: Color.Red,activatedFillColor: Color.White,},suffixIcon: {src: $r('app.media.ic_settings'),size: { width: 16, height: 16 },fillColor: Color.Red,activatedFillColor: Color.White,},activated: this.isActivated,backgroundColor: Color.Orange,activatedBackgroundColor: Color.Blue,onClicked:() => {this.isActivated = !this.isActivated}})Chip({allowClose: false,size: {width: 200,height: 50},label: {text: "label",fontSize: 12,fontColor: Color.Blue,fontFamily: "HarmonyOS Sans",labelMargin: { left: 16, right: 16 }},prefixSymbol: {normal: new SymbolGlyphModifier($r('sys.symbol.ohos_star')).fontSize(16).fontColor([Color.Red]),activated: new SymbolGlyphModifier($r('sys.symbol.ohos_star')).fontSize(16).fontColor([Color.White]),},suffixSymbol: {normal: new SymbolGlyphModifier($r('sys.symbol.ohos_trash')).fontSize(16).fontColor([Color.Red]),activated: new SymbolGlyphModifier($r('sys.symbol.ohos_trash')).fontSize(16).fontColor([Color.White]),},activated: this.isActivated,backgroundColor: Color.Orange,activatedBackgroundColor: Color.Blue,onClicked:() => {this.isActivated = !this.isActivated}})}}
}
源码 https://github.com/webabcd/HarmonyDemo
作者 webabcd
