Coram Deo

[Flutter] - Theme을 이용한 화면 배경색 설정하기 본문

Flutter

[Flutter] - Theme을 이용한 화면 배경색 설정하기

탁탁슝 2024. 6. 13. 23:44

1. main.dart의 build 메서드 안에 theme에 색깔을 미리 작성해놓는다.

     -  theme: ThemeData(
                scaffoldBackgroundColor: const Color(0xFFe64d3d),
         ),

Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        scaffoldBackgroundColor: const Color(0xFFe64d3d),
      ),
      home: const HomeScreen(),
    );
  }

 

2. home_screen.dart 의 build 메서드 안에 배경색을 지정한다.

     -   backgroundColor: Theme.of(context).scaffoldBackgroundColor,

 Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Theme.of(context).scaffoldBackgroundColor,
      body: const Column(
        children: [
          Text(
            "POMOTIMER",
            style: TextStyle(
              color: Colors.white,
            ),
          ),
        ],
      ),
    );
  }