[flutter] Scaffold에서 색상 테마를 변경하는 방법은 어떻게 되나요?

12 Dec 2023

flutter

Scaffold 위젯을 사용하여 앱의 기본 레이아웃을 만들 수 있습니다. Scaffold 위젯은 테마 데이터를 사용하여 앱의 디자인을 정의합니다.

테마 데이터를 변경하려면, Scaffold 위젯 내의 ThemeData 속성을 수정해야 합니다. ThemeData는 앱의 모양, 폰트, 색상 등을 정의하는 데 사용됩니다.

다음은 Scaffold에서 테마를 변경하는 간단한 예제입니다.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
      theme: ThemeData(
        primaryColor: Colors.blue,
        accentColor: Colors.orange,
        // 기타 테마 속성들을 설정할 수 있습니다.
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('색상 테마 변경'),
      ),
      body: Center(
        child: Text(
          '테마 변경 예제',
        ),
      ),
    );
  }
}

위 코드에서 ThemeData를 사용하여 primaryColor와 accentColor를 설정하여 색상 테마를 변경하였습니다.

더 많은 테마 속성과 사용 방법은 Flutter 공식 문서를 참고하시기 바랍니다. Flutter 테마 관련 문서

위 예제를 수정하면 원하는 형태의 색상 테마를 적용할 수 있습니다.