在颤振中防止排满集装箱
在颤振中防止排满集装箱
提问于 2022-03-04 08:51:49
我正在尝试将一行小部件安装到容器中，但是当我将主轴对齐的属性设置为MainAxisAlignment.spaceBetween时，它似乎会溢出。这将导致行(字体棒图标)溢出容器的宽度。我不知道如何使这一行与容器的宽度相吻合。当试图用扩展的小部件包装行时，我会得到呈现错误。
不知道我哪里出了问题。
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
//clipBehavior: Clip.none,
color: Colors.blue,
child:
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Hello'
),
Icon(FontAwesomeIcons.solidMoneyBillAlt)
],
),
),
)
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: const Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}目前的结果：
回答 3
Stack Overflow用户
回答已采纳
发布于 2022-03-04 09:31:20
更好的答案使用FaIcon小部件而不是Icon小部件
Row(
// mainAxisAlignment: MainAxisAlignment.spaceAround,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('Hello'),
FaIcon(
FontAwesomeIcons.solidMoneyBillAlt,
size: 50,
)
],
)Stack Overflow用户
发布于 2022-03-04 09:07:57
试着像这样
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Text('Hello'),
),
Container(
width: 50,
child: Icon(
FontAwesomeIcons.solidMoneyBillAlt,
// size: 30,
),
)
],
)SAmpleCode
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
//clipBehavior: Clip.none,
color: Colors.blue,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Text('Hello'),
),
Container(
width: 50,
child: Icon(
FontAwesomeIcons.solidMoneyBillAlt,
// size: 30,
),
)
],
),
),
)
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: const Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}Stack Overflow用户
发布于 2022-03-04 09:16:50
尝试下面的代码，希望它对你有帮助。添加你的图标填充。
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
color: Colors.blue,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('Hello'),
Padding(
padding: EdgeInsets.only(right: 12.0),
child: Icon(Icons.money),
),
],
),
),
),结果屏幕->
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71348805
复制相关文章
相似问题
腾讯云开发者
