Flutter custom font doesn't change

Issue

I tried to use a custom font for my AppBar, but it didn't change. I tried with two different fonts, RobotoMono and DancingScript, but nothing, the app did't change the font. I tried to unistall the app from the virtual phone too, too create another virtual device, but nothing. That's my main.dart :

import 'package:flutter/material.dart';
import 'background_image_task-9.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Blumax',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        fontFamily: 'Dancing', 
        primarySwatch: myColour
      ),
      home: BackgroundImage(
        ),
    );
  }
}

const MaterialColor myColour = const MaterialColor(
  0xFF0009FF,
  const <int, Color>{
    50: const Color(0xFF0009FF),
    100: const Color(0xFF0009FF),
    200: const Color(0xFF0009FF),
    300: const Color(0xFF0009FF),
    400: const Color(0xFF0009FF),
    500: const Color(0xFF0009FF),
    600: const Color(0xFF0009FF),
    700: const Color(0xFF0009FF),
    800: const Color(0xFF0009FF),
    900: const Color(0xFF0009FF),
  },
);

This is where i use the custom font, background_image_task-9.dart :

import 'package:flutter/material.dart';

class BackgroundImage extends StatelessWidget{
    @override
    Widget build(BuildContext context){
      return Scaffold(
        appBar: AppBar(
          elevation: 0,
          title: Text('Blumax', style: TextStyle(
            fontWeight: FontWeight.w500,
            fontFamily: 'RobotoMono',
            fontSize: 40
          ),),
          centerTitle: true,
        ),
        body: Container(
          decoration: BoxDecoration(
            image: DecorationImage(image: AssetImage("assets/blumax.jpg"), fit: BoxFit.cover),
          ),
        ),
    );
  }
}

And that's my pubspec.yaml :

name: iphone_prj
description: A new Flutter project.

version: 1.0.0+1

environment:
  sdk: ">=2.1.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter
  english_words: ^3.1.0

  cupertino_icons: ^0.1.2

dev_dependencies:
  flutter_test:
    sdk: flutter


flutter:
  assets:
    - assets/


  uses-material-design: true
fonts:
  - family: RobotoMono
    fonts:
      - asset: assets/fonts/RobotoMono-Bold.ttf
  - family: DancingScript
    fonts:
      - asset: assets/fonts/DancingScript-Bold.ttf
        weight: 300

Solution

Just add your font-family name properly in your main ThemeData as per pubspec.yaml file

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Blumax',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        fontFamily: 'DancingScript', 
        primarySwatch: myColour
      ),
      home: BackgroundImage(
        ),
    );
  }
}

The problem in your case is your font-family name is DancingScript and your providing it in the ThemeData as Dancing. So it will not effect to your app fonts.

Also, in your BackgroundImage class you have added RobotoMono font. But, the "fontWeight: FontWeight.w500" you have added is not matching as per your pubspec.yaml as you have added there RobotoMono-Bold fonts.

So, by matching your font names and font style will effect your app fonts as per your requirements.

Answered By - Jay Mungara