반응형
플러터에서 아이콘의 무게/대담함(FontWeight) 증가/구성 방법
나는 내 플러터 앱에 아이콘(구체적으로 말하자면 뒤 아이콘)을 가지고 있다. 더 가벼워 보여요. 나는 그것을 대담하게 만들고 싶다/어떤 이유에서인지 체중을 늘리고 싶다.
Container(
child: Icon(
Icons.arrow_back,
color: Color(0xffffffff),
),
padding: EdgeInsets.all(10.0),
margin: EdgeInsets.fromLTRB(0, 10.0, 0, 0.0),
decoration: BoxDecoration(
color: Color(0xff03b673),
borderRadius: BorderRadius.all(Radius.circular(100.0)),
),
)
관련 스레드/문서를 찾을 수 없습니다.
아이콘
Container(
child: Icon(
Icons.arrow_back,
color: Color(0xffffffff),
size: 24.0
),
padding: EdgeInsets.all(10.0),
margin: EdgeInsets.fromLTRB(0, 10.0, 0, 0.0),
decoration: BoxDecoration(
color: Color(0xff03b673),
borderRadius: BorderRadius.all(Radius.circular(100.0)),
),
)
현재, 나는 아이콘에 속성이 없다고 생각한다. 사용자 지정 아이콘을 에서 가져올 수 있으며 글꼴 아래에서 가져올 때 pubspec.swl에서 글꼴 가중치를 다음과 같이 설정할 수 있습니다:
flutter:
fonts:
- family: MyIcon
fonts:
- asset: lib/fonts/iconfont.ttf
weight: 400
자세한 내용은 다음 기사를 참조하십시오:
아이콘 크기를 지정하여 수행할 수 있습니다.
Container(
child: Icon(
Icons.arrow_back,
size: 20.0,
color: Color(0xffffffff),
),
padding: EdgeInsets.all(10.0),
margin: EdgeInsets.fromLTRB(0, 10.0, 0, 0.0),
decoration: BoxDecoration(
color: Color(0xff03b673),
borderRadius: BorderRadius.all(Radius.circular(100.0)),
),
)
질문은 오래되었지만 누군가에게 도움이 되기를 바란다.
이전:
Icon(
CupertinoIcons.exclamationmark_circle,
color: Colors.red,
size: 16.0,
)
이후(포함):
Text(
String.fromCharCode(CupertinoIcons.exclamationmark_circle.codePoint),
style: TextStyle(
inherit: false,
color: Colors.red,
fontSize: 16.0,
fontWeight: FontWeight.w700,
fontFamily: CupertinoIcons.exclamationmark_circle.fontFamily,
package: CupertinoIcons.exclamationmark_circle.fontPackage,
),
)
물론 아이콘은 다양한 가중치를 지원해야 합니다. 내 예시의 아이콘은 오직 2개의 가중치만 지원한다:
thin <= FontWeight.w500
thick >= FontWeight.w600
만약 당신이 그것을 바꾸고 싶다면
Flutter 3.10.0 이상 버전부터:
재료 설계 3은 플러터에서 구현되므로 다음 예와 같이 아이콘의 무게를 쉽게 지정할 수 있습니다:
Icon(Icons.star_outline,weight: 10)
무게 설정(스트로크 두께). 기본적으로 제공되는 아이콘 중 이 속성을 지원하는 아이콘이 없습니다. 따라서 이러한 아이콘에는 속성을 설정해도 아무런 효과가 없습니다.
패키지의 아이콘은 가중치 속성을 지원합니다. 예:
import 'package:material_symbols_icons/symbols.dart';
...
Icon(Symbols.chevron_right, weight: 100)
반응형
'개발하자' 카테고리의 다른 글
파이썬에서 셀레늄으로 헤드리스 마이크로소프트 엣지를 실행하는 방법? (0) | 2023.09.04 |
---|---|
파이썬에서 셀레늄으로 헤드리스 파이어폭스를 실행하는 방법? (0) | 2023.09.04 |
타이프스크립트 인터페이스에서 사용할 수 있도록 구성요소 유형을 가져오는 방법 - Vue 3 (0) | 2023.09.03 |
프리즘 유형 스크립트 안에 조항이 포함되어 있습니까? (0) | 2023.09.02 |
형식 스크립트, 자동으로 모든 약속 반환 기능 호출 대기 (0) | 2023.09.02 |