英文:
How to remove default padding in OutlinedButton?
问题
我想要移除轮廓按钮的默认内边距。这是我的代码；
SizedBox(
width: 150.0,
child: OutlinedButton(
onPressed: () {
setState(() {
selected = index;
});
},
style: OutlinedButton.styleFrom(
backgroundColor: (selected == index) ? color : Colors.white,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(30),
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
),
padding: EdgeInsets.zero, // 这里设置内边距为零
),
child: Row(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(duration),
Text(dataPlan),
Text(price),
],
),
],
),
),
);
这个SizedBox被包装在一个ListView中。
这是我得到的结果；
我希望将左右的内边距移除，这样我就可以根据我的喜好进行自定义。谢谢。
英文:
I want to remove the default padding from an outlined button. This is my code;
SizedBox(
width: 150.0,
child: OutlinedButton(
onPressed: () {
setState(() {
selected = index;
});
},
style: OutlinedButton.styleFrom(
backgroundColor: (selected == index) ? color : Colors.white,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(30),
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
),
),
child: Row(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(duration),
Text(dataPlan),
Text(price),
],
),
],
),
),
);
The SizedBox is wrapped in a ListView.
This is the result I get;
I want the paddings at the left and right removed, so I can customize to my preference. Thanks.
答案1
得分: 1
在 Column 中添加此属性以减小小部件的大小。
Column(
mainAxisSize: MainAxisSize.min,
...
如果您有任何其他需要翻译的内容，请随时提出。
英文:
Add in Column this property to reduce size of the widget.
Column(
mainAxisSize: MainAxisSize.min
...
答案2
得分: 1
将以下属性添加到按钮样式中：
tapTargetSize: MaterialTapTargetSize.shrinkWrap
minimumSize: Size.zero
padding: EdgeInsets.zero
另外，在Column和Row上设置mainAxisSize为min：
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(duration),
Text(dataPlan),
Text(price),
],
),
],
)
英文:
Add the following properties to the button style:
tapTargetSize: MaterialTapTargetSize.shrinkWrap
minimumSize: Size.zero
padding: EdgeInsets.zero
In addition, set the mainAxisSize on the Column and on the row to min:
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(duration),
Text(dataPlan),
Text(price),
],
),
],
),
答案3
得分: 1
Just add minimumSize: Size.zero, padding: EdgeInsets.zero, in OutlinedButton.styleFrom().
SizedBox(
width: 150.0,
height: 100,
child: OutlinedButton(
onPressed: () {
},
style: OutlinedButton.styleFrom(
minimumSize: Size.zero,
padding: EdgeInsets.zero,
backgroundColor: Colors.yellow,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(30),
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Column(
children: [
Text("duration"),
Text("dataPlan"),
Text("price"),
],
),
],
),
)
)
英文:
Just add minimumSize: Size.zero,padding: EdgeInsets.zero, in OutlinedButton.styleFrom()
SizedBox(
width: 150.0,
height:100,
child: OutlinedButton(
onPressed: () {
},
style: OutlinedButton.styleFrom(
minimumSize: Size.zero,
padding: EdgeInsets.zero,
backgroundColor: Colors.yellow,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(30),
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Column(
children: [
Text("duration"),
Text("dataPlan"),
Text("price"),
],
),
],
),
)),
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论