-
-
Save branflake2267/927f0d8c48b09da709b9b8aa3e08ab8b to your computer and use it in GitHub Desktop.
| import 'package:flutter/material.dart'; | |
| const String words1 = "Almost before we knew it, we had left the ground."; | |
| const String words2 = "A shining crescent far beneath the flying vessel."; | |
| const String words3 = "A red flair silhouetted the jagged edge of a wing."; | |
| const String words4 = "Mist enveloped the ship three hours out from port."; | |
| void main() { | |
| runApp(new MyApp()); | |
| } | |
| class MyApp extends StatelessWidget { | |
| @override | |
| Widget build(BuildContext context) { | |
| return new MaterialApp( | |
| title: 'Flutter Fonts', | |
| theme: new ThemeData( | |
| primarySwatch: Colors.blue, | |
| ), | |
| home: new FontsPage(), | |
| ); | |
| } | |
| } | |
| class FontsPage extends StatefulWidget { | |
| @override | |
| _FontsPageState createState() => new _FontsPageState(); | |
| } | |
| class _FontsPageState extends State<FontsPage> { | |
| @override | |
| Widget build(BuildContext context) { | |
| // Roboto - Included with Material Design | |
| var robotoContainer = new Container( | |
| child: new Column( | |
| children: <Widget>[ | |
| new Text( | |
| "Roboto", | |
| ), | |
| new Text( | |
| words1, | |
| textAlign: TextAlign.center, | |
| style: new TextStyle( | |
| fontFamily: "Roboto", | |
| fontSize: 20.0, | |
| ), | |
| ), | |
| ], | |
| ), | |
| margin: const EdgeInsets.all(10.0), | |
| padding: const EdgeInsets.all(10.0), | |
| decoration: new BoxDecoration( | |
| color: Colors.grey.shade200, | |
| borderRadius: new BorderRadius.all(new Radius.circular(5.0)), | |
| ), | |
| ); | |
| // Rock Salt - https://fonts.google.com/specimen/Rock+Salt | |
| var rockSaltContainer = new Container( | |
| child: new Column( | |
| children: <Widget>[ | |
| new Text( | |
| "Rock Salt", | |
| ), | |
| new Text( | |
| words2, | |
| textAlign: TextAlign.center, | |
| style: new TextStyle( | |
| fontFamily: "Rock Salt", | |
| fontSize: 17.0, | |
| ), | |
| ), | |
| ], | |
| ), | |
| margin: const EdgeInsets.all(10.0), | |
| padding: const EdgeInsets.all(10.0), | |
| decoration: new BoxDecoration( | |
| color: Colors.grey.shade200, | |
| borderRadius: new BorderRadius.all(new Radius.circular(5.0)), | |
| ), | |
| ); | |
| // VT323 - https://fonts.google.com/specimen/VT323 | |
| var v2t323Container = new Container( | |
| child: new Column( | |
| children: <Widget>[ | |
| new Text( | |
| "VT323", | |
| ), | |
| new Text( | |
| words3, | |
| textAlign: TextAlign.center, | |
| style: new TextStyle( | |
| fontFamily: "VT323", | |
| fontSize: 25.0, | |
| ), | |
| ), | |
| ], | |
| ), | |
| margin: const EdgeInsets.all(10.0), | |
| padding: const EdgeInsets.all(10.0), | |
| decoration: new BoxDecoration( | |
| color: Colors.grey.shade200, | |
| borderRadius: new BorderRadius.all(new Radius.circular(5.0)), | |
| ), | |
| ); | |
| // https://fonts.google.com/specimen/Ewert | |
| var ewertContainer = new Container( | |
| child: new Column( | |
| children: <Widget>[ | |
| new Text( | |
| "Ewert", | |
| ), | |
| new Text( | |
| words4, | |
| textAlign: TextAlign.center, | |
| style: new TextStyle( | |
| fontFamily: "Ewert", | |
| fontSize: 25.0, | |
| ), | |
| ), | |
| ], | |
| ), | |
| margin: const EdgeInsets.all(10.0), | |
| padding: const EdgeInsets.all(10.0), | |
| decoration: new BoxDecoration( | |
| color: Colors.grey.shade200, | |
| borderRadius: new BorderRadius.all(new Radius.circular(5.0)), | |
| ), | |
| ); | |
| // Material Icons font - included with Material Design | |
| String icons = ""; | |
| // https://material.io/icons/#ic_accessible | |
| // accessible:  or 0xE914 or E914 | |
| icons += "\u{E914}"; | |
| // https://material.io/icons/#ic_error | |
| // error:  or 0xE000 or E000 | |
| icons += "\u{E000}"; | |
| // https://material.io/icons/#ic_fingerprint | |
| // fingerprint:  or 0xE90D or E90D | |
| icons += "\u{E90D}"; | |
| // https://material.io/icons/#ic_camera | |
| // camera:  or 0xE3AF or E3AF | |
| icons += "\u{E3AF}"; | |
| // https://material.io/icons/#ic_palette | |
| // palette:  or 0xE40A or E40A | |
| icons += "\u{E40A}"; | |
| // https://material.io/icons/#ic_tag_faces | |
| // tag faces:  or 0xE420 or E420 | |
| icons += "\u{E420}"; | |
| // https://material.io/icons/#ic_directions_bike | |
| // directions bike:  or 0xE52F or E52F | |
| icons += "\u{E52F}"; | |
| // https://material.io/icons/#ic_airline_seat_recline_extra | |
| // airline seat recline extra:  or 0xE636 or E636 | |
| icons += "\u{E636}"; | |
| // https://material.io/icons/#ic_beach_access | |
| // beach access:  or 0xEB3E or EB3E | |
| icons += "\u{EB3E}"; | |
| // https://material.io/icons/#ic_public | |
| // public:  or 0xE80B or E80B | |
| icons += "\u{E80B}"; | |
| // https://material.io/icons/#ic_star | |
| // star:  or 0xE838 or E838 | |
| icons += "\u{E838}"; | |
| var materialIconsContainer = new Container( | |
| child: new Column( | |
| children: <Widget>[ | |
| new Text( | |
| "Material Icons", | |
| ), | |
| new Text( | |
| icons, | |
| textAlign: TextAlign.center, | |
| style: new TextStyle( | |
| inherit: false, | |
| fontFamily: "MaterialIcons", | |
| color: Colors.black, | |
| fontStyle: FontStyle.normal, | |
| fontSize: 25.0, | |
| ), | |
| ), | |
| ], | |
| ), | |
| margin: const EdgeInsets.all(10.0), | |
| padding: const EdgeInsets.all(10.0), | |
| decoration: new BoxDecoration( | |
| color: Colors.grey.shade200, | |
| borderRadius: new BorderRadius.all(new Radius.circular(5.0)), | |
| ), | |
| ); | |
| return new Scaffold( | |
| appBar: new AppBar( | |
| title: new Text("Fonts"), | |
| ), | |
| body: new ListView( | |
| children: <Widget>[ | |
| robotoContainer, | |
| rockSaltContainer, | |
| v2t323Container, | |
| ewertContainer, | |
| materialIconsContainer, | |
| ], | |
| ), | |
| ); | |
| } | |
| } |
| name: flontser | |
| description: A new Flutter project. | |
| dependencies: | |
| flutter: | |
| sdk: flutter | |
| # For information on the generic Dart part of this file, see the | |
| # following page: https://www.dartlang.org/tools/pub/pubspec | |
| # The following section is specific to Flutter. | |
| flutter: | |
| # The following line ensures that the Material Icons font is | |
| # included with your application, so that you can use the icons in | |
| # the Icons class. | |
| uses-material-design: true | |
| fonts: | |
| - family: Rock Salt | |
| fonts: | |
| # https://fonts.google.com/specimen/Rock+Salt | |
| - asset: fonts/RockSalt.ttf | |
| - family: VT323 | |
| fonts: | |
| # https://fonts.google.com/specimen/VT323 | |
| - asset: fonts/VT323-Regular.ttf | |
| - family: Ewert | |
| fonts: | |
| # https://fonts.google.com/specimen/Ewert | |
| - asset: fonts/Ewert-Regular.ttf | |
Nice one, really helped me out.
How do I use Bold Italic of Roboto family?
When i am write Flutter Run command it shows up this error :
Error: unable to locate asset entry in pubspec.yaml: "fonts/VT323-Regular.ttf".
Error building assets
Running Gradle task 'assembleDebug'...
Running Gradle task 'assembleDebug'... Done 6,2s
Gradle task assembleDebug failed with exit code 1
somebody know the solution?
This might have been probably solved by now, but do check if you have downloaded and put the font files in the right directory, either "yourappname/fonts" or "yourappname/assets"
Also same issue happened with me, and it was because I had not written the names of the files properly and of the ones I wanted to use.
Do refer this https://flutter.dev/docs/cookbook/design/fonts.
Lemme know if this doesn't solve the issue, I am happy to help anyone
How to use font AvenirNext on iOS ? This font is default supported by iOS.
This my tried not work:
fontFamily: 'AvenirNext',
fontFamily: 'AvenirNext-Regular',
How to use font AvenirNext on iOS ? This font is default supported by iOS.
This my tried not work:fontFamily: 'AvenirNext', fontFamily: 'AvenirNext-Regular',
fontFamily: 'Avenir Next'
Example:
