首页 > 解决方案 > 在按钮按下时颤动旋转图标并带有动画

问题描述

我有button一个icon里面有一个。现在我正在使用两个不同的icons并更改它们onTap

Widget build(BuildContext context) {
return GestureDetector(
  onTap: () {
    setState(() {
        _isDropdownOpened = !_isDropdownOpened;
      }
  ...
  },
  child: 
        _isDropdownOpened
            ? SvgPicture.asset(
                'images/icons/arrow_down_primary.svg',
                width: scaleWidth(12),
              )
            : SvgPicture.asset(
                'images/icons/arrow_up_primary.svg',
                width: scaleWidth(12),
              ),
  ),
);

这是有效的,但我想要一个RotationTransition. 如何icon onTap 使用动画旋转我的,所以我不需要两个不同的 SVG?

标签: flutterdartanimationbuttontransform

解决方案


使用RotatedBox小部件并在您的setState

你可以这样做

 child: RotatedBox(
  quarterTurns: _isDropdownOpened? 2:0,
  child: SvgPicture.asset(
            'images/icons/arrow_down_primary.svg',
            width: scaleWidth(12),
          ),
) 

如果您想将动画应用于旋转以及考虑查看


推荐阅读