[Flutter] asset 폴더 등록

1. asset 폴더 생성

asset 폴더는 프로젝트의 자산(폰트, 이미지, 동영상 등)들을 사용할 수 있도록 관리하는 폴더이다.

최상위 프로젝트 폴더 하위에 asset 폴더를 생성하고, 그 내부에 사용할 이미지 파일을 넣는다.
필자는 추후 다양한 자산 관리를 위해 asset 폴더 하위에 img 폴더를 생성하고, 그 안에 이미지를 넣어주었다! (개인 취향으로 설정해도 무방하다.)

root_proj
	- android
    - ios
    ...
	- asset
    	- img
        	- logo.png

2. pubspec.yaml 추가

flutter는 폴더를 추가해서 파일을 넣는다고 해도 바로 프로젝트에서 사용할 수 없다.

pubspec.yaml 파일을 열고 flutter: 내부에 코드를 추가한다. 필자는 asset 폴더 하위에 img 폴더를 따로 생성했기 때문에 이렇게 추가했다. 본인 디렉토리명을 주의해서 적어주자. (asset 앞 하이픈(-)은 오타가 아니다.)

flutter:
  assets:
    - asset/img/

pubspec.yaml 파일에 무엇이든 변경이 일어난다면 pub get을 꼭 해야한다!
필자는 android studio를 사용하고 있기 때문에 pubspec.yaml 파일이 수정된다면 아래 이미지와 같이 pub get 버튼이 존재한다. (우측 상단)

3. 테스트

asset/img/logo.png 이미지를 사용한 HomeScreen 코드이다.

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Image.asset(
            'asset/img/logo.png',
          ),
        ],
      ),
    );
  }
}

• android emulator 실행 결과