너비와 높이

Coddy Flutter 여정의 첫 앱 만들기 섹션에 포함된 레슨. 32개 중 16번째.

Container에 width:와 height:를 지정하면 자식 요소의 크기에 맞춰지지 않습니다. 크기 단위는 픽셀입니다.

Container(
  width: 300,
  height: 50,
  color: Colors.orange,
  child: Text('Banner'),
)

자식 요소는 상자의 왼쪽 위 모서리에 배치됩니다. Flutter의 픽셀은 모든 휴대전화에서 크기가 같으므로 너비가 300인 상자는 작은 휴대전화에서도 큰 휴대전화에서도 거의 같은 크기로 보입니다.

챌린지

쉬움

파란색 상자의 너비를 200픽셀로, 높이를 100픽셀로 만드세요.

직접 해보기

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Container(
            color: Colors.lightBlue,
            child: Text('Box'),
          ),
        ),
      ),
    );
  }
}