Posts

Showing posts from October, 2023

Font

Image
  Dalam pengembangan suatu aplikasi, seorang   User Interface   desainer dapat menggunakan font berbeda dengan   default   font yang ada. Sebagai pengembang aplikasi kita diharuskan menambahkan font pada aplikasi yang dirancang oleh desainer agar sesuai dengan desain User Interface. Pada pembelajaran kali ini kita akan belajar bagaimana menambahkan  font  pada Flutter. Sebelum kita memulai pembelajaran, kita akan mengunduh font yang ada di internet atau menggunakan  font  yang telah dimiliki. Pada contoh ini kita akan mengunduh salah satu  font  dari  Google Fonts  yaitu  Oswald . Menambahkan Font ke Project Setelah mengunduh font, langkah selanjutnya kita akan memasukkan  file-file  font tersebut ke folder  project . Pada contoh ini kita akan membuat folder fonts pada  project  kita, dan masukkan  file-file  font yang telah diunduh, seperti berikut:     Mendaftarkan Font d...

Image

Image
  Dalam pengembangan suatu aplikasi kita tidak akan lepas dari image atau gambar untuk membuat tampilan semakin menarik. Pada materi kali ini kita akan belajar bagaimana menampilkan gambar dari internet dan project asset. Image.network Untuk menampilkan gambar yang bersumber dari internet, kita akan menggunakan method Image.network. Cara penulisan method ini sebagai berikut: Image . network ( url ) Method ini cukup menambahkan URL gambar dari internet dan kita pun dapat menambahkan width dan height juga. Di bawah ini adalah contoh penggunaan  Image.network : class FirstScreen extends StatelessWidget { const FirstScreen ({ Key ? key }) : super ( key : key );      @override   Widget build ( BuildContext context ) {      return   Scaffold (       appBar : AppBar (         title : const Text ( 'First Screen' ),       ),       body : Center (     ...

Input Widget

Image
  Salah satu bentuk interaksi dengan pengguna adalah dengan menerima input. Ada beberapa input widget yang bisa digunakan supaya pengguna bisa berinteraksi dengan aplikasi. Perhatikan bahwa input pengguna ini berkaitan dengan state yang dapat sering berubah. Karena itu umumnya input widget akan ditempatkan di dalam   StatefulWidget . TextField TextField merupakan sebuah widget yang digunakan untuk menerima input berupa teks yang berasal dari  keyboard . Terdapat beberapa cara yang bisa Anda gunakan untuk mendapatkan nilai dari TextField. Salah satunya adalah melalui parameter  onChanged . String _name = '' ;   TextField (   onChanged : ( String value ) {     setState (() {       _name = value ;     });   }, ) Parameter  onChanged  berisi sebuah fungsi yang akan dipanggil setiap terjadi perubahan inputan pada TextField. Pada fungsi ini, kita dapat mengubah nilai variabel state dengan memanggil fungsi s...