Dalam pengembangan aplikasi Flutter, tampilan teks yang menarik dan sesuai dengan desain adalah hal yang penting. Salah satu cara untuk mencapai itu adalah dengan menggunakan font yang keren dan menarik. google_fonts adalah package Flutter yang memungkinkan kita untuk menggunakan font dari Google Fonts dalam aplikasi kita dengan mudah. Dalam artikel ini, kita akan membahas tentang google_fonts, bagaimana menggunakannya, dan cara menampilkan teks yang dipilih menggunakan font dari Google Fonts.
Apa itu google_fonts Package?
google_fonts adalah package Flutter yang menyediakan cara mudah untuk menggunakan font dari Google Fonts dalam aplikasi kita. Package ini memungkinkan kita untuk menggunakan font yang telah disediakan oleh Google Fonts dengan hanya menyebutkan nama font tersebut. Dengan google_fonts, kita dapat memilih dari berbagai font yang tersedia di Google Fonts dan menggunakannya untuk menampilkan teks dalam aplikasi kita.
Cara Menggunakan google_fonts Package
Langkah pertama adalah menambahkan package google_fonts ke file pubspec.yaml Anda:
| dependencies: flutter: sdk: flutter google_fonts: ^4.0.0 |
Setelah itu, jalankan flutter pub get untuk mengunduh dan memasang package tersebut.
Contoh Penggunaan
Berikut adalah contoh sederhana tentang cara menggunakan google_fonts untuk menampilkan teks yang dipilih dengan font dari Google Fonts dalam aplikasi Flutter:
| import ‘package:google_fonts/google_fonts.dart’; class ArtikelPage22 extends StatefulWidget { const ArtikelPage22({super.key}); @override State<ArtikelPage22> createState() => _ArtikelPage22State(); } class _ArtikelPage22State extends State<ArtikelPage22> { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text(‘Google Fonts & selected text’), centerTitle: true), body: Center( child: SelectableText( “apasaja”, style: GoogleFonts.sail().copyWith(fontSize: 60), )), ); } } |
Begini adalah bentuk visualnya :
Dalam contoh di atas, kita menggunakan google_fonts untuk menampilkan daftar font yang tersedia dari Google Fonts dalam bentuk dropdown. Ketika pengguna memilih salah satu font, teks di bawah dropdown akan menggunakan font yang dipilih.
Kesimpulan
google_fonts adalah package Flutter yang memungkinkan kita untuk menggunakan font dari Google Fonts dalam aplikasi kita dengan mudah. Dalam artikel ini, kami telah membahas tentang google_fonts, cara menggunakannya, dan memberikan contoh sederhana tentang cara menampilkan teks yang dipilih dengan font dari Google Fonts. Cobalah menggunakan google_fonts dalam proyek Flutter Anda untuk menciptakan tampilan teks yang menarik dan sesuai dengan desain menggunakan beragam font dari Google Fonts.