Applying Themes and Styling

final ThemeData myTheme = ThemeData(
  primaryColor: Colors.blue,
  accentColor: Colors.orange,
  textTheme: TextTheme(
    headline1: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
    bodyText1: TextStyle(fontSize: 16),
  ),
  appBarTheme: AppBarTheme(
    backgroundColor: Colors.blue,
    foregroundColor: Colors.white,
  ),
);

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primaryColor: Colors.deepPurple,
        accentColor: Colors.amber,
        textTheme: TextTheme(
          headline1: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
          bodyText1: TextStyle(fontSize: 16),
        ),
      ),
      home: Scaffold(
        appBar: AppBar(title: Text("Themed App")),
        body: Center(child: Text("Hello, themed world!")),
      ),
    );
  }
}

MaterialApp(
  theme: ThemeData(
    primaryColor: Colors.blue,
    accentColor: Colors.red,
    primarySwatch: Colors.purple,
  ),
  home: MyHomePage(),
)

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      color: Theme.of(context).primaryColor,
      child: Text(
        'Hello World',
        style: Theme.of(context).textTheme.headlineMedium,
      ),
    );
  }
}

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primarySwatch: Colors.blue,
        brightness: Brightness.light,
        textTheme: TextTheme(
          headlineLarge: TextStyle(
            fontSize: 24,
            fontWeight: FontWeight.bold,
            color: Colors.blue,
          ),
          bodyMedium: TextStyle(
            fontSize: 16,
            color: Colors.black87,
          ),
        ),
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Custom Theme Example'),
      ),
      body: Center(
        child: Text(
          'This text uses the custom theme',
          style: Theme.of(context).textTheme.bodyMedium,
        ),
      ),
    );
  }
}

final colorScheme = ColorScheme(
  primary: Colors.deepPurple,
  onPrimary: Colors.white,
  secondary: Colors.teal,
  onSecondary: Colors.black,
  surface: Colors.white,
  onSurface: Colors.black,
  background: Colors.grey.shade100,
  onBackground: Colors.black,
  error: Colors.red,
  onError: Colors.white,
);

MaterialApp(
  theme: ThemeData(
    colorScheme: colorScheme,
  ),
  home: MyHomePage(),
);

TextTheme customTextTheme = TextTheme(
  headlineLarge: TextStyle(
    fontSize: 32,
    fontWeight: FontWeight.bold,
    fontFamily: 'Roboto',
    color: Colors.blue,
  ),
  bodyMedium: TextStyle(
    fontSize: 16,
    fontWeight: FontWeight.normal,
    fontFamily: 'Roboto',
    color: Colors.black87,
  ),
);

AppBarTheme appBarTheme = AppBarTheme(
  backgroundColor: Colors.blue,
  brightness: Brightness.dark,
  iconTheme: IconThemeData(color: Colors.white),
  textTheme: TextTheme(
    headline6: TextStyle(color: Colors.white, fontSize: 20),
  ),
  elevation: 4.0,
);

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        elevatedButtonTheme: ElevatedButtonThemeData(
          style: ButtonStyle(
            backgroundColor: MaterialStateProperty.all(Colors.blue),
            foregroundColor: MaterialStateProperty.all(Colors.white),
            shape: MaterialStateProperty.all(
              RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(8),
              ),
            ),
          ),
        ),
      ),
      home: Scaffold(
        appBar: AppBar(title: Text("Custom Button Theme")),
        body: Center(
          child: ElevatedButton(
            onPressed: () {},
            child: Text("Custom Button"),
          ),
        ),
      ),
    );
  }
}

ThemeData theme = ThemeData(
  inputDecorationTheme: InputDecorationTheme(
    hintStyle: TextStyle(color: Colors.grey),
    labelStyle: TextStyle(fontWeight: FontWeight.bold),
    border: OutlineInputBorder(
      borderRadius: BorderRadius.circular(8),
    ),
    focusedBorder: OutlineInputBorder(
      borderRadius: BorderRadius.circular(8),
      borderSide: BorderSide(color: Colors.blue, width: 2),
    ),
    enabledBorder: OutlineInputBorder(
      borderRadius: BorderRadius.circular(8),
      borderSide: BorderSide(color: Colors.grey),
    ),
  ),
);