Flutter
What is ThemeData?
Define app-wide theme with ThemeData.
What is ThemeData?
ThemeData is the object that defines the overall look of a Flutter app. Colors, text styles, and widget defaults are gathered here. When you pass a ThemeData to the theme parameter of MaterialApp, all widgets in the app use this theme.
MaterialApp(
theme: ThemeData(primarySwatch: Colors.blue),
home: Scaffold(body: Center(child: Text('Merhaba'))),
)
This way instead of specifying colors and styles on each screen, you manage everything from one place.
Connecting theme to MaterialApp
To connect ThemeData to the app you use the theme parameter of MaterialApp. This parameter takes a ThemeData object. By providing basic fields like primarySwatch you set the look of all Material widgets.
MaterialApp(
theme: ThemeData(
primarySwatch: Colors.indigo,
),
home: AnaEkran(),
)
This configuration sets the default color of widgets like AppBar and FloatingActionButton.
Exercise MaterialApp with ThemeData
Define a StatelessWidget named Uygulama. Its build method should return a MaterialApp. Set its theme to ThemeData(primarySwatch: Colors.blue) and its home to Scaffold(body: Center(child: Text('Merhaba'))). Print 'hazir' in main.
Show example solution
import 'package:flutter/material.dart';
class Uygulama extends StatelessWidget {
const Uygulama({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(primarySwatch: Colors.blue),
home: const Scaffold(body: Center(child: Text('Merhaba'))),
);
}
}
void main() {
print('hazir');
}
Test yourself
-
What is the main purpose of ThemeData?
- To send a network request
- To play an animation
- To establish a database connection
- To define the app-wide look
Show answer
To define the app-wide look — ThemeData defines the app's colors, text, and widget defaults. Database, network requests, and animation are not ThemeData's concern.
-
ThemeData definition
theme: ____(primarySwatch: Colors.blue),
Show answer
theme: ThemeData(primarySwatch: Colors.blue),
-
ThemeData parts
- ThemeData
- Theme definition
- colorScheme
- Color palette
- textTheme
- Text styles
- primarySwatch
- Primary color shade
Next lesson: colorScheme
