我发现无法在扑动中设置提升按钮的宽度。如果我已经很好地理解了,我应该把提升按钮放入大小框中。然后,我将能够设置框的宽度或高度。正确吗?还有别的办法吗?
在每个按钮周围创建一个大小框有点乏味,所以我想知道为什么他们选择这样做。我很确定他们这么做有一个很好的理由,但我不这么认为。
对于初学者来说,脚手架很难阅读和构建。
new SizedBox(
width: 200.0,
height: 100.0,
child: ElevatedButton(
child: Text('Blabla blablablablablablabla bla bla bla'),
onPressed: _onButtonPressed,
),
),
在我的例子中,我使用margin来改变大小:
Container(
margin: EdgeInsets.all(10),
// or margin: EdgeInsets.only(left:10, right:10),
child: RaisedButton(
padding: EdgeInsets.all(10),
shape: RoundedRectangleBorder(borderRadius:
BorderRadius.circular(20)),
onPressed: () {},
child: Text("Button"),
),
),
你可以像他们在评论中说的那样做,或者你可以省下力气,使用RawMaterialButton。什么都有,你可以把边界变成圆形
还有很多其他属性。Ex形状(增加半径使形状更圆)
shape: new RoundedRectangleBorder(borderRadius: BorderRadius.circular(25)),//ex add 1000 instead of 25
你可以使用你想要的任何形状作为按钮,通过使用手势检测器,它是一个小部件,在子属性下接受另一个小部件。
就像在另一个例子中
GestureDetector(
onTap: () {//handle the press action here }
child:Container(
height: 80,
width: 80,
child:new Card(
color: Colors.blue,
shape: new RoundedRectangleBorder(borderRadius: BorderRadius.circular(25)),
elevation: 0.0,
child: Icon(Icons.add,color: Colors.white,),
),
)
)
试试Container,我想我们会有更多的控制。
ElevatedButton(
style: ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20)),
onPressed: () {
buttonClick();
},
child: Container(
height: 70,
width: 200,
alignment: Alignment.center,
child: Text("This is test button"),
),
),
我喜欢的方法来提高按钮与匹配父是包装它与容器。
下面是示例代码。
Container(
width: double.infinity,
child: RaisedButton(
onPressed: () {},
color: Colors.deepPurpleAccent[100],
child: Text(
"Continue",
style: TextStyle(color: Colors.white),
),
),
)
只需使用FractionallySizedBox,其中widthFactor和highightfactor定义应用/父大小的百分比。
FractionallySizedBox(
widthFactor: 0.8, //means 80% of app width
child: RaisedButton(
onPressed: () {},
child: Text(
"Your Text",
style: TextStyle(color: Colors.white),
),
color: Colors.red,
)),