1
resposta

[Sugestão] Complementando o artigo sobre temas

Cria-se o arquivo chamado theme.dart e coloca-se o código abaixo:

import 'package:flutter/material.dart';

final tema = ThemeData(
  appBarTheme: const AppBarTheme(
    backgroundColor: Color.fromARGB(250, 26, 35, 126),
    titleTextStyle: TextStyle(
      fontSize: 20,
      fontWeight: FontWeight.bold,
      color: Colors.white,
    ), //TextStyle
  ),

  floatingActionButtonTheme :  const FloatingActionButtonThemeData(
    backgroundColor: Color.fromARGB(250, 255, 179, 0),
    foregroundColor: Colors.white,
    shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(2.0)),
    ),
    elevation: 10,
  ),

  textTheme :  const TextTheme(
    bodyText2: TextStyle(
        color: Colors.black,
        fontStyle: FontStyle.italic,
        fontSize: 20),
    headline4: TextStyle(
        color: Color.fromARGB(250, 26, 35, 126),
        fontWeight: FontWeight.bold,
        fontSize: 40),
  ), //AppBa
);

Na classe main.dart, dentro do Widget build, substitui-se o atributo theme: pelo theme.dart criado.

// This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo Com Tema Modificado.',
      theme: tema,
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

Depois é só rodar a aplicação e ver o resultado.

1 resposta

Perfeito Rafael! Obrigado pelo complemento!!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software