a same way to style all widgets in flutter
You can create your custom text or button.
For example, you can create custom Text as below:
import 'package:flutter/material.dart';
class CustomText extends StatelessWidget {
final String data;
final Color? textColor;
final double? fontSize;
final FontWeight? fontWeight;
final String? fontFamily;
CustomText(
this.data, {
this.textColor,
this.fontSize,
this.fontWeight,
this.fontFamily,
});
@override
Widget build(BuildContext context) {
return Text(
data,
style: TextStyle(
color: textColor ?? Colors.black,
fontSize: fontSize ?? 20,
fontWeight: fontWeight,
fontFamily: fontFamily ?? 'regular',
),
);
}
}
Then you can use CustomText("any value"). Same way you can crete your button class so you don't need to define styles every time.
Create a common widget class so that you can use it everywhere
Use Theme and Theme data in MaterialApp widget or as independent. More in official docs
MaterialApp(
title: appName,
theme: ThemeData(
// Define the default brightness and colors.
brightness: Brightness.dark,
primaryColor: Colors.lightBlue[800],
// Define the default font family.
fontFamily: 'Georgia',
// Define the default `TextTheme`. Use this to specify the default
// text styling for headlines, titles, bodies of text, and more.
textTheme: const TextTheme(
headline1: TextStyle(fontSize: 72.0, fontWeight: FontWeight.bold),
headline6: TextStyle(fontSize: 36.0, fontStyle: FontStyle.italic),
bodyText2: TextStyle(fontSize: 14.0, fontFamily: 'Hind'),
),
),
home: const MyHomePage(
title: appName,
),
);
MaterialApp set global theme and this theme is auto applied to all app. Also you can create static ThemeData if you do not want use Theme.of(context). But usually create widgets that create the right widgets with a suitable theme as it is easier.
class MyText extends StatelessWidget {
const MyText({Key? key, required this.text}) : super(key: key);
final String text;
@override
Widget build(BuildContext context) {
return Text(
text,
style: TextStyle(color: Colors.red),
);
}
}