MENAMPILKAN GAMBAR DARI INTERNET PADA FLUTTER

Untuk menampilkan gambar dari internet kita menggunakan constructor yaitu Image.network() dengan memasukkan URL gambar yang bertipe string. berikut contohnya:

Image.network(
'https://www.kopicoding.com/wp-content/uploads/2018/12/mmm.png',
)

Buat Project Baru

Pada folder project buka file main.dart yang berada di folder lib, lalu hapus semua code dan masukkan code berikut:

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var title = 'Kopi Coding';
    return MaterialApp(
      title: title,
      home: Scaffold(
        appBar: AppBar(
          title: Text(title),
        ),
        body: Image.network(
          'https://www.kopicoding.com/wp-content/uploads/2018/12/mmm.png',
        ),
      ),
    );
  }
}

Simpan source code dengan nama main.dart dan jangan lupa harus berektensi .dart

Berikut adalah penjelasan source code programnya :

  • Baris 1: Mengimport library material.dart
  • Baris 3: Membuat fungsi main yang memanggil class MyApp
  • Baris 5: membuat class MyApp yang ber-extends StatelessWidget
  • Baris 8: Mendeklarasikan variable title dengan value “Kopi Coding”
  • Baris 10-15: Inisialisasi variable untuk konfigurasi AppBar
  • Baris 16: inisialisasi body dengan memanggil constructor Image.network() dengan mengambil gambar dari URL https://www.kopicoding.com/wp-content/uploads/2018/12/mmm.png

Leave a Comment