개발자

[Flutter] theme: TemeData(primarySwatch: Colors.blue,), 관한 질문

2023년 12월 15일조회 248

초보 Flutter 입니다. theme: TemeData( PrimarySwatch: Colors.blue,), 이 코드가 전체적인 테마를 파란색으로 한다고 이해했는데 Appbar 부분 색상이 안보이고 제목만 보입니다. 따로 Appbar 배경색을 지정해도 되지만 왜 안되는지 궁금합니다.

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 1

인기 답변

Jake님의 프로필 사진

복잡한 설명은 제쳐두고, ThemeData( useMaterial3: false, primarySwatch: Colors.blue, ) 로 작성하시면 원하시는 결과가 나올 것 같은데 시도해보시겠어요? 일단 아래에 흐름은, app_bar 파일에 작성되어있는 주석을 해석하여 추천 설정을 덧붙인 것입니다. 1. appBarTheme의 backgroundColor에 색상이 지정되어있으면, 해당 색상을 표시합니다. (-> 이걸 지정하시는게 제일 좋습니다.) 2. backgroundColor가 null일경우, AppBarTheme.backgroundColor를 표시합니다. 3. 2가 null일 경우, 테마의 Brightness에 따라서 달라지는데, Brightness.light이면 ColorScheme.primary를, Brightness.dark이면 ColorScheme.surface를 표시합니다. (-> primaryColor 말고, ColorScheme을 사용하시는게 좋습니다. 대부분의 컴포넌트가 theme의 primaryColor에 의존하지 않는것으로 바뀌고 있어요.) 근데 최신 버전의 플러터에서는, Brightness.light의 경우에도 ColorScheme.surface를 표시하고 있으니, 이게 질문자님이 궁금해하신 포인트가 아닐까 싶습니다. material3의 영향이 아닐까 추측되네요.

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

AI 답변
커리어리 AI 봇 프로필 이미지

커리어리 AI 봇

GPT가 달아주는 답변입니다.

2023년 12월 15일

`theme: ThemeData(primarySwatch: Colors.blue,)` 코드는 전체 앱의 기본 색상을 설정하는 코드입니다. 즉 이를 통해 AppBar, FloatingActionButton 등의 위젯에 적용되는 기본 색과 같은 앱의 주요 색상 팔레트를 변경할 수 있습니다. AppBar가 정상적으로 보이지 않는다면, 다음의 원인들을 고려해보시기 바랍니다: 1. AppBar 애니메이션이나 transition 중에 있는 경우 2. AppBar 위젯이 올바르게 tree에서 랜더링되지 않고 있는 경우 3. AppBar에 대한 style 속성이나 특정 테마 설정이 오버라이드했거나 충돌하는 경우 제대로 동작하지 않는다면 아래와 같이 AppBar에 직접 배경색을 지정하여 확인해 볼 수 있습니다. ```dart appBar: AppBar( title: Text('example'), backgroundColor: Theme.of(context).primaryColor, ), ``` 위 코드처럼 `Theme.of(context).primaryColor`를 사용하면 현재 프로젝트의 ThemeData에서 primaryColor 값을 호출하여 AppBar의 배경색으로 사용합니다. 여전히 문제가 해결되지 않는다면 Flutter doctor를 실행하여 환경 문제가 있는지 체크해볼 것을 권장드립니다.

목록으로

지금 가입하면 모든 질문의 답변을 볼 수 있어요!