Flutter: Menampilkan Icon

Lanjut yuk! Setelah kita bisa menampilkan teks kita coba menampilkan icon. 

Jadi si flutter ini, menyediakan gambar-gambar icon yang bisa kita gunakan. Temen-temen bisa nyontek gambar apa aja yang bisa kita tampilkan di url berikut:

https://api.flutter.dev/flutter/material/Icons-class.html


Lalu bagaimana cara menggunakan icon-icon tersebut? Mari kita coba pakai project yang kita udah buat sebelumnya aja yah.

Jadi yang akan kita ganti adalah bagian yang disorot seperti gambar di bawah ini.



Sebenarnya saat kita buat new icon seperti ini dia akan muncul list pilihannya untuk mempermudah kita.


Jadi Rani coba menampilkan icon access_alarms dengan warna ungu dan ukutan 50 dengan code berikut.

class PageHello extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Center(
          child: new Container(
        color: Colors.yellowAccent,
        width: 300.0,
        height: 150.0,
        child: new Center(
            child: new Icon(
          Icons.access_alarms,
          color: Colors.purple,
          size: 50,
        )),
      )),
    );
  }
}


Kemudian kita save dan hot reload. Hasilnya sebagai berikut:



Mudah bukan? Silahkan coba dengan icon-icon lainnya.





Post a Comment

0 Comments