Чтобы создать значок сердца во Flutter, у вас есть несколько вариантов. Вот несколько методов и примеры кода:
Метод 1: использование встроенного класса Icons
Flutter
import 'package:flutter/material.dart';
class HeartIcon extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Icon(Icons.favorite);
}
}
Метод 2. Использование собственного шрифта для значков
- Сначала загрузите шрифт значка (например, значок сердечка) в формате.ttf или.otf.
- Создайте папку с именем
fonts
в корневом каталоге вашего проекта Flutter. - Поместите файл шрифта значка (например,
heart_icon.ttf
) в папкуfonts
. - Обновите файл
pubspec.yaml
, включив в него шрифт:flutter: fonts: - family: HeartIcon fonts: - asset: fonts/heart_icon.ttf
- Запустите
flutter pub get
, чтобы получить шрифт. - Используйте собственный значок в своем коде:
import 'package:flutter/material.dart'; class HeartIcon extends StatelessWidget { @override Widget build(BuildContext context) { return Icon( IconData(0xe800, fontFamily: 'HeartIcon'), ); } }
Метод 3. Использование файла SVG
- Найдите значок сердца в формате SVG или создайте свой собственный.
- Добавьте пакет
flutter_svg
в файлpubspec.yaml
:dependencies: flutter_svg: ^0.22.0
- Запустите
flutter pub get
, чтобы получить пакет. - Используйте файл SVG в своем коде:
import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; class HeartIcon extends StatelessWidget { @override Widget build(BuildContext context) { return SvgPicture.asset( 'assets/heart_icon.svg', color: Colors.red, // Optionally, you can set the color ); } }