[英]How can I add an Icon to to Box Decoration?
I want to add an Icon to Box Decoration like this you are seeing images on left side.我想像这样在盒子装饰中添加一个图标,您会在左侧看到图像。
How do I add this with box decoration我如何在盒子装饰中添加这个
Here is the code:这是代码:
Container( width: 307, decoration: BoxDecoration( border: Border.all(color: Colors.blueAccent), borderRadius: BorderRadius.circular(10.0), shape: BoxShape.rectangle, ), child: CountryListPick( onChanged: (list){ print(list?.name); }, theme: CountryTheme( labelColor: Colors.white, isShowFlag:true, isShowCode: false, isShowTitle:true, isDownIcon: true, showEnglishName: true, ), ), ),
You can use this widget for a textfield with boxdecoration and icon:您可以将此小部件用于带有 boxdecoration 和图标的文本字段:
TextFormField(
key: Key(key),
controller: controller,
decoration: InputDecoration(
prefixIcon: Icon(icon), // <-- left icon
hintText: hintText,
border: OutlineInputBorder( //<--- decoration border
borderRadius: BorderRadius.all(Radius.circular(90.0)),
borderSide: BorderSide.none,
),
filled: true,
),
)
You can use a row as a children of container您可以将一行用作容器的子项
Container(
width: 307,
decoration: BoxDecoration(
border: Border.all(color: Colors.blueAccent),
borderRadius: BorderRadius.circular(10.0),
shape: BoxShape.rectangle,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Flexible(
child: Image.asset(
"assets/images/cover_placeholder.png",
height: 30,
width: 30,
fit: BoxFit.contain,
),
),
SizedBox(width: 12,),
Flexible(
child: CountryListPick(
onChanged: (list){
print(list?.name);
},
theme: CountryTheme(
labelColor: Colors.white,
isShowFlag:true,
isShowCode: false,
isShowTitle:true,
isDownIcon: true,
showEnglishName: true,
),
),
),
],
),
),
So you can use SizedBox or Container -
SizedBox(
width: 300.0,
height: 120.0,
child: Padding(
padding: const EdgeInsets.all(5.0),
child: Container(
child: Row(
children: <Widget>[
Material(
type: MaterialType.transparency,
child: Stack(
children: <Widget>[
Column(
children: <Widget>[
Container(
padding: const EdgeInsets.only(
top: 1.0, bottom: 1.0, right: 5.0),
height: 50.0,
width: 50.0,
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(15.0),
color: Colors.green[50],
),
child: IconButton(
icon: Icon(Icons.favorite),
color: Colors.red[700],
highlightColor: Colors.red,
onPressed: () {},
),
),
],
),
],
),
),
],
),
),
),
),
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.