Создаем портфолио за 1 месяц
К концу месяца: 4 классных проекта в вашем портфолио! Стоимость: 100$. Подробности...
240 of 1024 menu
◀ ▶

Метод createShader

Метод createShader класса RadialGradient возвращает Shader, который заливает область цветами RadialGradient. Прямоугольник Rect задаёт область, в которой круг градиента растягивается. Результат передают в кисть холста.

Синтаксис

RadialGradient(colors: [Colors.red, Colors.blue]).createShader(Rect.fromLTWH(0, 0, 100, 50))

Параметры

Параметр Описание
rect Прямоугольник, в котором строится Shader.

Пример

Давайте зальём область шейдером градиента:

import 'package:flutter/material.dart'; void main() { runApp( MaterialApp( home: Scaffold( body: Center( child: CustomPaint( size: const Size(220, 100), painter: _RadialGradientShaderPainter(), ), ), ), ), ); } class _RadialGradientShaderPainter extends CustomPainter { @override void paint(Canvas canvas, Size size) { final rect = Rect.fromLTWH(0, 0, size.width, size.height); final gradient = RadialGradient(colors: [Colors.yellow, Colors.orange]); final paint = Paint()..shader = gradient.createShader(rect); canvas.drawRect(rect, paint); } @override bool shouldRepaint(covariant CustomPainter oldDelegate) => false; }

На экране виден градиент внутри CustomPaint.

Пример

Давайте сузим область рисования:

import 'package:flutter/material.dart'; void main() { runApp( MaterialApp( home: Scaffold( body: Center( child: CustomPaint( size: const Size(180, 80), painter: _RadialGradientShaderPainter2(), ), ), ), ), ); } class _RadialGradientShaderPainter2 extends CustomPainter { @override void paint(Canvas canvas, Size size) { final rect = Rect.fromLTWH(0, 0, size.width, size.height); final gradient = RadialGradient(colors: [Colors.yellow, Colors.orange]); final paint = Paint()..shader = gradient.createShader(rect); canvas.drawRect(rect, paint); } @override bool shouldRepaint(covariant CustomPainter oldDelegate) => false; }

На экране градиент в меньшем прямоугольнике.

Смотрите также

  • класс LinearGradient,
    линейный градиент
  • класс BoxShadow,
    тень блока
  • класс SweepGradient,
    угловой градиент
  • класс Offset,
    точка или сдвиг
← →
↑
Мы используем cookie для работы сайта, аналитики и персонализации. Обработка данных происходит согласно Политике конфиденциальности.
принять все настроить отклонить