Use Google Material Style Fonts in Flutter iOS Android Example

Hello friends, Google Material Style fonts is one of the largest free font library available on internet via Google. All the fonts in Google fonts is freely available for developers. There are almost 977 type of different font family is with their sub variants available on Google fonts. Now the main part comes why we should use Google fonts in our flutter application. The reason is because using the Google Fonts Pub package, we don’t have to download each font one by one. All we have to do is import a single line in our pubspec.yaml file and we are ready to go with Google fonts without downloading them one by one. So in this tutorial we would learn about How to Use Google Material Style Fonts in Flutter iOS Android App Example.

Contents in this project Use Google Material Style Fonts in Flutter iOS Android Example:-

1. The first step is to download and install the Google Fonts Pub package in our flutter project. So open your pubspec.yaml file.

2. Now put below line under dependencies block. Currently their 2.1.0 version is available. But you can visit their Pub Package Page from here to see the latest version.

Complete Source Code of my pubspec.yaml file after adding above line :-

3. Now we have to execute flutter pub get command in our flutter project Root directory in order to download and install the Google Fonts package from internet.

4. Now our project is ready to go, Next step is to start coding for the application. So open your project’s main.dart file and import material.dart and google_fonts.dart package.

5. Creating void main runApp() method, here we would call our main MyApp class.

6. Creating our main MyApp class extends State Less Widget.

7. Creating Widget build area -> Material App -> Scaffold widget -> Center widget -> Column widget. Here we would make 7 Text widgets wrap inside Container widget. All the Text widgets has different type of Google fonts applied on them. You can find list of all available Google Fonts Here.

8. Complete source code for main.dart file:

Screenshot:-

Use Google Material Style Fonts in Flutter iOS Android Example

Leave a Reply

Your email address will not be published. Required fields are marked *