时间戳

首页 > 解决方案 > 字体真棒微调器图标不会在颤动中旋转

flutter - 字体真棒微调器图标不会在颤动中旋转

问题描述

我正在使用如下微调器图标，但我不知道它为什么不旋转。它就像一个普通的图标一样工作。

import 'package:font_awesome_flutter/font_awesome_flutter.dart';

class MyWidget extends StatelessWidget {
  Widget build(BuildContext context) {
    return new IconButton(
      // Use the FontAwesomeIcons class for the IconData
      icon: new Icon(FontAwesomeIcons.spinner), 
      onPressed: () { print("Pressed"); }
     );
  }
}

标签： flutter

解决方案

目前，此包仅提供图标，但这些图标不会自行旋转或动画。使用颤振的动画功能来旋转它。这是来自Brian Egan的示例小部件。

class Spinner extends StatefulWidget {
  final IconData icon;
  final Duration duration;

  const Spinner({
    Key key,
    @required this.icon,
    this.duration = const Duration(milliseconds: 1800),
  }) : super(key: key);

  @override
  _SpinnerState createState() => _SpinnerState();
}

class _SpinnerState extends State<Spinner> with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Widget _child;

  @override
  void initState() {
    _controller = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 2000),
    )..repeat();
    _child = Icon(widget.icon);

    super.initState();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return RotationTransition(
      turns: _controller,
      child: _child,
    );
  }
}

用法

Spinner(
  icon: FontAwesomeIcons.spinner,
)

github上的相关问题

推荐阅读