'Random animation for random items in StaggeredGrid

I have a StaggeredGrid that holds a group of StaggeredGridTiles, i want to perform different type of animation (rotate, bounce, etc...) on random grid items up to 10 items only, then perform these animation on another different 10 random items.

@override
Widget build(BuildContext context) {
return Scaffold(
    body: SingleChildScrollView(
        child: StaggeredGrid.count(
  axisDirection: AxisDirection.down,
  crossAxisCount: 15,
  mainAxisSpacing: 1,
  crossAxisSpacing: 1,
  children: [...Data.items.map((e) => e).toList()],
)));}


 Class Data{

static Random random = Random();

static int next(int min, int max) => min + random.nextInt(max - min);

static List<Widget> items = [

  StaggeredGridTile.count(
    crossAxisCellCount: next(2, 4),
    mainAxisCellCount: next(2, 8),
    child: ClipRRect(
        borderRadius: BorderRadius.circular(10),
        child: InkResponse(
          borderRadius: BorderRadius.circular(10),
          onTap: () {},
          child: Container(
            decoration: const BoxDecoration(
              color: Colors.yellow,
              shape: BoxShape.circle,
            ),
            child: Center(child: Text('kkkkk')),
          ),
        ))),
         

           StaggeredGridTile.count(
    crossAxisCellCount: next(2, 4),
    mainAxisCellCount: next(2, 8),
    child: ClipRRect(
        borderRadius: BorderRadius.circular(10),
        child: InkResponse(
          borderRadius: BorderRadius.circular(10),
          onTap: () {},
          child: Container(
            decoration: const BoxDecoration(
              color: Colors.yellow,
              shape: BoxShape.circle,
            ),
            child: Center(child: Text('kkkkk')),
          ),
        ))),

             ...etc


        ]

    }

please see the attached image



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source