iT邦幫忙

2022 iThome 鐵人賽

DAY 11
0
Mobile Development

Flutter Didilong系列 第 11

D-11 Assets/Network | Flutter筆記

  • 分享至 

  • xImage
  •  

能顯示圖片方式不只一種

用於APP中需要顯示圖片的狀況有許多種

  1. 頁面背景
  2. 登入用戶的頭貼
  3. 按鈕上的Icon圖示

讀取Assets LocalPhoto

assets可將APP內所需要的圖片預先存放於檔案中
但我們得在pubspec.yaml中先告訴它我們有哪些檔案要存放

pubspec.yaml

flutter:
  assets:
    - assets\testFile\test.png
    - assets\testFile\test2.png

view in dart

Image.asset('assets/testFile/test.png')

此外,文本內容或是假資料的Json都可以存訪在Assets

NetWork Photo

像是電商平台或是存在會員使用者的APP
都會有用戶頭像/商品照片的存放需求
這樣大量的圖檔不太可能全部存在使用者手機中
所以就得透過網路讀取圖片

分別可讀取圖片以及GIF

Image.network('https://picsum.photos/250?image=9'),

Image.network(
    'https://docs.flutter.dev/assets/images/dash/dash-fainting.gif');

上一篇
D-10 image_picker | Flutter筆記
下一篇
D-12 ListView.GridView | Flutter筆記
系列文
Flutter Didilong30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言