AnimationOpacity Example

main.dart

import 'package:flutter_web/material.dart';
import 'package:flutter_web_ui/ui.dart' as ui;

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<Item> items;
  int selected = -1;

  @override
  void initState() {
    super.initState();

    items = new List<Item>();
    items.add(new Item('Item 1'));
    items.add(new Item('Item 2'));
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Demo',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Demo'),
        ),
        body: new GestureDetector(
          onTap: () {
//             FocusScope.of(context).requestFocus(new FocusNode());
            print('clicked on page');
            setState((){
              selected = -1;
            });
          },
          child: ListView.builder(
              itemCount: items.length,
              itemBuilder: (context, index) {
                return GestureDetector(
                  child: AnimatedOpacity(
                    child: Card(
                      child: Container(
                        padding: const EdgeInsets.all(10.0),
                        child: Text(items[index].name),
                      ),
                    ),
                    duration: Duration(seconds: 1),
                    opacity: (selected == -1
                        ? 1.0
                        : (index == selected ? 1.0 : 0.2)),
                  ),
                  onTap: () {
                    setState(() {
                      selected = index;
                    });
                  },
                );
              }),
        ),
      ),
    );
  }
}

class Item {
  String name;

  Item(String n) {
    this.name = n;
  }
}

Future<void> main() async {
  await ui.webOnlyInitializePlatform();

  runApp(MyHomePage());
}