flutter - 填充:EdgeInserts | 不移动小部件?
问题描述
我试图将文本定位到更靠近左边缘,而不是中心。
在使用颤振进行研究后,似乎正确的方法是使用const EdgeInserts
但是,当使用 const edge inserts 时,我页面上的文本只会改变很小的位置,这几乎不会引起注意。我对下面的代码做错了吗?
Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.only(left: 10, bottom: 50),
child: Text(
'Some Text',
style: TextStyle(
fontSize: 24,
fontFamily: 'Avenir',
fontWeight: FontWeight.w900,
这是正在发生的事情的示例,与我想要的相比
编辑答案:
class Onboarding1 extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: Column(
children: [
Image.asset(
"assets/Onboarding1_Photo.png",
height: MediaQuery.of(context).size.height * 0.7,
width: MediaQuery.of(context).size.width,
fit: BoxFit.cover,
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(left: 10, bottom: 50),
child: Text(
'Some Text',
style: TextStyle(
fontSize: 24,
fontFamily: 'Avenir',
fontWeight: FontWeight.w900,
解决方案
要拉伸视图,您可以添加Column
:
crossAxisAlignment: CrossAxisAlignment.stretch,
具有不同填充和对齐方式的两个文本的完整示例:
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Container(
color: Colors.blue,
height: 300,
),
Padding(
padding: const EdgeInsets.only(
left: 10,
top: 30,
),
child: Text(
'Some Text',
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 24,
fontFamily: 'Avenir',
fontWeight: FontWeight.w900,
),
),
),
Padding(
padding: const EdgeInsets.only(
right: 50,
top: 30,
),
child: Text(
'Some Text',
textAlign: TextAlign.right,
style: TextStyle(
fontSize: 24,
fontFamily: 'Avenir',
fontWeight: FontWeight.w900,
),
),
),
],
),
),
);
}
}
推荐阅读
- docker - 如何删除 ECR 中未标记的图像
- python - 为什么 TypeError: unhashable type: 'list' 调用函数时?
- c# - 如何正确反序列化并从 JSON 获取值
- java - 窗格不遵守首选项大小
- r - R如何创建聚合多个条件的列
- javascript - 按钮删除不删除产品
- reactjs - 如何将 Firebase 数据实时更新到 React 应用程序
- javascript - Javascript:根据 nput type="text" 的值更改 data-target="#"
- php - PHPMailer 无法在实时服务器上发送电子邮件
- javascript - 通过 curl php 传递 google RecaptchaResponsed