Carousel

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

PreviousBarcode GeneratorNextList

Last updated