我正在尝试对齐我的视图,以便所有小部件具有看起来统一的相同边距,但 Icon 正在为我生成自动边距,我不想为此使用应用程序栏。
这是我的观点:
import 'package:flutter/material.dart';
class RegisterView extends StatefulWidget {
const RegisterView({super.key});
@override
State<RegisterView> createState() => _RegisterViewState();
}
class _RegisterViewState extends State<RegisterView> {
@override
Widget build(BuildContext context) {
final Size size = MediaQuery.of(context).size;
final double marginHorizontal = size.width * 0.09;
return Scaffold(
body: SingleChildScrollView(
child: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: EdgeInsets.symmetric(horizontal: marginHorizontal),
child: appBar
),
SizedBox(height: size.height * 0.02,),
Container(
margin: EdgeInsets.symmetric(horizontal: marginHorizontal),
child: description
)
],
),
),
),
);
}
Widget get appBar => Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
IconButton(
iconSize: 40.0,
onPressed: (){},
icon: const Icon(Icons.arrow_back_ios_new, color: Colors.white,)
),
const SizedBox(
width: 10.0,
),
Text(
'Registro',
style: Theme.of(context).textTheme.titleLarge,
)
],
);
Widget get description => Text(
'Completa los siguientes datos',
style: Theme.of(context).textTheme.bodySmall,
);
}
我试图让我的行完全对齐到屏幕左侧,但图标似乎会自动添加边距。
事实上,当删除 IconButton 时,其余的小部件会正确对齐
我试过了,但没用
IconButton(
padding: EdgeInsets.zero,
alignment: Alignment.topLeft,
iconSize: 40.0,
onPressed: (){},
icon: const Icon(Icons.arrow_back_ios_new, color: Colors.white,)
),
Padding(
padding: const EdgeInsets.all(0.0),
child: IconButton(
alignment: Alignment.topLeft,
iconSize: 40.0,
onPressed: (){},
icon: const Icon(Icons.arrow_back_ios_new, color: Colors.white,)
),
),
我几乎可以肯定问题出在图标小部件中,因为当尝试使用手势检测器实现此问题时,问题仍然存在。
要删除 IconButton 周围的填充,请尝试向 IconButton 属性添加约束和填充,并再次向 ButtonStyle 属性添加填充。
下面是一个例子:
IconButton(
constraints: const BoxConstraints(),
iconSize: 20,
style: ButtonStyle(
padding: MaterialStatePropertyAll(EdgeInsets.zero),
),
padding: EdgeInsets.zero,
onPressed: () {}
icon: Icon(
Icons.filter_alt_off,
),
),