Logic
Logic

Reputation: 63

How to remove border radius from TextButton flutter

I'm new to flutter, and I'm having this problem where my TextButton has a little border radius. Does anyone know how to remove the border radius from a TextButton?

My output

app output

My Code sorry for not including earlier My Code

Upvotes: 6

Views: 8213

Answers (3)

Tek Yin
Tek Yin

Reputation: 3050

Improving a bit from Danny Rufus' answer, you can use BorderRadius.zero to set the border radius to 0 for all corners

TextButton(
      style: TextButton.styleFrom(
          backgroundColor: Colors.yellow,
          shape: const RoundedRectangleBorder(
              borderRadius: BorderRadius.zero
          )
      ),
      child: const Text("Button"),
      onPressed: () {},
    )

or you could remove the borderRadius param since the default is BorderRadius.zero as seen on the doc

so you can directly use const RoundedRectangleBorder()

Upvotes: 2

syed amir ali shah
syed amir ali shah

Reputation: 1

add this line of code to your TextButton()

style: TextButton.styleFrom(
              shape: const BeveledRectangleBorder(borderRadius: BorderRadius.zero),
            ),

Upvotes: 0

Danny Rufus
Danny Rufus

Reputation: 517

You can add a shape parameter to your TextButton

TextButton(
      style: TextButton.styleFrom(
          backgroundColor: Colors.yellow,
          shape: const RoundedRectangleBorder(
              borderRadius: BorderRadius.all(Radius.zero))),
      child: const Text("BUtton"),
      onPressed: () {},
    )

Upvotes: 21

Related Questions