flutter
flutter 세로 정렬 가로 정렬(Center, mainAxisAlignment)
jin0choi1216
2021. 6. 7. 09:46
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'My app', // 앱을 총칭하는 이름
theme: ThemeData(
primarySwatch: Colors.blue
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('First App'),
centerTitle: true,
backgroundColor: Colors.redAccent,
elevation: 0.0,
), // 빈도화지 같은 역활
body: Center ( // 가로축에서 정렬
child: Column(
mainAxisAlignment: MainAxisAlignment.center, // 세로축에서 정렬
children: <Widget>[
Text('Hello'),
Text('Hello'),
Text('Hello'),
],
),
)
);
}
}
가로 축 정렬은 Center Widgets을 사용해야하고,
세로 축 정렬이 필요 할 때는 Center Widgets에서 mainAxisAlignment를 불러와야 한다.
강좌링크 : youtube.com/watch?v=gUVAUOvPm_c&list=PLQt_pzi-LLfpcRFhWMywTePfZ2aPapvyl&index=9