Flutter技术文章Flutter入门实践

005.3 flutter展示svg【入门级】

2020-03-07  本文已影响0人  码农二哥

1 找个支持svg渲染的库,比如flutter_svg

2 引入flutter_svg

3 添加svg资源

4 在使用的地方引用flutter_svg

import 'package:flutter_svg/flutter_svg.dart';

5 展示svg

// 读取并创建widget
final String assetName = 'assets/rectangles.svg';
final Widget svgIcon = SvgPicture.asset(
  assetName,
  // color: Colors.red,
  semanticsLabel: 'A red up arrow'
);

// 展示svg widget
children: <Widget>[
    Text(
      'You have pushed the button this many times:',
    ),
    Text(
      '$_counter',
      style: Theme.of(context).textTheme.display1,
    ),
svgIcon//这里引用上面定义的svg widget。
],

总结

environment:
  sdk: ">=2.2.0 <3.0.0"
  flutter: ">=1.6.7 <2.0.0"
image.png
上一篇 下一篇

猜你喜欢

热点阅读