Notice
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- inheritedWidget
- google search console
- Flask
- dynamic color
- 생명주기
- git설치
- uni_links
- GIT
- flutter
- python
- handlebars.js
- ipykernel
- receive_sharing_intent
- annotation
- 미색인
- 개역개정
- Jupyter Notebook
- velocity_x
- cache
- zani
- extention
- widgetsBindingObserver
- 성경필사
- dart
- vscdoe
- 소스제공
- 워드파일
- Anaconda
- Share
- Device
Archives
- Today
- Total
자니노트
Flutter dynamic_color 라이브러리 설명 및 사용법 본문
flutter_dynamic_color는 Flutter의 표준 패키지가 아닙니다.
그러나 "dynamic color"라는 개념이나 관련 패키지를 참조하고 있다면,
그것은 아마 iOS 13+의 Dynamic Color 기능을 Flutter에서 사용하려는 것일 수 있습니다.
이 기능을 사용하면, 앱이 light mode와 dark mode 사이에서 전환될 때 자동으로 색상을 조정할 수 있습니다.
Flutter에서 이러한 기능을 사용하려면, 기본적으로 ThemeData의 colorScheme 속성을 사용하여
light mode와 dark mode에 대한 색상을 지정할 수 있습니다.
다음은 Flutter에서 light mode와 dark mode에 대한 동적 색상을 설정하는 방법의 예입니다:
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Dynamic Color Demo',
theme: ThemeData.light().copyWith(
colorScheme: ColorScheme.light(
primary: Colors.blue, // Light mode에서의 주요 색상
secondary: Colors.red, // Light mode에서의 보조 색상
// 다른 색상들...
),
),
darkTheme: ThemeData.dark().copyWith(
colorScheme: ColorScheme.dark(
primary: Colors.blueGrey, // Dark mode에서의 주요 색상
secondary: Colors.deepOrange, // Dark mode에서의 보조 색상
// 다른 색상들...
),
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Dynamic Color Demo'),
),
body: Center(
child: ElevatedButton(
onPressed: () {},
child: Text('Click Me!'),
),
),
);
}
}
위의 예제에서 ThemeData.light()와 ThemeData.dark()는 각각 light mode와 dark mode에 대한 기본 테마 설정을 제공합니다. copyWith 메서드를 사용하여 이러한 기본 설정을 재정의하고, colorScheme 속성을 사용하여 특정 색상을 지정할 수 있습니다.
이렇게 설정하면, 사용자의 시스템 설정에 따라 앱이 light mode와 dark mode 사이에서 자동으로 전환되며,
지정한 색상이 적절하게 적용됩니다.
'모바일 개발 > Dart&Flutter' 카테고리의 다른 글
flutter WidgetsBindingObserver 설명 및 사용법 - 앱 생명주기 이벤트 처리 (0) | 2023.08.22 |
---|---|
Flutter velocity_x 설명 및 사용법 (0) | 2023.08.22 |
Flutter InheritedWidget 라이브러리 설명 및 사용 방법 (0) | 2023.08.22 |
Dart meta 라이브러리 설명 및 사용법 (0) | 2023.08.22 |
Dart equatable 라이브러리 설명 및 사용법 (0) | 2023.08.22 |
Comments