Cara Menampilkan Gambar Secara Lokal dan internet di Flutter

Di artikel flutter Kali ini, kita akan belajar Cara Menampilkan Gambar Secara Lokal di Flutter, cara menampilkan gambar secara lokal di aplikasi flutter Anda.

Menampilkan Gambar Dari Lokal

Pertama, buat proyek baru & ubah direktori kerja Anda

flutter create testproj

cd testproj

Tampilkan Gambar dari / folder aset

Dalam kasus, Jika Anda ingin menampilkan gambar apa pun secara lokal, (misalnya dari folder proyek), kita perlu menggunakan metode berikut

1. Buat folder baru bernama / assets di folder proyek Anda. (Jalur file akan testproj/assets/)
2. Salin gambar ke folder / assets Anda
3. Buka Anda pubspec.yamldan tambahkan baris ini

flutter:

assets:

- /assets/image.png

jadi pubspec.yamltampilan finalnya seperti ini (Versi SDK flutter Anda mungkin berbeda)

name: testproj

description: A new Flutter project.

version: 1.0.0+1

environment:

sdk: ">=2.1.0 <3.0.0"

dependencies:

flutter:

sdk: flutter

cupertino_icons: ^0.1.2

dev_dependencies:

flutter_test:

sdk: flutter

flutter:

uses-material-design: true

assets:

- /assets/image.png

Catatan: Spasi sangat penting

1. Sekarang menggunakan kode berikut, Anda dapat menampilkan gambar

Image.asset("/assets/image.png");

Menampilkan Gambar dari internet di Flutter

flutter-network-image
Di artikel ini, kita akan belajar, cara menampilkan gambar dari internet di aplikasi flutter Anda.

1. Pertama, buat proyek baru & ubah direktori kerja Anda
2. flutter create testproj
3. cd testproj

Untuk menampilkan Image jaringan, Anda perlu menggunakan widget yang disebut Image.network()Ini membutuhkan src dan properti lain sebagai opsional.

Image.network("URL", height: 200, width:200)

menampilkan gambar dari internet

Scaffold(

body: Container(

child: Center(

child: Image.network(

"https://i0.wp.com/www.neprianto.my.id/wp-content/uploads/2020/11/nepri.jpg",

height: 100,

width: 100,

),

),

),

)

Nah demikianlah Tutorial Cara Menampilkan Gambar Secara Lokal dan internet di Flutter, semoga bermanfaat. silahkan tinggalkan komentar jika ada yang ingin ditanyakan

admin

Seorang pengajar dan pembelajar yang mengurus lembaga pelatihan dan kursus komputer bernama LKP Naura

Baca Juga  Cara integrasi Flutter dengan API