如何适合 showModalBottomSheet？

Question

我有一个应用程序，我在这个应用程序中添加了 showModalBottomSheet。它看起来像这样：

但是有一个问题。当我打开底部带有“Ürün fiyatı:”的TextFormField时，屏幕是这样的：

如您所见，TextFormField 已被阻止，我看不到我正在输入的内容。

我该如何解决这个问题？

由于代码很长，我只给出必要的部分。代码：

showModalBottomSheet(
  isScrollControlled:true,
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.only(
      topLeft: Radius.circular(10),
      topRight: Radius.circular(10),
    ),
  ),
  context: context,
  builder: (context) {
    return FractionallySizedBox(
      heightFactor: 0.93,
      child: Container(
        padding: EdgeInsets.all(25),
        height: MediaQuery.of(context).size.height * 0.5,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            // ..photo..
            // ..other TextFormFields..
            SizedBox(height: 10,),
            Text("Ürün Fiyatı:", style: TextStyle(fontSize: 20)),
            SizedBox(height: 10),
            TextFormField(
              style: TextStyle(fontSize: 19),
              decoration: InputDecoration(
                border: OutlineInputBorder(),
              ),
              initialValue: snapshot.data!.docs[index].data()["urunFiyati"].toString(),
              inputFormatters: <TextInputFormatter>[
                CurrencyTextInputFormatter(
                  locale: 'tr_TR',
                  decimalDigits: 2,
                  symbol: '₺',
                ),
              ],
              keyboardType: TextInputType.number,
              onChanged: (value) {
                setState(() {
                  fiyat = value;
                  print(fiyat);
                });
              },
            ),
            SizedBox(height: 10,),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                Container(
                  width: MediaQuery.of(context).size.width * 0.4,
                  child: ElevatedButton(
                    onPressed: () {
                      Navigator.pop(context);
                    },
                    child: Text("İptal", style: TextStyle(color: Colors.grey[100], fontSize: 19),),
                    style: ButtonStyle(
                      backgroundColor: MaterialStateProperty.all(Colors.grey),
                      shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                        RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(18.0),
                          side: BorderSide(color: Colors.grey)
                        ),
                      ),
                    ),
                  ),
                ),
                Container(
                  width: MediaQuery.of(context).size.width * 0.4,
                  child: ElevatedButton(
                    style: ButtonStyle(
                      backgroundColor: MaterialStateProperty.all(Colors.green),
                      shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                        RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(18.0),
                          side: BorderSide(color: Colors.green)
                        ),
                      ),
                    ),
                    child: Text("Kaydet", style: TextStyle(color: Colors.white, fontSize: 19),),
                    onPressed: () {
                      FirebaseFirestore.instance.collection('bolatAktar').doc(snapshot.data!.docs[index].data()["urunAdi"]).update({
                        "urunAciklamasi": _urunAciklamasi.text,
                        "urunFiyati": _urunFiyati.format(fiyat.toString()),
                      });
                      Navigator.pop(context);
                    },
                  ),
                ),
              ],
            ),
          ]
        )
      ),
    );
  }
);

我按照@Karunjith M 所说的操作得到的错误：

════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderPointerListener#7de63 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
package:flutter/…/rendering/box.dart:1
Failed assertion: line 1982 pos 12: 'hasSize'

The relevant error-causing widget was
PersistentTabView
lib\bolatAktar_body.dart:67
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderPhysicalShape#0589f relayoutBoundary=up2

Answer 1

将 fractionalySizedBox 包裹在 SingleChildScrollView 中，并提供填充，如下所示。

SingleChildScrollView(
              padding: EdgeInsets.only(
                  bottom: MediaQuery.of(context).viewInsets.bottom),
              child: FractionallySizedBox(//your code....

如何适合 showModalBottomSheet？

How to fit showModalBottomSheet?

flutter