In diesem Artikel gehen wir auf die Fehlermeldung Incorrect use of ParentDataWidget
ein. Wir
schauen uns an, warum diese Fehlermeldung angezeigt wird und wie damit umgegangen werden kann.
Diese Meldung taucht immer dann auf, wenn nicht das passende Widget genutzt wurde.
Die Fehlermeldung die in der Konsole ausgegeben wird sieht wie folgt aus:
Inhaltsverzeichnis
1. Beschreibung der Situation
Es soll in einem Scaffold
über die komplette Seite gestreckt ein anderes Widget plaziert werden.
In unserem Beispiel wollen wir die komplette Seite grün einfärben. Um die Farbe anzuzeigen nutzen wir
einen Container
mit grüner Farbe. Wenn wir das Expanded
Widget nutzen, um den Container
auf die
gesamte verfügbare Seite zu strecken, dann erhalten wir folgenden Screen:
2. Ursache der Fehlermeldung
Der Code der das obige Verhalten verursacht sieht wie folgt aus:
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
static const String _title = 'Flutter Code Sample';
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: _title,
home: MyStatelessWidget(),
);
}
}
class MyStatelessWidget extends StatelessWidget {
const MyStatelessWidget({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Expanded Column Sample'),
),
body: Expanded(
child: Container(color: Colors.green),
),
);
}
}
Die Fehlermeldung wird durch das Expanded
Widget verursacht. Der Grund hierfür ist, dass ein
Expanded
Widget so designed ist, dass dieser nur in MultiChildRenderObjectWidget
wie Column
,
Flex
oder Row
eingesetzt werden kann. In diesem Beispiel wird jedoch das Expanded
Widget im
body
des Scaffold
Widgets eingesetzt.
3. Lösung der Fehlermeldung
Wie im vorherigen Abschnitt bereits beschrieben, kann das Expanded
Widget nur in
MultiChildRenderObjectWidget
Widgets eingebettet werden. In unserem Beispiel möchten wir, jedoch
das Container
Widget in einem Scaffold
Widget gestreckt anzeigen. Das Scaffold
Widget ist ein
SingleChildRenderObjectWidget
. Um ein anderes Widget in einem SingleChildRenderObjectWidget
Widget
zu strecken, muss das SizedBox.expand
Widget verwendet werden. Wenn wir das SizedBox.expand
statt Expanded
einsetzen erhalten wir folgendes Ergebnis:
Der vollständige Code mit SizedBox.expand
, der die Incorrect use of ParentDataWidget
löst:
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
static const String _title = 'Flutter Code Sample';
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: _title,
home: MyStatelessWidget(),
);
}
}
class MyStatelessWidget extends StatelessWidget {
const MyStatelessWidget({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Expanded Column Sample'),
),
body: SizedBox.expand(
child: Container(color: Colors.green),
),
);
}
}
4. Wie geht es weiter?
Schon einmal auf die Fehlermeldung BoxConstraints forces an infinite height
gestoßen? Was die Fehlermeldung
bedeutet und was zu tun ist um diese wieder los zu werden lässt sich hier herausfinden:
Wo sind meine Widgets hin verschwunden und was bedeutet “BoxConstraints forces an infinite height”?