Saya mendapatkan pengecualian render yang tidak saya mengerti cara memperbaikinya. Saya mencoba membuat kolom yang memiliki 3 baris.
Baris [Gambar]
Baris [TextField]
Baris [tombol]
Ini kode saya untuk membuat wadah:
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;
}
dan kode buildAppEntryRow saya untuk wadah teks
Widget buildAppEntryRow(BuildContext context) {
return new Row(
children: <Widget>[
new TextField(
decoration: const InputDecoration(helperText: "Enter App ID"),
style: Theme.of(context).textTheme.body1,
)
],
);
}
Ketika saya menjalankan saya mendapatkan pengecualian berikut:
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)
Jika saya mengubah buildAppEntryRow menjadi TextField saja seperti ini
Widget buildAppEntryRow2(BuildContext context) {
return new TextField(
decoration: const InputDecoration(helperText: "Enter App ID"),
style: Theme.of(context).textTheme.body1,
);
}
Saya tidak lagi mendapatkan pengecualian. Apa yang saya lewatkan dengan implementasi Row yang menyebabkannya tidak dapat menghitung ukuran baris itu?
mainAxisAlignment
untuk widget Baris. Dengan dua widget teks tidak ada masalah tetapi dengan widget teks dan widget Textfield yang terkandung diFlexible
dalamnya akan disejajarkan ke kiri tanpa spasi.Anda mendapatkan kesalahan ini karena
TextField
mengembang dalam arah horizontal dan begitu juga denganRow
, jadi kita perlu membatasi lebarTextField
, ada banyak cara untuk melakukannya.Menggunakan
Expanded
Menggunakan
Flexible
Bungkus
Container
atauSizedBox
sediakanwidth
sumber
TextField
dalam satu baris.Anda harus menggunakan Fleksibel untuk menggunakan Textfield di dalam satu baris.
sumber
Container
, Anda dapat menggunakanFlexible
langsung.Solusinya adalah membungkus
Text()
bagian dalam Anda dengan salah satu widget berikut: BaikExpanded
atauFlexible
. Jadi, kode Anda menggunakan Expanded akan seperti:sumber
Seperti yang dikatakan Asif Shiraz, saya memiliki masalah yang sama dan menyelesaikannya dengan Membungkus Kolom secara Fleksibel, di sini seperti ini ,,
sumber
Solusi sederhana adalah dengan membungkus
Text()
bagian dalam aContainer()
. Jadi, kode Anda akan seperti:Di sini Anda juga mendapatkan atribut lebar dan tinggi wadah untuk menyesuaikan tampilan dan nuansa bidang teks Anda. Tidak perlu digunakan
Flexible
jika Anda membungkus bidang teks Anda di dalam sebuah Kontainer.sumber
width: n