Получение ошибки при размещении Flutter TextFormField

У меня есть такое приложение:

enter image description here

Нет ничего плохого в синем фоне вверху. Но я хочу показать экран редактирования профиля под этим полем. Я также добавлю TextFormField для ввода информации об имени и фамилии.

Теперь я добавил Text, чтобы показать экран. Обычно в разделе, где находится TextFormField, будет Text.

Мои коды следующие:

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
                ],
              ),
            ],
          ),
        ]
      ),
    );
  }
}

В консоли получаю следующий вывод:

════════ 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)

В чем проблема? Как я могу это решить? Я ценю вашу помощь заранее.

3 метода стилизации элементов HTML
3 метода стилизации элементов HTML
Когда дело доходит до применения какого-либо стиля к нашему HTML, существует три подхода: встроенный, внутренний и внешний. Предпочтительным обычно...
Формы c голосовым вводом в React с помощью Speechly
Формы c голосовым вводом в React с помощью Speechly
Пытались ли вы когда-нибудь заполнить веб-форму в области электронной коммерции, которая требует много кликов и выбора? Вас попросят заполнить дату,...
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Будучи разработчиком веб-приложений, легко впасть в заблуждение, считая, что приложение без JavaScript не имеет права на жизнь. Нам становится удобно...
Flatpickr: простой модуль календаря для вашего приложения на React
Flatpickr: простой модуль календаря для вашего приложения на React
Если вы ищете пакет для быстрой интеграции календаря с выбором даты в ваше приложения, то библиотека Flatpickr отлично справится с этой задачей....
В чем разница между Promise и Observable?
В чем разница между Promise и Observable?
Разберитесь в этом вопросе, и вы значительно повысите уровень своей компетенции.
Что такое cURL в PHP? Встроенные функции и пример GET запроса
Что такое cURL в PHP? Встроенные функции и пример GET запроса
Клиент для URL-адресов, cURL, позволяет взаимодействовать с множеством различных серверов по множеству различных протоколов с синтаксисом URL.
0
0
30
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Проблему можно решить, заключив TextFormField в файл Expanded. Эта проблема заключается в том, что вам нужно обернуть TextFormField в виджет, который имеет ширину. Строка не имеет заданной ширины.

Expanded() может быть не тем виджетом, который вам нужен, вы также можете использовать поле Sized и определить ширину.

Другие вопросы по теме