Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- Load Image
- node.js
- FutureBuilder
- Row
- HTTP
- Flutter 강좌
- ListTile
- Flutter 예제
- Flutter Tutorial
- Flutter Example
- CrossAxisAlignment
- navigator
- MainAxisAlignment
- Row Widget
- ListView.builder
- InkWell
- sqlite
- flutter
- Cached Image
- Scaffold
- Flutter 앱 배포
- 반석천
- WillPopScope
- Image.network
- Column Widget
- AppBar
- listview
- Snackbar
- Networking
- Hello World
Archives
- Today
- Total
목록NetworkImage (1)
꿈꾸는 시스템 디자이너
Flutter 강좌 - [Image] 이미지 페이드인(Fade in) 효과 & 플래이스홀더(placeholder) 효과 사용법
Flutter 강좌 목록 : https://here4you.tistory.com/120 지난 강좌에서는 Image.network() 위젯을 이용해서 온라인 이미지를 스크린에 출력하는 방법에 대해서 알아봤다. 그런데 온라인상에서 이미지를 다운로드를 할 때 일정시간이 소요되고 이 시간동안 스크린에는 아무것도 출력되지 않는다. 이는 UX 적으로 적절하지 못하다. 해결방법으로는 이미지가 준비되어 출력될 때 까지 이미지를 대신할 뭔가를 사용자에게 보여서 앱이 바쁘게 준비중임을 알리면 된다. 우선 실행화면을 살펴보자. 이미지가 출력되기 전에 둥그란 모양의 프로그레스 인디케이터를 출력하여, 조만간 뭔가가 출력될 것이라는 것을 사용자에게 알릴 수 있다. 또한 페이드인(Fade-in) 효과로 이미지가 서서히 나타나는 효..
Development/Flutter
2019. 7. 4. 12:43