Skip to content

Instantly share code, notes, and snippets.

@prof3ssorSt3v3
Created March 21, 2025 19:58
Show Gist options
  • Save prof3ssorSt3v3/ceb0eb29c835ec72707397b2e02b87bf to your computer and use it in GitHub Desktop.
Save prof3ssorSt3v3/ceb0eb29c835ec72707397b2e02b87bf to your computer and use it in GitHub Desktop.
Flutter example setting styles for all three button types in the top level ThemeData
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Button Styling Example',
theme: ThemeData(
primarySwatch: Colors.blue,
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
foregroundColor: Colors.green,
textStyle: TextStyle(fontWeight: FontWeight.bold),
),
),
outlinedButtonTheme: OutlinedButtonThemeData(
style: OutlinedButton.styleFrom(
foregroundColor: Colors.orange,
side: BorderSide(color: Colors.orange, width: 2),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
),
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.blue,
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
elevation: 5,
padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
),
),
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Button Styles')),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextButton(onPressed: () {}, child: Text('Text Button')),
SizedBox(height: 20),
OutlinedButton(onPressed: () {}, child: Text('Outlined Button')),
SizedBox(height: 20),
ElevatedButton(onPressed: () {}, child: Text('Elevated Button')),
],
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment