為了達到最佳顯示,我們在開發過程中一般會在不同解析度的螢幕上顯示不同尺寸的圖片。
圖片資源存放
在專案中建立一個assets
資料夾用來存放資原始檔,資原始檔夾裡面可以放任意型別的檔案,為了區分,我們再建立一個images
的子資料夾用來存放圖片。為了處理解析度的問題,我們還需要在images
資料夾下建立2.0x
和3.0x
兩個子資料夾,用來存放2倍和3倍的圖。
要把list.png
放入Flutter工程裡面,你要把1倍圖放到images
下面,其它倍數的放到對應的子資料夾下面。
assets/images/list.png // 1倍圖
assets/images/2.0x/list.png // 2倍圖
assets/images/3.0x/list.png // 3倍圖
複製程式碼
宣告圖片資源
去pubspec.yaml
檔案中宣告這個圖片資源。
清除註釋,注意
assets
前面有一個空格,要整體左移,不然會報Error on line 49, column 4 of pubspec.yaml: Expected a key while parsing a block mapping.
的錯誤。
使用方法
在你需要使用的地方呼叫即可。
Image.asset("assets/images/list.png");
複製程式碼