NetworkImage (2)

플러터에서 로컬, 네트워크 이미지 사용하는 방법 우리는 앱에 적절한 이미지를 추가하여 사용자가 앱을 이해하기 쉽게 유도하거나, 앱의 분위기와 느낌(?)을 만들 수 있습니다. 이때 사용되는 이미지는 주로 로컬 저장소나 서버 요청으로 불러오는데요. 플러터에서는 Image() 위젯을 이용하면 간단하게 처리할 수 있습니다. 그럼 어떻게 이미지를 불러와서 화면에 나타내는지 알아보도록 하겠습니다. 로컬 이미지 우선 로컬에 저장된 이미지를 불러오려면 실제로 저장된 이미지가 있어야겠죠? 프로젝트의 최상위 위치에 assets 폴더를 생성합니다. 참고로 폴더 이름은 자유롭게 사용하시면 됩니다. 그리고 해당 폴더에 우리가 사용할 이미지를 추가합니다. 위젯에서 로컬 이미지를 표시하기 위해서는 pubspec.yaml 파일에 사..

플러터 cached_network_image 패키지로 이미지 캐시 처리 이미지가 많은 앱 페이지를 실행하면 이미지를 불러오고, 정상적으로 출력하기까지 아주 잠깐이지만 시간이 소요됩니다. 이때 사용자는 빈 공간의 이미지 영역이 채워지는 과정에서 깜빡이는 현상을 경험할 수 있습니다. 또 사용자가 인터넷이 연결되지 않은 오프라인 상태에서 앱을 실행하면, 이미지를 다운로드 받지 못해 앱을 이용하는데 큰 불편을 느낄 수 있습니다. 개인적으로 이런 사소한 부분이 앱의 완성도와 사용자 경험을 높인다고 생각합니다. 플러터에서는 cached_network_image 패키지를 사용하면 이런 이슈를 해결할 수 있습니다. 이 패키지는 일정 기간 동안 다운로드 받은 이미지를 캐시 저장소에 저장하여, 오프라인에서도 캐시 저장소에..