[플러터] .json theme 파일사용하기

main.dart 파일에서 패키지를 임포트 해준다.

json_theme.dart는 외부 패키지이므로 pubspec.yaml 파일에 미리 등록을 해줘야 한다.

 

import 'package:flutter/material.dart';

import 'dart:convert'; // for jsonDecode

import 'package:flutter/services.dart'; // for rootBundle

import 'package:json_theme/json_theme.dart'; // for theme decoder

 

 

assets 폴더안에 theme.json 파일을 저장해주고, 아래와 같이 불러온다.

 

void main() async {

  // 테마데이터 실행 _ from json_theme, asset

  WidgetsFlutterBinding.ensureInitialized();

  final themeStr = await rootBundle.loadString('assets/theme.json');

  final themeJson = jsonDecode(themeStr);

  final theme = ThemeDecoder.decodeThemeData(themeJson);

  final ThemeData? customTheme = theme;

 

 

materialapp 에서 theme를 불러온다. (여기서는 Get 패키지를 사용)

 

child: GetMaterialApp(

  scrollBehavior: AppScrollBehavior(),

  home: MePage0(),

  debugShowCheckedModeBanner: false,

  theme: customeTheme,

),

 

 

이제 사용을 해주면 된다. json theme를 제작할 수 있는 사이트는 아래 사이트밖에 모르겠다.

 

Appainter

 

 

끝.