Flutter - 我應該如何確定圖像的大小？

Question

如何確定圖像的大小？ 例如，我將使用圖標進行底部導航。 圖標的大小應該是 20x20 嗎？ 還是 25x25？ 我怎么知道這個？ 或者假設我要使用背景圖片，它的尺寸應該是 400x800 還是 600x1200。 最佳優化 memory 管理和應用程序大小的標准大小應該是多少

默認不支持使用 SVG。 所以我正在尋找一種最佳優化 PNG 或 JPG 的方法。 我還將圖像分為 1.5x、2.0x、3.0x、4.0x 和原始圖像。 但我無法確定原始圖像的確切大小。

例如，調試控制台給出如下錯誤：

════════ Exception caught by painting library ══════════════════════════════════
Image assets/images/2.0x/login_picture.png has a display size of 414×516 but a decode size of 828×707, which uses an additional 1936KB.

Consider resizing the asset ahead of time, supplying a cacheWidth parameter of 414, a cacheHeight parameter of 516, or using a ResizeImage.
════════════════════════════════════════════════════════════════════════════════

Answer 1

那么，使用 1.0x、2.0x 和 3.0x 圖像是一個很好的做法，您應該讓您的設計師給您這些尺寸的圖像 in.png 或 go 到 figma 或 photoshop 並導出 2.0x 和 3.0x 資產

對於調試錯誤，您應該像這里一樣使用fit: BoxFit.fill

Scaffold(
  backgroundColor: AppColor.backgroundPrimaryColor,
  body: Container(
    margin: const EdgeInsets.only(top: 100),
    decoration: BoxDecoration(
      image: DecorationImage(
          fit: BoxFit.fill, //Important
          image: AssetImage(BackgroundImages.backgroundShapes)
      ),
    ),
  )
);