Flutter/ 이미지 추가하기

Benedictus Park·2022년 12월 15일
0

Flutter

목록 보기
1/1
post-thumbnail

1. 이미지들을 모아둘 디렉터리를 만들고, 그 안에 이미지를 넣습니다.

2. pubspec.yaml 파일의 assets 부분을 수정합니다.

imgs/tooltip.png와 같이 세부적인 경로를 지정해줘도 되지만, imgs/만 써 주어도 됩니다. 디렉터리만 적을 경우 디렉터리 내의 모든 이미지를 Asset으로 처리합니다.

3. Android Studio 상단의 pub get을 누릅니다.

4. Image.asset("[이미지 파일 경로]")로 이미지 위젯을 생성-사용합니다.

class Intro extends StatelessWidget{
  Widget build(BuildContext context){
    return new Scaffold(
      backgroundColor: Colors.lightBlue,
      body: Center(
        child: Image.asset("imgs/tooltip.png")
      ),
    );
  }
}

아래와 같이 이미지의 크기를 조절할 수 있습니다. width와 height중 하나만 지정하는 경우 이미지가 비율을 유지한 채 커지거나 작아집니다.

class Intro extends StatelessWidget{
  Widget build(BuildContext context){
    return new Scaffold(
      backgroundColor: Colors.lightBlue,
      body: Center(
        child: Image.asset("imgs/tooltip.png", width:200)
      ),
    );
  }
}

0개의 댓글