프론트엔드/Flutter

플러터 MediaQuery

빌럽스 2024. 3. 11. 20:58

 

MediaQuery: 화면의 사이즈를 받아오는 기능

import 'dart:io';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

void main() { // main 스레드는 runApp을 실행시키고 종료됨
  runApp(FirstApp()); // 비동기로 실행됨 (이벤트루프에 등록된다.)
  sleep(Duration(seconds: 3));
  print("main 종료");
}

// 저장만 하면 화면이 리도드 됨 = 핫 리로드
class FirstApp extends StatelessWidget {
  const FirstApp({super.key});

  @override
  Widget build(BuildContext context) {

    return MaterialApp( // CupertinoApp() -> IOS 앱
      home: SafeArea(
        child: Scaffold(
          body: HomeApp(),
        ),
      ),
    );
  }
}

class HomeApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    var m = MediaQuery.of(context); // MediaQuery: 화면의 사이즈를 받아옴
    print(m.size.width);
    print(m.size.height);
    print("safearea : ${m.padding.top}");
    return Column(
      children: [
        Container(
          height: (m.size.height-24) * 0.7,
          color: Colors.blue,
        ),
        Container(
          height: (m.size.height-24) * 0.3,
          color: Colors.red,
        )
      ],

    );
  }
}