Flutter and CupertinoContext menu with avatar after press and hold is showing the white squere

Question

after pressing and holding the avatar I am seeing the white squere around it, can you help me solve this problem, thank you. I tried mby everything, but it didnt work at all. I cannot find any other question of this type, so I am mby dumb and its simple solution, here is the three images of the process showing that it is happening only when the avtar is pressed

enter image description here

enter image description here

enter image description here

import 'package:countee/components/my_card.dart';
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';

class SettingsPage extends StatefulWidget {
  const SettingsPage({Key? key}) : super(key: key);

  @override
  State<SettingsPage> createState() => _SettingsPageState();
}

class _SettingsPageState extends State<SettingsPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.transparent,
      body: Container(

        alignment: Alignment.center,
        child: MyCard(
          theHeight: 600.0,
          theWidth: 325.0,
          theChild: Column(
            children: [
              Center(
                child: Column(
                  children: [

                    Center(
                      child: CupertinoContextMenu(

                        actions: [
                          CupertinoContextMenuAction(
                              trailingIcon: CupertinoIcons
                                  .arrow_2_circlepath_circle_fill,
                              onPressed: () {
                                Navigator.pop(context);
                              },
                              child: const Text("Změnit")),
                          CupertinoContextMenuAction(
                              isDestructiveAction: true,
                              trailingIcon: CupertinoIcons.delete,
                              onPressed: () {
                                Navigator.pop(context);
                              },
                              child: const Text(
                                "Odtranit",
                                style: TextStyle(
                                    color: Colors.red,
                                    fontWeight: FontWeight.bold),
                              )),
                        ],
                        child: const CircleAvatar(

                          backgroundColor: Colors.transparent,
                          radius: 60,
                          backgroundImage:

                              AssetImage("assets/images/avatar.jpg"),
                        ),
                      ),
                    ),
                    const SizedBox(height: 20),
                    const Text(
                      "Jan",
                      style: TextStyle(color: Colors.white),
                    ),
                    const Text(
                      "Černohous",
                      style: TextStyle(color: Colors.white),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Answer 1

You can use CupertinoContextMenu.builder to have more control over ui.

CupertinoContextMenu.builder(
  actions: [
    //  ...
  ],
  builder: (context, animation) {
    return const CircleAvatar(
      radius: 60,
      backgroundImage:
          AssetImage("assets/images/avatar.jpg"),
    );
  },
),