英文:
How to fix this error and how to grasp the underlying principle of layout in flutter?
问题
Here is the translated code:
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method, and use it to set our appbar title.
title: Text(widget.title),
),
body: const Positioned(
left: 100,
height: 50,
child: SizedBox(
width: 100,
height: 100,
child: Text("111"),
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: const Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
Regarding your Flutter layout error, it's likely caused by incorrect usage of layout widgets, especially when dealing with positioning. To understand the underlying principles of layout in Flutter, you should familiarize yourself with Flutter's layout widgets like Container, Column, Row, Stack, and Positioned. Also, understanding the concept of constraints and how widgets respond to them is crucial.
As for finding rules for Flutter layout, Flutter's official documentation and Flutter community resources are valuable sources. You can find guidelines, best practices, and examples to help you design effective layouts in Flutter.
英文:
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method, and use it to set our appbar title.
title: Text(widget.title),
),
body: const Positioned(
left: 100,
height: 50,
child: SizedBox(
width: 100,
height: 100,
child: Text("111"),
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: const Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
I got a "Incorrect use of ParentDataWidget." error in flutter. What leads to this error and how to grasp the underlying principle of layout in flutter ?
Is there any rules of flutter layout and how to find them?
答案1
得分: 0
以下是翻译好的部分：
错误消息应提供更多详细信息并告诉您原因。它应该像这样说：
以下的 ParentDataWidgets 正在向相同的 RenderObject 提供父数据：
- Positioned(left: 100.0, height: 50.0)（通常直接放在 Stack widget 内部）
换句话说：Positioned 只能在 Stack widget 中使用。所以要修复错误，您可以像这样将其包装在一个 Stack 中，例如：
return Scaffold(
appBar: AppBar(
// 这里我们使用由 App.build 方法创建的 MyHomePage 对象的值，
// 并用它来设置我们的应用栏标题。
title: Text('5'),
),
body: const Stack(
children: [
Positioned(
left: 100,
height: 50,
child: SizedBox(
width: 100,
height: 100,
child: Text("111"),
),
),
],
),
floatingActionButton: FloatingActionButton(
onPressed: (){},
tooltip: 'Increment',
child: const Icon(Icons.add),
), // 这个额外的逗号使构建方法的自动格式更好。
);
希望这对您有所帮助。
英文:
The error message should tell you more and tell you why. It should say something like this:
The following ParentDataWidgets are providing parent data to the same RenderObject:
- Positioned(left: 100.0, height: 50.0) (typically placed directly inside a Stack widget)
In other words: Positioned can only be used in a Stack widget. So to fix the error you could wrap it in a Stack like this for example
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method, and use it to set our appbar title.
title: Text('5'),
),
body: const Stack(
children: [
Positioned(
left: 100,
height: 50,
child: SizedBox(
width: 100,
height: 100,
child: Text("111"),
),
),
],
),
floatingActionButton: FloatingActionButton(
onPressed: (){},
tooltip: 'Increment',
child: const Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论