Flutter 加载 Widget 类颜色答案

【问题标题】：Flutter Loading Widget class ColorFlutter 加载 Widget 类颜色
【发布时间】：2021-07-06 02:38:07
【问题描述】：

我又一次回到这里，因为我使用颤振进行新的编码，我在实验中学习。我想做的是制作一个全局加载小部件，可以调用它来显示具有指定颜色的加载小部件，并且想知道是否有人可以帮助我完成这个。

例如...

我更喜欢如何调用加载小部件：

LoadingWidget(Orange);

global_widgets.dart

import 'package:flutter/material.dart';
import 'package:myapp/res/colors.dart';

class LoadingWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CircularProgressIndicator(
      valueColor: AlwaysStoppedAnimation<Color>(
        // Replace following with specified Color like, CustomColors.'specifield_color'??
        // CustomColors.[replace with specified color]
        CustomColors.Orange,
      ),
    );
  }
}

class AppBarTitle extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisSize: MainAxisSize.min,
      children: [
        Image.asset(
          'assets/logo.png',
          height: 20,
        ),
        SizedBox(width: 8),
        Text(
          'My',
          style: TextStyle(
            color: CustomColors.Navy,
            fontSize: 18,
          ),
        ),
        Text(
          'App',
          style: TextStyle(
            color: CustomColors.Orange,
            fontSize: 18,
          ),
        ),
      ],
    );
  }
}

colors.dart

import 'package:flutter/material.dart';

class CustomColors {
  static final Color Navy = Color(0xFF2C384A);
  static final Color Orange = Color(0xFFF57C00);
}

【问题讨论】：

标签： flutter dart widget

【解决方案1】：

将Color类型的变量customColor添加到LoadingWidget

class LoadingWidget extends StatelessWidget {

  final Color customColor;
  LoadingWidget(this.customColor);

  @override
  Widget build(BuildContext context) {
    return CircularProgressIndicator(
      valueColor: AlwaysStoppedAnimation<Color>(
        customColor, // <--- // your specified color
      ),
    );
  }
}

现在您可以像这样调用小部件：LoadingWidget(CustomColors.Orange)

这个gist 包含工作代码，如果需要，您可以在 DartPad 上运行它。

【讨论】：