List _tags = [ 'Apple', 'Banana', 'Lemon', ]; List _tags01 = [ 'item01', 'item02', 'item03', ]; String _action = 'Nothing'; List _selected = []; String _choice = 'Lemon'; TextStyle _titleStyle = TextStyle(fontSize: 20, fontWeight: FontWeight.bold); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('Gecer')), body: Container( padding: EdgeInsets.all(16.0), child: SingleChildScrollView( child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( 'Chip', style: _titleStyle, ), SizedBox( height: 16, ), Wrap( spacing: 8.0, runSpacing: 8.0, children: [ Chip( label: Text('骑行'), ), Chip( label: Text( '篮球', style: TextStyle(color: Colors.white), ), backgroundColor: Colors.redAccent, ), Chip( label: Text('跑步'), avatar: CircleAvatar( backgroundColor: Colors.redAccent, child: Text('G', style: TextStyle(color: Colors.white)), ), ), Chip( label: Text('Gecer'), avatar: CircleAvatar( backgroundImage: NetworkImage( 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1580978802188&di=f689c8ee27a5038881de40124bcac94a&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201812%2F06%2F20181206181119_fjgjo.jpg'), ), ), Chip( label: Text('666'), onDeleted: () {}, deleteIcon: Icon(Icons.delete), deleteIconColor: Colors.redAccent, deleteButtonTooltipMessage: 'Remove this tag', ), ], ), Divider( color: Colors.grey, height: 32.0, // indent: 32.0, ), Text( 'Chip-Delete', style: _titleStyle, ), SizedBox( height: 16, ), Wrap( spacing: 8.0, children: _tags01.map((tag) { return Chip( label: Text(tag), onDeleted: () { setState(() { _tags01.remove(tag); }); }, ); }).toList(), ), Divider( color: Colors.grey, height: 32.0, // indent: 32.0, ), Text( 'ActionChip: $_action', style: _titleStyle, ), SizedBox( height: 16, ), Wrap( spacing: 8.0, children: _tags.map((tag) { return ActionChip( label: Text(tag), onPressed: () { setState(() { _action = tag; }); }, ); }).toList(), ), Divider( color: Colors.grey, height: 32.0, // indent: 32.0, ), Text( 'FilterChip: ${_selected.toString()}', style: _titleStyle, ), SizedBox( height: 16, ), Wrap( spacing: 8.0, children: _tags.map((tag) { return FilterChip( label: Text(tag), selected: _selected.contains(tag), onSelected: (value) { setState(() { if (_selected.contains(tag)) { _selected.remove(tag); } else { _selected.add(tag); } }); }, ); }).toList(), ), Divider( color: Colors.grey, height: 32.0, // indent: 32.0, ), Text( 'ChoiceChip: $_choice', style: _titleStyle, ), SizedBox( height: 16, ), Theme( data: ThemeData(primaryColor: Colors.white), child: Wrap( spacing: 8.0, children: _tags.map((tag) { return ChoiceChip( label: Text(tag), selectedColor: Colors.redAccent, selected: _choice == tag, onSelected: (value) { setState(() { _choice = tag; }); }, ); }).toList(), ), ) ], ), ), )); }
作者:夜雨Gecer