작성
·
287
·
수정됨
0
import 'package:flutter/material.dart';
class HomeScreen extends StatefulWidget {
const HomeScreen({super.key});
@override
State<HomeScreen> createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('랜덤숫자 생성기'),
IconButton(
onPressed: () {},
icon: Icon(
Icons.settings,
),
),
],
),
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('123'),
Text('456'),
Text('789'),
],
),
),
Container(
width: double.infinity,
child: ElevatedButton(
onPressed: () {},
child: Text('생성하기!'),
),
),
],
),
),
);
}
}
그냥 수업 내용인데, 왜 첫번째 Column에서는 container나 sizedBox하지 않고 그냥 crossAxisAlignment가 바로 적용되는 건가요?? 혹시 SafeArea 영역이 width가 최대라서 바로 횡축 정렬이 가능해지나요?
답변 1
0
안녕하세요!
최상위 Column이 왜 가로로 최대 크기를 차지 하는지에 대한 질문 맞을까요?
Row와 Column은 모두 주축에서 최대 크기를 가져갑니다.
Column안에 Row가 입력 됐기때문에 가로로도 최대치를 차지하게됩니다.
만약에 Column 위에 SizedBox 등을 사용해서 강제로 크기를 줄여주면 Row가 최대로 가져갈 수 있는 크기도 줄기때문에 Column도 마찬가지로 같은 크기만큼만 늘어납니다.
혹시 제가 질문을 잘못 이해했다면 다시 질문주세요!
감사합니다!