flutter_custom_fonts下载flutter_custom

flutter_custom_fonts

字体下载

1.0.0

下载

flutter_custom_fonts

如何在颤音中添加自定义字体

介绍：

在本文中，我们将学习如何在Flutter应用程序中添加自定义字体。在此示例中，我们将添加.ttf字体。 Google字体提供免费字体，因此我们将从那里下载字体。在此示例中，我们将添加Pacifico和Robotoconsens的字体。因此，在下面的示例中，让我们在Flutter应用中添加自定义字体。

输出：

步骤：

步骤1：在Flutter中创建新应用程序的第一和基本步骤。如果您是Flutter的初学者，则可以查看我的博客创建第一个应用程序。我创建了一个名为“ Flutter_custom_fonts”的应用程序。

步骤2：现在，从Google字体或其他站点下载字体，然后放置字体项目。在Project Root Directory下创建一个名为“字体”的文件夹，然后将字体放入该文件夹。在下面的屏幕截图中查看以了解更多理解。

步骤3：现在在pubspec.yaml文件中配置字体。 pubspec.yaml文件是用于插件，字体，图像等的配置文件。请查看下面的代码，您需要在PubSpec.yaml文件中配置。

 fonts:
   - family: Pacifico
     fonts:
       - asset: fonts/Pacifico-Regular.ttf
   - family: RobotoCondensed
     fonts:
       - asset: fonts/RobotoCondensed-Regular.ttf
       - asset: fonts/RobotoCondensed-Bold.ttf
         weight: 700

步骤4：现在在Main.dart文件中，我们将使用字体来样式文本。以下是该程序的编程实施。

 import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
   return MaterialApp(
     theme: ThemeData(
       primarySwatch: Colors.purple,
     ),
     home: MyHomePage(),
   );
 }
}
 
class MyHomePage extends StatefulWidget {
 @override
 _MyHomePageState createState() => _MyHomePageState();
}
 
class _MyHomePageState extends State<MyHomePage> {
 @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: AppBar(
       title: Text('Flutter Custom Fonts'),
     ),
     body: Center(
       child: Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: <Widget>[
           Text(
             'Pacifico Regular',
             style: TextStyle(
                 fontFamily: 'Pacifico', fontSize: 32.0, color: Colors.purple),
           ),
           Text(
             'Pacifico Bold',
             style: TextStyle(
                 fontFamily: 'Pacifico',
                 fontWeight: FontWeight.bold,
                 fontSize: 32.0,
                 color: Colors.purple),
           ),
           Text(
             'RobotoCondensed Regular',
             style: TextStyle(
                 fontFamily: 'RobotoCondensed', fontSize: 32.0, color: Colors.purple),
           ),
           Text(
             'RobotoCondensed Bold',
             style: TextStyle(
                 fontFamily: 'RobotoCondensed',
                 fontWeight: FontWeight.w700,
                 fontSize: 32.0,
                 color: Colors.purple),
           ),
         ],
       ),
     ),
   );
 }
}

Hurrey…。运行该应用并在模拟器/模拟器或设备上测试:)））））