How to overwrite textButtonTheme?

Issue

I have defined theme for TextButton.

theme: ThemeData(
            visualDensity: VisualDensity.adaptivePlatformDensity,
            brightness: Brightness.light,
            scaffoldBackgroundColor: const Color(0xfff9f9f9),
            primaryColor: const Color(0xffff5f62),
            textButtonTheme: TextButtonThemeData(
                style: ButtonStyle(
                    shape: MaterialStateProperty.all(RoundedRectangleBorder(
                        side: const BorderSide(
                          color: Colors.black54,
                        ),
                        borderRadius: BorderRadius.circular(20))),
                    backgroundColor: MaterialStateProperty.all(Colors.white))),
            fontFamily: 'Sarabun',
            textTheme: const TextTheme(
              button: TextStyle(color: Colors.black),
            ),
          ),

but I want to use TextButton with his default look. How to overwrite this?

Solution

You can wrap with Theme widget and provide ThemeData(), this will provide default look.

Theme(
  data: ThemeData(),
  child: TextButton(
    onPressed: () {},
    child: Text("wrapped with Theme"),
  ),
),

![enter image description here

If you like to customize initial theme, use

Theme(
  data: Theme.of(context).copyWith(//things you like to override.),
  child: TextButton(
    onPressed: () {},
    child: Text("wrapped with Theme"),
  ),
),

Answered By – Yeasin Sheikh

Answer Checked By – Pedro (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *