我在布局上遇到了一个很奇怪的问题。我已经创建了一个在所有android设备上都可以正常运行的屏幕,但是当我在iOS设备上运行相同的代码时,它被弄糟了,正在附加android和iOS的屏幕截图。这是此屏幕的代码。我在column
小部件中有card
的另一个屏幕中也面临着同样的问题。请帮我解决一下这个。
class _AddMoneyState extends State<AddMoney> {
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final Size size = MediaQuery.of(context).size;
return Scaffold(
appBar: new AppBar(
title: new Text('Add Money',
style: const TextStyle(color: Colors.white),),
),
body: new Container(
child: new ListView(
children: <Widget>[
new Container(
width: double.infinity,
height: 150.0,
padding: const EdgeInsets.all(10.0),
child: new Card(
elevation:5.0,
child: new Center(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new SizedBox(height: 30.0,),
new Text('ADD MONEY',
style: const TextStyle(color: Colors.blueGrey,
fontSize: 20.0),),
new Container(
width: 100.0,
child: new TextField(
keyboardType: TextInputType.number,
textAlign: TextAlign.center,
decoration: const InputDecoration(
hintText: 'Enter amount'
),
),
),
new SizedBox(height:10.0),
new Text('USD', style:
const TextStyle(color: Colors.blue,
fontSize: 20.0),),
],
),
),
),
),
new SizedBox(height: 5.0,),
new Container(
width: double.infinity,
height: 350.0,
padding: const EdgeInsets.all(10.0),
child: new Card(
elevation:5.0,
child: new Center(
child: new Column(
children: <Widget>[
new SizedBox(height: 10.0,),
new Text('CARD / BANK',
style: const TextStyle(fontSize: 16.0),),
new Text('DETAILS',
style: const TextStyle(fontSize: 16.0)),
new Container(
padding: const EdgeInsets.only(left: 60.0, right: 60.0),
child: new Form(
key: _formKey,
child: new Column(
children: <Widget>[
new Theme(
data: theme.copyWith(primaryColor: Colors.blue),
child: new TextFormField(
keyboardType: TextInputType.number,
style: const TextStyle(color: Colors.black),
decoration: new InputDecoration(
labelText: 'CARD NUMBER',
labelStyle: const TextStyle(color: Colors.grey,
fontSize: 12.0)
),
validator: (val) {
return val.isEmpty
? "Please enter card number"
: null;
},
onSaved: (String value) {
this.card_number = value;
// this._data.email = value;
}
),
),
new Theme(
data: theme.copyWith(primaryColor: Colors.blue),
child: new TextFormField(
keyboardType: TextInputType.number,
style: const TextStyle(color: Colors.black),
decoration: new InputDecoration(
labelText: 'CVV/SECURITY CODE',
labelStyle: const TextStyle(color: Colors.grey,
fontSize: 12.0)
),
validator: (val) {
return val.isEmpty
? "Please enter card number"
: null;
},
onSaved: (String value) {
this.card_number = value;
// this._data.email = value;
}
),
),
new Row(
children: <Widget>[
new Flexible(
child: new Theme(
data: theme.copyWith(primaryColor: Colors.blue),
child: new TextFormField(
keyboardType: TextInputType.number,
style: const TextStyle(color: Colors.black),
decoration: new InputDecoration(
labelText: 'MONTH',
labelStyle: const TextStyle(color: Colors.grey,
fontSize: 12.0)
),
validator: (val) {
return val.isEmpty
? "Please enter month"
: null;
},
onSaved: (String value) {
this.card_number = value;
// this._data.email = value;
}
),
),
),
new SizedBox(width: 10.0,),
new Flexible(
child: new Theme(
data: theme.copyWith(primaryColor: Colors.blue),
child: new TextFormField(
keyboardType: TextInputType.number,
style: const TextStyle(color: Colors.black),
decoration: new InputDecoration(
labelText: 'YEAR',
labelStyle: const TextStyle(color: Colors.grey,
fontSize: 12.0)
),
validator: (val) {
return val.isEmpty
? "Please enter month"
: null;
},
onSaved: (String value) {
this.card_number = value;
// this._data.email = value;
}
),
),
),
],
),
],
),
),
),
new Container(
padding: const EdgeInsets.only(left: 40.0),
child: new Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
new Checkbox(value: isCheck, onChanged: (bool value) {
setState(() {
isCheck = value;
});
}),
new Text("SAVE THIS CARD FOR FASTER CHECKOUT",
style: const TextStyle(fontSize: 10.0),),
],
),
),
new Container(
//width: size.width,
child: new RaisedButton(
child: new Text(
'ADD MONEY',
style: new TextStyle(
color: Colors.white
),
),
onPressed: (){
//sentMoney();
//print(Utils.token);
},
color: Colors.blueAccent,
),
margin: new EdgeInsets.only(
top: 5.0
),
),
],
),
),
),
),
],
),
),
);
}
}
这是logcat:
flutter: A RenderFlex overflowed by 3.4028234663852886e+38 pixels on
the bottom.
flutter:
flutter: The overflowing RenderFlex has an orientation of
Axis.vertical.
flutter: The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and
flutter: black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
flutter: Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the
flutter: RenderFlex to fit within the available space instead of being sized to their natural size.
flutter: This is considered an error condition because it indicates that there is content that cannot be
flutter: seen. If the content is legitimately bigger than the available space, consider clipping it with a
flutter: ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex,
flutter: like a ListView.
flutter: The specific RenderFlex in question is:
flutter: RenderFlex#34c92 relayoutBoundary=up1 OVERFLOWING
flutter: creator: Column ← Center ← DefaultTextStyle ← AnimatedDefaultTextStyle ←
flutter: _InkFeatures-[GlobalKey#0628f ink renderer] ← NotificationListener<LayoutChangedNotification> ←
flutter: CustomPaint ← _ShapeBorderPaint ← PhysicalShape ← _MaterialInterior ← Material ← Padding ← ⋯
flutter: parentData: offset=Offset(118.0, 0.0) (can use size)
flutter: constraints: BoxConstraints(0.0<=w<=347.0, 0.0<=h<=122.0)
flutter: size: Size(111.0, 122.0)
flutter: direction: vertical
flutter: mainAxisAlignment: center
flutter: mainAxisSize: max
flutter: crossAxisAlignment: center
flutter: verticalDirection: down
flutter:
◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢ ◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢ ◤◢◤ 颤动:
═══════════════════════════════════════════════ ══════════════════════════════════════════════════ ═══
以下是屏幕截图
答案 0 :(得分:0)
我遇到了问题,我正在覆盖字体,而我使用的字体在android上运行正常,但在iOS上却无法运行。我刚刚在main.dart
-
//fontFamily: 'DINLightAlternate'
现在它在iOS设备上也可以正常工作。