[flutter]플러터 이미지 넣고(CircleAvatar) 크기 조절하기

플러터 이미지 넣는 방법은 여러 가지가 있습니다. 그중 가장 쉽게 접근할 수 있는 CircleAvatar에 대해 알아보겠습니다.

 

​

 

▣ pubspce.yaml파일 수정과 이미지넣기

먼저 이미지를 넣으려면 경로에 폴더를 만들고 이미지 파일을 넣어 주서야 합니다. 그리고 pubspec.yaml페이지를 수정해야 합니다.  저는 assets폴더를 만들어 lalee.png파일과 pika.png파일을 넣어두었습니다. 그리고 pubspce.yaml파일을 수정했습니다.

 

플러터프로젝트파일트리

 

pubspec.yaml코드수정화면

 

위와 같이 코드를 추가해 주었습니다. 여기서 주의할 점은 띄어쓰기가 매우 중요합니다. 스페이스바나 탭키를 한 번만 잘못 입력해도 에러가 나기 때문에 위와 같이 입력해주고 저장해야 합니다.

(스페이스바 기준 2칸)  assets :   

(스페이스바기준 4칸)    - assets.lalee.png

(스페이스바기준 4칸)    - assets/pika.png 

 

 

▣ main.dart코드 수정

그리고 main.dart파일로 돌아와 아래와 같이 코딩하면 해당 이미지를 불러올 수 있습니다.

CircleAvatar(
  backgroundImage: AssetImage('pika.png'),
),

main.dart코드추가

 

 

▣ CircleAbatar 사이즈 조절하기

옵션으로 radius : double타입 숫자를 이용하면 이미지 사이즈를 조절할 수 있습니다.

ex) radius : 50.0

 

​