How to design curve text field with icon in start in flutter?

Question

I have this design that I'd like to use for my app but I'm not quite sure how to add the curved and the icon at the start of the text field.

Answer 1

Maybe something like this:

Container(
          padding: const EdgeInsets.symmetric(horizontal: 20),
          height: 50,
          child: Stack(
            clipBehavior: Clip.none,
            children: [
              ClipRRect(
                borderRadius: const BorderRadius.only(topRight: Radius.circular(20)),
                child: TextField(
                  decoration: InputDecoration(
                    fillColor: Colors.grey.shade300,
                    filled: true,
                    prefixText: '       ',
                    hintText: 'Email'
                  ),
                ),
              ),
              Positioned(
                left: -20,
                top: 0,
                child: Container(
                  height: 50,
                  width: 50,
                  padding: const EdgeInsets.all(5),
                  decoration: const ShapeDecoration(
                    color: Colors.white,
                    shape: CircleBorder(),
                  ),
                  child: Container(
                    decoration: ShapeDecoration(
                      color: Colors.grey.shade300,
                      shape: const CircleBorder(),
                    ),
                    padding: const EdgeInsets.all(5),
                    child: const Icon(Icons.mail),
                  ),
                ),
              )
            ],
          ),
        ),