[flutter] Spacer를 이용하여 위젯의 너비와 높이를 반응형으로 설정하는 방법은?

import ‘package:flutter/material.dart’;

void main() => runApp(MyApp());

class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text(‘Spacer Example’), ), body: Center( child: Row( children: [ Container( width: 100, height: 100, color: Colors.red, ), Spacer(), Container( width: 100, height: 100, color: Colors.blue, ), ], ), ), ), ); } } ```

Spacer 위젯을 사용하면, RowColumn 위젯 내에서 다른 위젯들 사이의 간격을 유동적으로 조절할 수 있습니다. Spacer를 추가하면 화면의 너비를 가변적으로 조절해줘서 반응형 디자인을 쉽게 구현할 수 있습니다. 위의 예제 코드에서 첫 번째 컨테이너가 100x100이고 두 번째 컨테이너가 동일한 크기인데도 Spacer가 존재하기 때문에 두 컨테이너는 화면을 균등하게 채우며 간격을 유지하게 됩니다.