How can I design this kind of button in flutter?

CodePudding user response：

Here you go, adjust to your needs:

Container(
            color:  Color.fromRGBO(133,208,212,1),
            padding: const EdgeInsets.all(15),
            child: Container(
              padding: EdgeInsets.all(8),
              decoration: ShapeDecoration(
                shape: StadiumBorder(),
                color:  Color.fromRGBO(133,208,212,1),
                shadows: <BoxShadow>[
                  BoxShadow(
                    color: Colors.white,
                    spreadRadius: 8,
                    blurRadius: 3,
                    offset: Offset(0, 0),
                  ),
                  BoxShadow(
                    color: Colors.grey.shade300,
                    spreadRadius: 3,
                    blurRadius: 3,
                    offset: Offset(5, 2),
                  ),
                ],
              ),
              child: Text(
                'Sign in',
                style: TextStyle(color: Colors.white),
              ),
            ),
          ),

The first Container is there just to highlight it's child, so it's not important

CodePudding user response：

You can use elevated button with transparent color and white border and shadow

CodePudding user response：

Try below code hope its help to you.

Container(
      padding: EdgeInsets.all(10),
      height: 80,
      width: 200,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(80),
      ),
      child: InkWell(
        onTap: () {
          //Write your onPressed function here
          print('Button Pressed');
        },
        child: Card(
          color: Colors.teal[100],
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(70),
          ),
          child: Center(
            child: Text(
              'Sign In',
              style: TextStyle(
                color: Colors.white,
                fontSize: 20,
              ),
            ),
          ),
        ),
      ),
    ),

Your result screen->