Emir Bolat
Reputation: 1049
Getting Error While Placing Flutter TextFormField
I have an application like this:
There is nothing wrong with the blue background at the top. But I want to show profile edit screen below this box. I will also add a TextFormField to enter the name-surname information.
Now I have added Text to show the screen. Normally, there will be TextFormField in the section where Text is.
My codes are as follows:
class settingsScreen extends StatefulWidget {
@override
State<settingsScreen> createState() => _settingsScreenState();
}
class _settingsScreenState extends State<settingsScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
Container(
decoration: BoxDecoration(
color: Colors.blueAccent,
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(30),
bottomRight: Radius.circular(30),
),
),
height: 250,
width: double.infinity,
child: Column(
children: [
SizedBox(height: 35,),
FutureBuilder<String>(
future: getImage(),
builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
if(snapshot.hasData) {
return CircleAvatar(
backgroundImage: NetworkImage(snapshot.data),
radius: 65,
);
} else {
return Center(
child: CircularProgressIndicator()
);
}
}
),
SizedBox(height: 18,),
Text(ad, style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold, color: Colors.white),),
],
),
),
SizedBox(height: 45,),
Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text("Name-surname: ", style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold, color: Colors.black),),
TextFormField(
decoration: InputDecoration(
hintText: "Name-surname",
hintStyle: TextStyle(
fontSize: 20,
color: Colors.grey[400],
),
border: InputBorder.none,
),
style: TextStyle(
fontSize: 20,
color: Colors.black,
),
onChanged: (String value) {}
),
//Text(ad, style: TextStyle(fontSize: 20, color: Colors.black),), // Text I added to show the screen
],
),
],
),
]
),
);
}
}
In the console, I get the following output:
════════ Exception caught by rendering library ═════════════════════════════════
The following assertion was thrown during performLayout():
An InputDecorator, which is typically created by a TextField, cannot have an unbounded width.
This happens when the parent widget does not provide a finite width constraint. For example, if the InputDecorator is contained by a Row, then its width must be constrained. An Expanded widget or a SizedBox can be used to constrain the width of the InputDecorator or the TextField that contains it.
'package:flutter/src/material/input_decorator.dart':
Failed assertion: line 915 pos 7: 'layoutConstraints.maxWidth < double.infinity'
Either the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
https://github.com/flutter/flutter/issues/new?template=2_bug.md
The relevant error-causing widget was
TextFormField
When the exception was thrown, this was the stack
#2 _RenderDecoration._layout
#3 _RenderDecoration.performLayout
#4 RenderObject.layout
#5 RenderProxyBoxMixin.performLayout
#6 RenderObject.layout
#7 RenderProxyBoxMixin.performLayout
#8 RenderObject.layout
#9 RenderProxyBoxMixin.performLayout
#10 RenderObject.layout
#11 RenderProxyBoxMixin.performLayout
#12 RenderObject.layout
#13 RenderProxyBoxMixin.performLayout
#14 RenderObject.layout
#15 ChildLayoutHelper.layoutChild
#16 RenderFlex._computeSizes
#17 RenderFlex.performLayout
#18 RenderObject.layout
#19 ChildLayoutHelper.layoutChild
#20 RenderFlex._computeSizes
#21 RenderFlex.performLayout
#22 RenderObject.layout
#23 ChildLayoutHelper.layoutChild
#24 RenderFlex._computeSizes
#25 RenderFlex.performLayout
#26 RenderObject.layout
#27 MultiChildLayoutDelegate.layoutChild
#28 _ScaffoldLayout.performLayout
#29 MultiChildLayoutDelegate._callPerformLayout
#30 RenderCustomMultiChildLayoutBox.performLayout
#31 RenderObject.layout
#32 RenderProxyBoxMixin.performLayout
#33 RenderObject.layout
#34 RenderProxyBoxMixin.performLayout
#35 _RenderCustomClip.performLayout
#36 RenderObject.layout
#37 RenderProxyBoxMixin.performLayout
#38 RenderObject.layout
#39 RenderProxyBoxMixin.performLayout
#40 _RenderCustomClip.performLayout
#41 RenderObject.layout
#42 RenderProxyBoxMixin.performLayout
#43 RenderObject.layout
#44 RenderProxyBoxMixin.performLayout
#45 RenderObject.layout
#46 RenderProxyBoxMixin.performLayout
#47 RenderObject.layout
#48 RenderProxyBoxMixin.performLayout
#49 RenderObject.layout
#50 RenderProxyBoxMixin.performLayout
#51 RenderObject.layout
#52 RenderProxyBoxMixin.performLayout
#53 RenderOffstage.performLayout
#54 RenderObject.layout
#55 RenderProxyBoxMixin.performLayout
#56 RenderObject.layout
#57 _RenderTheatre.performLayout
#58 RenderObject.layout
#59 RenderProxyBoxMixin.performLayout
#60 RenderObject.layout
#61 RenderProxyBoxMixin.performLayout
#62 RenderObject.layout
#63 RenderProxyBoxMixin.performLayout
#64 RenderObject.layout
#65 RenderPadding.performLayout
#66 RenderObject.layout
#67 RenderProxyBoxMixin.performLayout
#68 RenderObject.layout
#69 RenderProxyBoxMixin.performLayout
#70 RenderObject.layout
#71 RenderProxyBoxMixin.performLayout
#72 RenderOffstage.performLayout
#73 RenderObject.layout
#74 ChildLayoutHelper.layoutChild
#75 RenderStack._computeSize
#76 RenderStack.performLayout
#77 RenderObject.layout
#78 RenderProxyBoxMixin.performLayout
#79 RenderObject.layout
#80 RenderProxyBoxMixin.performLayout
#81 RenderObject.layout
#82 RenderPadding.performLayout
#83 RenderObject.layout
#84 RenderProxyBoxMixin.performLayout
#85 RenderObject.layout
#86 ChildLayoutHelper.layoutChild
#87 RenderStack._computeSize
#88 RenderStack.performLayout
#89 RenderObject.layout
#90 RenderProxyBoxMixin.performLayout
#91 RenderObject.layout
#92 RenderPadding.performLayout
#93 RenderObject.layout
#94 ChildLayoutHelper.layoutChild
#95 RenderStack._computeSize
#96 RenderStack.performLayout
#97 RenderObject.layout
#98 RenderProxyBoxMixin.performLayout
#99 RenderObject.layout
#100 MultiChildLayoutDelegate.layoutChild
#101 _ScaffoldLayout.performLayout
#102 MultiChildLayoutDelegate._callPerformLayout
#103 RenderCustomMultiChildLayoutBox.performLayout
#104 RenderObject._layoutWithoutResize
#105 PipelineOwner.flushLayout
#106 RendererBinding.drawFrame
#107 WidgetsBinding.drawFrame
#108 RendererBinding._handlePersistentFrameCallback
#109 SchedulerBinding._invokeFrameCallback
#110 SchedulerBinding.handleDrawFrame
#111 SchedulerBinding._handleDrawFrame
#115 _invoke (dart:ui/hooks.dart:151:10)
#116 PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:308:5)
#117 _drawFrame (dart:ui/hooks.dart:115:31)
(elided 5 frames from class _AssertionError and dart:async)
The following RenderObject was being processed when the exception was fired: _RenderDecoration#ac57e relayoutBoundary=up9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
RenderObject: _RenderDecoration#ac57e relayoutBoundary=up9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none> (can use size)
constraints: BoxConstraints(unconstrained)
size: MISSING
input: RenderRepaintBoundary#6ab71 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
needs compositing
parentData: offset=Offset(0.0, 0.0)
constraints: MISSING
size: MISSING
usefulness ratio: no metrics collected yet (never painted)
child: RenderMouseRegion#20a1a NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none>
constraints: MISSING
size: MISSING
listeners: <none>
child: RenderPointerListener#f8de9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none>
constraints: MISSING
size: MISSING
behavior: deferToChild
listeners: signal
child: RenderPointerListener#cb212 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none>
constraints: MISSING
size: MISSING
behavior: opaque
listeners: down
hint: RenderAnimatedOpacity#c6ec1 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: offset=Offset(0.0, 0.0)
constraints: MISSING
size: MISSING
opacity: AnimationController#81a08(⏮ 0.000; paused; for AnimatedOpacity)➩Cubic(0.40, 0.00, 0.20, 1.00)➩Tween<double>(1.0 → null)➩1.0
alwaysIncludeSemantics
child: RenderParagraph#f2671 NEEDS-LAYOUT NEEDS-PAINT
parentData: <none>
constraints: MISSING
size: MISSING
textAlign: start
textDirection: ltr
softWrap: wrapping at box width
overflow: ellipsis
locale: en_US
maxLines: 1
text: TextSpan
debugLabel: ((((englishLike titleMedium 2014).merge(blackMountainView titleMedium)).merge(unknown)).merge(unknown)).merge(unknown)
inherit: false
color: Color(0xffbdbdbd)
family: Roboto
size: 20.0
weight: 400
baseline: alphabetic
decoration: TextDecoration.none
"Name-surname"
helperError: RenderConstrainedBox#bedef NEEDS-LAYOUT NEEDS-PAINT
parentData: offset=Offset(0.0, 0.0)
constraints: MISSING
size: MISSING
additionalConstraints: BoxConstraints(unconstrained)
container: RenderCustomPaint#ff7a1 NEEDS-LAYOUT NEEDS-PAINT
parentData: offset=Offset(0.0, 0.0)
constraints: MISSING
size: MISSING
painter: null
foregroundPainter: _InputBorderPainter#59565
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: _RenderDecoration#ac57e relayoutBoundary=up9 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
TextFormField
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderPointerListener#02ed9 relayoutBoundary=up8 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
TextFormField
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderSemanticsAnnotations#4c094 relayoutBoundary=up7 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
TextFormField
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderIgnorePointer#725ab relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
TextFormField
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderMouseRegion#dd897 relayoutBoundary=up5 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
TextFormField
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: _RenderFocusTrapArea#c217c relayoutBoundary=up4 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
Row
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderFlex#e190e relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
Column
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderFlex#8b7e5 relayoutBoundary=up2 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
Column
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderFlex#83287 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
Scaffold
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderRepaintBoundary#6ab71 NEEDS-LAYOUT NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1982 pos 12: 'hasSize'
The relevant error-causing widget was
TextFormField
════════════════════════════════════════════════════════════════════════════════
Restarted application in 1.613ms.
W/DynamiteModule( 5683): Local module descriptor class for com.google.android.gms.providerinstaller.dynamite not found.
I/DynamiteModule( 5683): Considering local module com.google.android.gms.providerinstaller.dynamite:0 and remote module com.google.android.gms.providerinstaller.dynamite:0
W/ProviderInstaller( 5683): Failed to load providerinstaller module: No acceptable module com.google.android.gms.providerinstaller.dynamite found. Local version is 0 and remote version is 0.
W/ProviderInstaller( 5683): Failed to report request stats: com.google.android.gms.common.security.ProviderInstallerImpl.reportRequestStats [class android.content.Context, long, long]
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->getObject(Ljava/lang/Object;J)Ljava/lang/Object; (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->putObject(Ljava/lang/Object;JLjava/lang/Object;)V (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->putLong(Ljava/lang/Object;JJ)V (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->getLong(Ljava/lang/Object;J)J (greylist,core-platform-api, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->getObject(Ljava/lang/Object;J)Ljava/lang/Object; (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->putObject(Ljava/lang/Object;JLjava/lang/Object;)V (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->putObject(Ljava/lang/Object;JLjava/lang/Object;)V (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->getLong(Ljava/lang/Object;J)J (greylist,core-platform-api, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->getObject(Ljava/lang/Object;J)Ljava/lang/Object; (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->putObject(Ljava/lang/Object;JLjava/lang/Object;)V (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->getLong(Ljava/lang/Object;J)J (greylist,core-platform-api, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->getObject(Ljava/lang/Object;J)Ljava/lang/Object; (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->putObject(Ljava/lang/Object;JLjava/lang/Object;)V (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->putObject(Ljava/lang/Object;JLjava/lang/Object;)V (greylist, linking, allowed)
W/to.todolist.ap( 5683): Accessing hidden method Lsun/misc/Unsafe;->getLong(Ljava/lang/Object;J)J (greylist,core-platform-api, linking, allowed)
What is the problem? How can I solve it? I appreciate your help in advance.
Upvotes: 3
Views: 2077
Answers (1)
potatoCutts
Reputation: 196
The issue can be resolved by wrapping the TextFormField in an Expanded. This issue is that you need to wrap the TextFormField within a Widget that has a width. Row has no set width.
Expanded() may not be the correct widget you are wanting, you could also use a Sized box and define the width.
Upvotes: 6
Related Questions
- TextFormField displaying error message even after the values are inserted (using Form Flutter)
- Flutter gives errors when using TextField
- Flutter Textformfield should be responsive to typing and error
- using textFormField in flutter
- why the example of TextFormField does't work anymore?
- Problem with textfield in my first Flutter app build
- TextFormField in flutter
- Flutter : Problems with textformfield
- Flutter-web TextFormField issue
- Why do i get errors when i place TextField inside In Row