Autentikasi Google di Flutter dengan Firebase

Penjelasan Daftar firebase terlebih dahulu menggunakan akun gmail kamu. Setelah berhasil mendaftar, klik “Add Project” untuk membuat proyek baru. Masukkan nama proyek anda. Di bagian menu sebelah kiri, klik Build > Authentication. Lalu klik Get Started. Di bagian provider pilih Google lalu masukkan email yang kalian gunakan, kemudian klik Save. Sebelum kita melanjutkan, kita harus… Continue reading Autentikasi Google di Flutter dengan Firebase

Published
Categorized as Blog

Mengambil Data dari website dengan HTTP GET di Flutter

Permintaan GET digunakan untuk mengekstrak data dari backend untuk digunakan dalam aplikasi. Untuk melakukan permintaan GET dari website dengan Flutter, berikut ini langkahnya. Dapatkan paket dart HTTP Bukan terminal baru lalu ketikkan flutter pub add http. Tambahkan izin mengakses internet di AndroidManifest.xml Kita harus menambahkan izin mengakses internet di AndroidManifest.xml. File ini ada di dalam… Continue reading Mengambil Data dari website dengan HTTP GET di Flutter

Published
Categorized as flutter

Menggunakan Kustom Font di Flutter

Flutter memungkinkan pengembang mengintegrasikan Google Font ke dalam aplikasi Flutter. Selain Google Font, kita juga bisa menggunakan font kustom lain dengan cara menambahkan dan mendeklarasikannya di proyek kita. Sebelum menambahkan font, kita harus tahu jenis format font yang didukung Flutter: Pada tutorial kali ini kita akan mengunduh beberapa font family yaitu Abel, Caveat, Miltonian Tattoo… Continue reading Menggunakan Kustom Font di Flutter

Published
Categorized as flutter
WP_Post Object ( [ID] => 95 [post_author] => 1 [post_date] => 2024-06-10 00:57:23 [post_date_gmt] => 2024-06-10 00:57:23 [post_content] =>

Flutter memungkinkan pengembang mengintegrasikan Google Font ke dalam aplikasi Flutter. Selain Google Font, kita juga bisa menggunakan font kustom lain dengan cara menambahkan dan mendeklarasikannya di proyek kita.

Sebelum menambahkan font, kita harus tahu jenis format font yang didukung Flutter:

Pada tutorial kali ini kita akan mengunduh beberapa font family yaitu Abel, Caveat, Miltonian Tattoo dan Silk Screen dari situs berikut Google fonts.

Mengunduh File Font

Pada website pilih salah satu font yang diinginkan lalu pilih Get Font dan Download. Jika file dalam zip maka ekstraksi file zip tersebut untuk dapat mengambil file font.

Deklarasikan font di file pubspec.yaml

Berikut ini salah satu font yang akan kita gunakan yaitu Abel dan setelah diunduh pastikan anda dapat menemukan file Abel-Regular.ttf. Tambahkan sebuah folder bernama fonts di folder utama proyek anda dan kemudian tambahkan file .ttf ke dalam folder.

Lalu tambahkan di file pubspec.yaml dibawah flutter. Tambahkan asset fonts

Menggunakan font di widget tertentu dalam aplikasi

Berikut ini kita akan menggunakan font tersebut di dalam aplikasi. Disini kita menggunakan widget Text untuk menampilkan tulisan dengan salah satu font yang sudah kita download.

Text('This is custom font',
     style: TextStyle(
                  fontFamily: 'Abel',
                  fontSize: 30,
                  fontWeight: FontWeight.w400
             ),
     )

Berikut ini adalah kode lengkapnya

import 'package:flutter/material.dart';

void main() {
  runApp(const myApp());
}

class myApp extends StatelessWidget {
  const myApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: const Text('GOOGLE FONTS'),
          backgroundColor: Colors.lightBlue.shade200,
        ),
        body: const Column(
          children: [
            Center(
                child: Text(
              'This is custom font',
              style: TextStyle(
                  fontFamily: 'Abel',
                  fontSize: 30,
                  fontWeight: FontWeight.w400),
            )),
            Center(
                child: Text(
              'This is custom font',
              style: TextStyle(
                  fontFamily: 'Caveat',
                  fontSize: 30,
                  fontWeight: FontWeight.w400),
            )),
            Center(
                child: Text(
              'This is custom font',
              style: TextStyle(
                  fontFamily: 'MiltonianTattoo',
                  fontSize: 30,
                  fontWeight: FontWeight.w400),
            )),
            Center(
                child: Text(
              'This is custom font',
              style: TextStyle(
                  fontFamily: 'Silkscreen',
                  fontSize: 30,
                  fontWeight: FontWeight.w400),
            )),
          ],
        ),
      ),
    );
  }
}

See on next tutorial

[post_title] => Menggunakan Kustom Font di Flutter [post_excerpt] => [post_status] => publish [comment_status] => open [ping_status] => open [post_password] => [post_name] => menggunakan-kustom-font-dalam-flutter [to_ping] => [pinged] => [post_modified] => 2024-06-16 15:26:57 [post_modified_gmt] => 2024-06-16 08:26:57 [post_content_filtered] => [post_parent] => 0 [guid] => https://isengkoding.com/?p=95 [menu_order] => 0 [post_type] => post [post_mime_type] => [comment_count] => 0 [filter] => raw )