Dikey görüntü alanına sınırsız yükseklik verildi

Bu benim kodum:

  @override
  Widget build(BuildContext context) {
    return new Material(
      color: Colors.deepPurpleAccent,
      child: new Column(
       mainAxisAlignment: MainAxisAlignment.center,
          children:<Widget>[new GridView.count(crossAxisCount: _column,children: new List.generate(_row*_column, (index) {
            return new Center(
                child: new CellWidget()
            );
          }),)]
      )
    );
  }

Aşağıdaki istisna:

I/flutter ( 9925): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter ( 9925): The following assertion was thrown during performResize():
I/flutter ( 9925): Vertical viewport was given unbounded height.
I/flutter ( 9925): Viewports expand in the scrolling direction to fill their container. In this case, a vertical
I/flutter ( 9925): viewport was given an unlimited amount of vertical space in which to expand. This situation
I/flutter ( 9925): typically happens when a scrollable widget is nested inside another scrollable widget.
I/flutter ( 9925): If this widget is always nested in a scrollable widget there is no need to use a viewport because
I/flutter ( 9925): there will always be enough vertical space for the children. In this case, consider using a Column
I/flutter ( 9925): instead. Otherwise, consider using the "shrinkWrap" property (or a ShrinkWrappingViewport) to size
I/flutter ( 9925): the height of the viewport to the sum of the heights of its children.
I/flutter ( 9925): 
I/flutter ( 9925): When the exception was thrown, this was the stack:
I/flutter ( 9925): #0      RenderViewport.performResize.<anonymous closure> (package:flutter/src/rendering/viewport.dart:827:15)
I/flutter ( 9925): #1      RenderViewport.performResize (package:flutter/src/rendering/viewport.dart:880:6)
I/flutter ( 9925): #2      RenderObject.layout (package:flutter/src/rendering/object.dart:1555:9)

Bu iki satırı ekleyerek

ListView.builder(
    scrollDirection: Axis.vertical,
    shrinkWrap: true,
...

Bu genellikle a ListView/ GridViewinside a'yı kullanmaya çalıştığınızda olur, bunu Columnçözmenin birçok yolu vardır, burada birkaçını listeliyorum.

1. sarın ListViewiçindeExpanded

   Column(
     children: <Widget>[
       Expanded( // wrap in Expanded
         child: ListView(...),
       ),
     ],
   )
   

2. Wrap ListViewiçinde SizedBoxve vermek sınırlı birheight

   Column(
     children: <Widget>[
       SizedBox(
         height: 400, // fixed height
         child: ListView(...),
       ),
     ],
   )
   

3. Kullan shrinkWrap: trueiçinde ListView.

   Column(
     children: <Widget>[
       ListView(
         shrinkWrap: true, // use this
       ),
     ],
   )
   

Yani, herkes cevapları yayınlanmıştır ama kimse niçin bakım: Ben belgeleri kopyalamak edeceğiz shrinkWrap:

[ScrollDirection] içindeki kaydırma görünümünün kapsamının, görüntülenen içerik tarafından belirlenip belirlenmeyeceği.

Kaydırma görünümü kaydırmayı küçültmezse, kaydırma görünümü [scrollDirection] öğesinde izin verilen maksimum boyuta genişler. Kaydırma görünümünün [scrollDirection] içinde sınırsız kısıtlamaları varsa, [shrinkWrap] doğru olmalıdır.

Kaydırma görünümünün içeriğini küçültmek, izin verilen maksimum boyuta genişletmekten önemli ölçüde daha pahalıdır, çünkü içerik kaydırma sırasında genişleyebilir ve daralabilir; bu, kaydırma konumu her değiştiğinde kaydırma görünümünün boyutunun yeniden hesaplanması gerektiği anlamına gelir.

Varsayılan değer false.

Öyleyse, belgelerin kelime dağarcığını ele alırsak, burada olan şey, bizim sınırsız kısıtlamalarListView durumunda olduğumuzdur ( kaydırdığımız yönde), böylece ListViewşikayet edecek oluruz :

... dikey bir görüntü alanına, genişletmek için sınırsız miktarda dikey alan verildi.

Basitçe ayarlayarak shrinkWrapiçin trueemin içerikleri ile tanımlanan boyutunu sarar olduğunu yapacaktır. Göstermek için örnek bir kod:

// ...
  ListView(
    // Says to the `ListView` that it must wrap its
    // height (if it's vertical) and width (if it's horizontal).
    shrinkWrap: true,
  ),
// ...

Kodunuzda olan budur, yine de @ Rémi önerisi bu durum için en iyisidir Align, a yerine Column.

Izgara görünümünü Esnek veya Genişletilmiş widget'a yerleştirin

return new Material(
    color: Colors.deepPurpleAccent,
    child: new Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children:<Widget>[
         Flexible(
          child:  GridView.count(crossAxisCount: _column,children: new List.generate(_row*_column, (index) {
          return new Center(
             child: new CellWidget(),
          );
        }),))]
    )
);

Bu durum genellikle, kaydırılabilir bir widget başka bir kaydırılabilir widget'ın içine yerleştirildiğinde gerçekleşir.

Benim durumumda Column içinde GridView kullanıyorum ve bu hata atıyor.

GridView parçacığının shrinkWrapözelliği / adlandırılmış parametresi var, bunu ayarlamak için truesorunum çözüldü.

GridView.count(
  shrinkWrap: true,
  // rest of code
)

ColumnTek çocuk hizalama için kullanmayın . AlignBunun yerine kullanın .

    new Align(
      alignment: Alignment.topCenter,
      child: new GridView(),
    )

Her shrinkWrapne kadar bir şey yapsa da, ama içeri giremezsin ListView.

Kaydırma işlevi istiyorsanız, physicsözellik ekleyebilirsiniz :

ListView.builder(
    scrollDirection: Axis.vertical,
    shrinkWrap: true,
    physics: ScrollPhysics(),
...

bu, ListView/GridViewparçacığın boyutunu alacak ebeveyni olmadığı için olur , bu nedenle yüksekliği sonsuzdur ve flutter ListView yüksekliğini bilmez ve işleyemez.

1. Birinci çözüm: Sabit yükseklik

   Doğrudan Containerveya SizedBoxölü yüksekliği yazmak için sarın .

   Column(
     children: <Widget>[
       SizedBox(
        height: 400, // fixed height
       child: ListView(...),
      ),
    ],
   )
   

Bu sorun değil, ancak yüksekliğin uyarlanabilir olması gerekiyorsa, yazarsanız işe yaramayacaktır.

2. İkinci çözüm: shrinkWrap: true

   Deneyin shrinkWrap: trueile physics: ScrollPhysics()kaydırma için

   shrinkWrap: truebiraz androidlerde olduğu gibi wrap_content.

   ListView.builder(
      scrollDirection: Axis.vertical,
      shrinkWrap: true,
      physics: ScrollPhysics()
   ...
   

Ancak, derledikten sonra sayfanın altında uzun sarı bir uyarı göreceksiniz.

Yani hala yapamam

3. Üçüncü çözüm: Genişletilmiş veya Esnek

   Flexible Flutter'da esnek bir düzendir, android'de LinearLayout'a eşdeğerdir.

   Esnek içinde kimse yok flexniteliği, layout_weight için eşit, geri kalan tüm yer kaplar.

   Böylece ListView'ü Esnek ile sarmayabiliriz.

   Column(
     children: <Widget>[
       Expanded( 
         child: ListView(...),
       ),
     ],
   )
   

Bu yanıta dayalı: Dikey görünüm alanına sınırsız yükseklik verildi.

bunu ikinci liste görünümü için test et

ListView.builder(
            physics: NeverScrollableScrollPhysics(),

Merkez adında bir widget var. Yapmak istediğiniz şeyi başarmanıza yardımcı olmalıdır (dikey olarak ortalayın). Merkez widget'ı için Resmi Belgeler