본문 바로가기

코딩강의/Flutter 로 웹툰 앱 만들기(플러터-노마드코더)

Icons and Transforms

1. 아이콘 추가 하는 법과 특정 부분만 조정하는 방법을 배워보자

 

아이콘 추가 하는 방법은 Icon 위젯을 이용 하면 된다.

 

그리고 만약 해당 아이콘을 키우려고 사이즈를 올리면 그 아이콘을 감싸는 Container 전체가 커지는 문제가 발생하기 때문에, 해당 아이콘만 키우기 위해서는 Transform.scale을 아래와 같이 활용 하면 된다.

 

그리고 해당 아이콘의 x축 y축을 이동 시키기 위해서는 Transform.translate를 활용 하면 된다.

                      Transform.scale(
                        scale: 2.2,
                        child: Transform.translate(
                          offset: const Offset(-5, 12),
                          child: const Icon(
                            Icons.euro_rounded,
                            color: Colors.white,
                            size: 88,
                          ),

그리고 Container 밖으로 나온 부분을 짜르기 위해서는 해당 Container 값에 clipBehavior 을 아래와 같이 추가해주면 된다.

              Container(
                clipBehavior: Clip.hardEdge,

 

결과, 아래와 같이 나옴

 

'코딩강의 > Flutter 로 웹툰 앱 만들기(플러터-노마드코더)' 카테고리의 다른 글

setState  (0) 2023.07.25
Reusable Cards  (0) 2023.07.22
Cards  (0) 2023.07.22
Reusable Widgets  (0) 2023.07.19
VSC 추가 세팅 + 박스 만들기  (0) 2023.03.27