Как добавить 2 тоновых иконки без использования какого-либо плагина?

Question

Я не хочу добавлять какие-либо плагины только для одного значка в моем приложении, но мне нужны два тона, потому что цвет фона будет меняться, и я не знаю, когда будет темно, а когда будет светло.

Я имею в виду подобные значки - https://material.io/tools/icons/?style=twotone, где значки имеют границы разного цвета.

Answer 1

Если я правильно понял ваш вопрос, вот пример двух цветовых тонов Icon & Text.

Вы можете поиграть с цветом, радиусом и другими параметрами, чтобы соответствовать вашим потребностям.

body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            ShaderMask(
              blendMode: BlendMode.srcATop,
              shaderCallback: (Rect bounds) {
                return RadialGradient(
                  center: Alignment.topLeft,
                  radius: 1.0,
                  colors: <Color>[Colors.red, Colors.cyanAccent],
                  tileMode: TileMode.mirror,
                ).createShader(bounds);
              },
              child: Text(
                'Two Tone Color Icon & Text!',
                style: TextStyle(fontSize: 22.0),
              ),
            ),
            SizedBox(
              height: 10.0,
            ),
            ShaderMask(
              blendMode: BlendMode.srcATop,
              shaderCallback: (Rect bounds) {
                return RadialGradient(
                  center: Alignment.center,
                  radius: 1.0,
                  colors: <Color>[
                    Colors.greenAccent[200],
                    Colors.blueAccent[200]
                  ],
                  tileMode: TileMode.repeated,
                ).createShader(bounds);
              },
              child: Icon(
                Icons.dashboard,
                size: 32.0,
              ),
            ),
          ],
        ),
      ),

Выход: