編寫 flutter 代碼碰到一個錯誤
======== Exception caught by rendering library =====================================================
The following assertion was thrown during performLayout():
BoxConstraints forces an infinite width.
These invalid constraints were provided to _RenderColoredBox's layout() function by the following function, which probably computed the invalid constraints in question:
RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:268:14)
The offending constraints were: BoxConstraints(w=Infinity, h=44.0)
The relevant error-causing widget was:
Container file:///Users/project_github/flutter/my_flutter_demo/lib/error_page.dart:20:20
When the exception was thrown, this was the stack:
#0 BoxConstraints.debugAssertIsValid.<anonymous closure>.throwError (package:flutter/src/rendering/box.dart:517:9)
#1 BoxConstraints.debugAssertIsValid.<anonymous closure> (package:flutter/src/rendering/box.dart:559:21)
#2 BoxConstraints.debugAssertIsValid (package:flutter/src/rendering/box.dart:565:6)
#3 RenderObject.layout (package:flutter/src/rendering/object.dart:1677:24)
#4 RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:268:14)
...
The following RenderObject was being processed when the exception was fired: RenderConstrainedBox#e8eb9 relayoutBoundary=up2 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: bottom=0.0; offset=Offset(0.0, 515.0) (can use size)
... constraints: BoxConstraints(unconstrained)
... size: Size(360.0, 44.0)
... additionalConstraints: BoxConstraints(w=Infinity, h=44.0)
RenderObject: RenderConstrainedBox#e8eb9 relayoutBoundary=up2 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: bottom=0.0; offset=Offset(0.0, 515.0) (can use size)
constraints: BoxConstraints(unconstrained)
size: Size(360.0, 44.0)
additionalConstraints: BoxConstraints(w=Infinity, h=44.0)
... child: _RenderColoredBox#4f7c5 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(w=360.0, h=44.0)
... size: Size(360.0, 44.0)
... behavior: opaque
... child: RenderPositionedBox#c8a6c NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(w=360.0, h=44.0)
... size: Size(360.0, 44.0)
... alignment: center
... textDirection: ltr
... widthFactor: expand
... heightFactor: expand
... child: RenderParagraph#2f2e8 relayoutBoundary=up1 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: offset=Offset(152.0, 11.5) (can use size)
... constraints: BoxConstraints(0.0<=w<=360.0, 0.0<=h<=44.0)
... size: Size(56.0, 21.0)
... textAlign: start
... textDirection: ltr
... softWrap: wrapping at box width
... overflow: clip
... locale: en_US
... maxLines: unlimited
... text: TextSpan
... debugLabel: ((englishLike body1 2014).merge(blackMountainView bodyText2)).merge(unknown)
... inherit: false
... color: Color(0xff000000)
... family: Roboto
... size: 14.0
... weight: 500
... baseline: alphabetic
... decoration: TextDecoration.none
... "確認"
====================================================================================================
我的代碼
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class ErrorPage extends StatefulWidget {
@override
_MyErrorPageState createState() => _MyErrorPageState();
}
class _MyErrorPageState extends State<ErrorPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("測試頁面"),),
body: Stack(
children: [
Positioned(
bottom: 0,
child: Container(
color: Colors.green,
width: double.infinity,
height: 44,
alignment: Alignment.center,
child: Text(
"確認",
style: TextStyle(
color: Colors.black,
fontSize: 14,
fontWeight: FontWeight.w500
),
),
)
)
],
)
);
}
}
解決辦法
給Positioned 設置一個寬度即可
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class ErrorPage extends StatefulWidget {
@override
_MyErrorPageState createState() => _MyErrorPageState();
}
class _MyErrorPageState extends State<ErrorPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("測試頁面"),
),
body: Stack(
children: [
Positioned(
bottom: 0,
width: MediaQuery.of(context).size.width,//給 Positioned 設置一個寬度即可
child: Container(
color: Colors.green,
width: double.infinity,
height: 44,
alignment: Alignment.center,
child: Text(
"確認",
style: TextStyle(
color: Colors.black,
fontSize: 14,
fontWeight: FontWeight.w500),
),
))
],
));
}
}
