@capgo/capacitor-native-loader

Tampilkan pengaturan pengisi yang rapi di atas, di bawah, di sekitar, atau menggantikan WebView menggunakan tampilan native iOS dan Android.

Mulai GitHub

Rute Penerapan Asli

Tampilkan pemuat sebagai tampilan overlay UIKit dan Android daripada meminta WebView untuk menganimasi efek transparan yang mahal.

Penempatan Fleksibel

Tempatkan pemuat penuh layar, di tengah, dipasang ke tepi, gaya Chrome di atas, atau di sekitar WebView dengan margin aman yang menyadari area.

Pemuat Bawaan dan Asset

Gunakan pemuat Siri gaya bawaan, tepi Siri v2, Chrome top progress, orbit, ring, pulse, titik, baris, gelombang, halo, gambar, atau berdasarkan Lottie.

Dapat Dipanggil di Mana Saja

Trigger pengaturan muatan dari JavaScript, Swift, Kotlin, atau plugin native lainnya melalui native API publik.

When Untuk Menggunakannya

@capgo/capacitor-native-loader ini untuk keadaan muatan yang harus tetap halus, transparan, dan native saat WebView sibuk, memperbesar, berpindah, atau tertutup di balik permukaan native.

Pakai ketika Anda membutuhkan:

lapisan muatan transparan full-screen di atas konten web
bar kemajuan Chrome-style di atas yang dapat memperbesar WebView tanpa menutupi konten
loader di tepi atas, bawah, kiri, atau kanan aplikasi
loader di sekitar WebView yang telah dipanjangkan sementara konten native menguasai sebagian layar
loader fallback native yang bertahan selama rendering web berat, perubahan rute, atau pekerjaan startup
loader bersama yang diaktifkan oleh plugin native lain sebelum JavaScript siap
animasi muatan yang didukung oleh Lottie, gambar yang dibundel, atau aset jarak jauh

Demo gaya

Gaya	Penglihatan
Siri
Siri v2
Chrome Atas
Ring
Titik-Titik
Balk
Gelombang
Orbit
Pulse
Halo
Sekitar
Lottie
Gambar

Core API

show(options) menampilkan loader dan mengembalikannya id.
update(options) mengubah loader yang ada tanpa menghancurkan overlay.
setProgress(options) mengupdate progress loader yang dapat ditebak.
hide(options) menghapus satu loader.
hideAll(options) menghapus semua loader.
setWebViewLayout(options) mengatur ukuran atau memasukkan WebView/body agar loader native dapat berada di sampingnya.
resetWebViewLayout(options?) mengembalikan tata letak WebView/body asli.
getState() mengembalikan id loader yang saat ini dapat dilihat.
configure(options) menetapkan gaya default, posisi, warna, gerakan, dan perilaku.

Model Penempatan

placement mengatur di mana permukaan asli muncul:

fullscreen menutup seluruh aplikasi, dengan transparansi opsional.
center mengapungkan pengisi muatan kompak di atas WebView.
top, bottom, leftdan right menempel pengisi muatan ke tepi yang menyadari area aman.
chrome menggunakan gaya bar atas asli penuh lebar dan cocok dengan webView.mode: 'resize'.
around menggambar gerakan pengisi muatan di sekitar frame layar.
custom menggunakan frame eksplisit untuk alur kerja plugin asli atau tampilan split.

Gunakan interactionMode: 'passThrough' ketika pengguna dapat terus berinteraksi dengan WebView, block ketika pengisian harus mencegah sentuhan, atau loaderOnly ketika hanya permukaan pengisi muatan yang harus menerima sentuhan.

Teruslah dari @capgo/capacitor-native-loader

Jika Anda menggunakan @capgo/capacitor-native-loader untuk merencanakan perilaku media dan antarmuka native, hubungkannya dengan Getting Started untuk detail implementasi, @capgo/capacitor-native-navigation untuk tata letak chrome dan WebView native, @capgo/capacitor-transitions untuk gerakan rute web, dan Menggunakan @capgo/capacitor-native-loader untuk tutorial.