Carousel
Last updated
Last updated
Cara menambahkan Carousel component
Berikut langkah-langkah untuk menambahkan carousel component
Buka Qore App Editor
Pada tab library, di section media pilih carousel component. Terdapat 2 cara untuk menambahkan component ke dalam emulator
Jika ingin menambahkan component langsung ke suatu page, kamu dapat double-click card tersebut
Jika ingin menambahkan component ke dalam salah satu kontainer di page tersebut, kamu dapat drag and drop ke dalam kontainer yang diinginkan
Jika berhasil maka carousel component akan muncul di emulator editor screen seperti berikut
Properties dari carousel component adalah
Data :
Source : tabel pada qore data yang digunakan sebagai sumber data
Design :
Style : mengatur tampilan carousel, apakah full atau menggunakan frame
Round corner : mengatur tampilan carousel, apakah sudut-sudutnya rounded
Autoplay : mengatur animasi carousel, apakah sliding gambar dimainkan secara otomatis
All Device :
All Device : jika gambar ingin ditampilkan di semua tipe device dengan sumber gambar yang sama, maka aktifkan toggle
Images : sumber gambar, berupa baris data pada tabel qore data
Phone :
Images : sumber gambar yang ditampilkan jika device adalah phone, berupa baris dalam tabel qore data
Ratio : ratio ukuran gambar yang ditampilkan jika device adalah phone, dapat berupa 1:1, 16:9, 4:3, ataupun 3:1
Fit image : mengatur tampilan image pada device phone, apakah fill ataupun fit
Tablet :
Images : sumber gambar yang ditampilkan jika device adalah tablet, berupa baris dalam tabel qore data
Ratio : ratio ukuran gambar yang ditampilkan jika device adalah tablet, dapat berupa 1:1, 16:9, 4:3, ataupun 3:1
Fit image : mengatur tampilan image pada device tablet, apakah fill ataupun fit
Dekstop :
Images : sumber gambar yang ditampilkan jika device adalah dekstop, berupa baris dalam tabel qore data
Ratio : ratio ukuran gambar yang ditampilkan jika device adalah dekstop, dapat berupa 1:1, 16:9, 4:3, ataupun 3:1
Fit image : mengatur tampilan image pada device dekstop, apakah fill ataupun fit
Berikut contoh carousel yang telah dimodifikasi