使用圖像的 Flutter 圓形進度指示器

Question

我想在加載過程中使用我的應用程序圖標。 如何實施。 目前我正在使用循環進度指示器。

return Center(
       child: CircularProgressIndicator(
               strokeWidth: 2));

Answer 1

如果你想要的只是簡單的進度指示器，你可以使用它

class ProgressWithIcon extends StatelessWidget {
  const ProgressWithIcon({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 50,
      height: 50,
      child: Stack(
        alignment: Alignment.center,
        children: [
          Image.network(
            // you can replace this with Image.asset
            'https://avatars.githubusercontent.com/u/1393171?s=50&v=4',
            fit: BoxFit.cover,
            height: 30,
            width: 30,
          ),
          // you can replace
          const CircularProgressIndicator(
            valueColor: AlwaysStoppedAnimation<Color>(Colors.orange),
            strokeWidth: 0.7,
          ),
        ],
      ),
    );
  }
}

但如果你正在尋找復雜的東西，我會建議你去

• 里沃包
• 樂天禮包

Answer 2

有多種實現自定義加載器的方法。 如果您的 loader 是動畫的，那么知道您的 loader 的擴展格式。 根據我使用https://lottiefiles.com/ 之類的 json 動畫加載器的經驗，正在使用一個名為 lottie dependencies: lottie: ^1.2.1的包dependencies: lottie: ^1.2.1如果您的加載器是純圖像，那么您可以選擇使用計時器來在采取行動之前顯示圖像，例如等待來自互聯網的一些數據。 如果您需要更多幫助，請告訴我