Satır içindeki TextField düzen istisnasına neden oluyor: Boyut hesaplanamıyor

Nasıl düzelteceğimi anlamadığım bir oluşturma istisnası alıyorum. 3 satır içeren bir sütun oluşturmaya çalışıyorum.

Satır [Resim]

Satır [TextField]

Satır [Düğmeler]

İşte kapsayıcı oluşturmak için benim kod:

Container buildEnterAppContainer(BuildContext context) {
    var container = new Container(
      padding: const EdgeInsets.all(8.0),
      child: new Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[
          buildImageRow(context),
          buildAppEntryRow(context),
          buildButtonRow(context)
        ],
      ),
    );
    return container;
  }

ve metin kabı için buildAppEntryRow kodum

Widget buildAppEntryRow(BuildContext context) {
    return new Row(
      children: <Widget>[
        new TextField(
          decoration: const InputDecoration(helperText: "Enter App ID"),
          style: Theme.of(context).textTheme.body1,
        )
      ],
    );
  }

Ben çalıştırdığımda aşağıdaki istisnayı alıyorum:

I/flutter ( 7674): BoxConstraints forces an infinite width.
I/flutter ( 7674): These invalid constraints were provided to RenderStack's layout() function by the following
I/flutter ( 7674): function, which probably computed the invalid constraints in question:
I/flutter ( 7674):   RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:256:13)
I/flutter ( 7674): The offending constraints were:
I/flutter ( 7674):   BoxConstraints(w=Infinity, 0.0<=h<=Infinity)

Eğer buildAppEntryRow sadece bunun gibi bir TextField için değiştirirseniz

 Widget buildAppEntryRow2(BuildContext context) {
    return new TextField(
      decoration: const InputDecoration(helperText: "Enter App ID"),
      style: Theme.of(context).textTheme.body1,
    );
  }

Artık istisna alamıyorum. Bu satırın boyutunu hesaplayamamasına neden olan Row uygulamasıyla ne eksik?

(Kullanacağınızı varsayıyorum Rowçünkü TextFieldgelecekte diğer widget'ları koymak istiyorsunuz .)

RowTermometrem esnek olanlar için terk ettiğini ne kadar boşluk bilir böylece onun esnek olmayan çocukların içsel boyutunu belirlemek istiyor. Ancak, TextFieldiçsel bir genişliği yoktur; yalnızca üst kabının tam genişliğine kadar nasıl boyutlandırılacağını bilir. Kalan alanı kaplamasını beklediğinizi belirtmek için a Flexibleveya işaretine sarmayı deneyin :ExpandedRowTextField

      new Row(
        children: <Widget>[
          new Flexible(
            child: new TextField(
              decoration: const InputDecoration(helperText: "Enter App ID"),
              style: Theme.of(context).textTheme.body1,
            ),
          ),
        ],
      ),

Bu hatayı alıyorsunuz çünkü TextFieldyatay yönde genişliyor ve aynı şekilde genişliyor Row, bu yüzden genişliğini sınırlamamız gerekiyor TextField, bunu yapmanın birçok yolu var.

1. kullanım Expanded

    Row(
     children: <Widget>[
       Expanded(child: TextField()),
       OtherWidget(),
     ],
   )

2. kullanım Flexible

   Row(
     children: <Widget>[
       Flexible(child: TextField()),
       OtherWidget(),
     ],
   )

3. ContainerVeya içine sarın SizedBoxvewidth

   Row(
     children: <Widget>[
       SizedBox(width: 100, child: TextField()),
       OtherWidget(),
     ],
   )       

Satır içinde bir Metin Alanı kullanmak için Esnek'i kullanmalısınız.

new Row(
              children: <Widget>[
                new Text("hi there"),
                new Container(
                  child:new Flexible(
                        child: new TextField( ),
                            ),//flexible
                ),//container


              ],//widget
            ),//row

Çözüm, Text()aşağıdaki widget'lardan birinin içine sarmaktır: Ya Expandedya Flexible. Yani, Genişletilmiş kodunuz aşağıdaki gibi olacaktır:

Expanded(
           child: TextField(
             decoration: InputDecoration(
               hintText: "Demo Text",
               hintStyle: TextStyle(fontWeight: FontWeight.w300, color: Colors.red)
              ),
           ),
        ),

@Asif Shiraz'ın da belirttiği gibi aynı sorunu yaşadım ve bunu Esnek bir Sütun Sarma ile çözdüm, burada böyle,

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        title: 'Flutter Demo',
        theme: new ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: new Scaffold(
          body: Row(
            children: <Widget>[
              Flexible(
                  child: Column(
                children: <Widget>[
                  Container(
                    child: TextField(),
                  )
                  //container
                ],
              ))
            ],
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
          ),
        ));
  }
}

Basit bir çözüm sarılmasıdır Text()iç a Container(). Yani, kodunuz şöyle olacaktır:

Container(
      child: TextField()
)

Burada ayrıca, metin alanınızın görünümünü ve hissini ayarlamak için bir kabın genişlik ve yükseklik özelliğini alırsınız. FlexibleMetin alanınızı bir Kapsayıcı içine sarıyorsanız kullanmanıza gerek yoktur .