Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.

Referensi komponen

Topik ini merinci setiap komponen App Studio, propertinya, dan menyertakan contoh konfigurasi.

Properti komponen umum

Bagian ini menguraikan properti umum dan fitur yang dibagikan di beberapa komponen di studio aplikasi. Detail implementasi spesifik dan kasus penggunaan untuk setiap jenis properti dapat bervariasi tergantung pada komponennya, tetapi konsep umum properti ini tetap konsisten di seluruh App Studio.

Nama

Nama default dihasilkan untuk setiap komponen; Namun, Anda dapat mengedit untuk mengubah nama unik untuk setiap komponen. Anda akan menggunakan nama ini untuk mereferensikan komponen dan datanya dari komponen atau ekspresi lain dalam halaman yang sama. Batasan: Jangan sertakan spasi dalam nama komponen; itu hanya dapat memiliki huruf, angka, garis bawah, dan tanda dolar. Contoh:userNameInput,ordersTable,metricCard1.

Nilai primer, nilai sekunder, dan nilai

Banyak komponen di studio aplikasi menyediakan bidang untuk menentukan nilai atau ekspresi yang menentukan konten atau data yang ditampilkan dalam komponen. Bidang-bidang ini sering diberi label sebagai Primary valueSecondary value,, atau sederhanaValue, tergantung pada jenis komponen dan tujuan.

Bid Primary value ang ini biasanya digunakan untuk menentukan nilai utama, titik data, atau konten yang harus ditampilkan secara mencolok di dalam komponen.

Bid Secondary value ang, bila tersedia, digunakan untuk menampilkan nilai atau informasi tambahan atau pendukung di samping nilai utama.

Bid Value ang ini memungkinkan Anda untuk menentukan nilai atau ekspresi yang harus ditampilkan dalam komponen.

Bidang-bidang ini mendukung input teks statis dan ekspresi dinamis. Dengan menggunakan ekspresi, Anda dapat mereferensikan data dari komponen lain, sumber data, atau variabel dalam aplikasi Anda, mengaktifkan tampilan konten dinamis dan berbasis data.

Sintaks untuk ekspresi

Sintaks untuk memasukkan ekspresi di bidang ini mengikuti pola yang konsisten:

{{expression}}

Dim expression ana ekspresi valid yang mengevaluasi nilai atau data yang diinginkan yang ingin Anda tampilkan.

Contoh: Teks statis

Contoh: Ekspresi

Dengan menggunakan bidang ekspresi ini, Anda dapat membuat konten dinamis dan berbasis data dalam aplikasi Anda, memungkinkan Anda menampilkan informasi yang disesuaikan dengan konteks pengguna atau status aplikasi Anda. Ini memungkinkan pengalaman pengguna yang lebih personal dan interaktif.

Label

Pro perti Label memungkinkan Anda untuk menentukan keterangan atau judul untuk komponen. Label ini biasanya ditampilkan di samping atau di atas komponen, membantu pengguna memahami tujuannya.

Anda dapat menggunakan teks statis dan ekspresi untuk menentukan label.

Contoh: Teks statis

Jika Anda memasukkan teks “Nama Depan” di bidang Label, komponen akan menampilkan “Nama Depan” sebagai labelnya.

Contoh: Ekspresi

Contoh: Toko ritel

Contoh berikut mempersonalisasi label untuk setiap pengguna, membuat antarmuka terasa lebih disesuaikan dengan individu:

{{currentUser.firstName}} {{currentUser.lastName}}'s Account

Contoh: Manajemen proyek SaaS

Contoh berikut menarik data dari proyek yang dipilih untuk memberikan label khusus konteks, membantu pengguna tetap berorientasi dalam aplikasi:

Project {{ui.projectsTable.selectedRow.id}} - {{ui.projectsTable.selectedRow.name}}

Contoh: Klinik kesehatan

Contoh berikut merujuk profil pengguna saat ini dan informasi dokter, memberikan pengalaman yang lebih personal bagi pasien.

Dr. {{ui.doctorProfileTable.data.firstName}}
       {{ui.doctorProfileTable.data.lastName}}

Placeholder

Properti Placeholder memungkinkan Anda untuk menentukan petunjuk atau teks panduan yang ditampilkan di dalam komponen saat kosong. Ini dapat membantu pengguna memahami format input yang diharapkan atau memberikan konteks tambahan.

Anda dapat menggunakan teks statis dan ekspresi untuk menentukan placeholder.

Contoh: Teks statis

Jika Anda memasukkan teks Enter your name di bidang Placeholder, komponen akan ditampilkan Enter your name sebagai teks placeholder.

Contoh: Ekspresi

Contoh: Jasa keuangan

Enter the amount you'd like to deposit into your {{ui.accountsTable.selectedRow.balance}} accountContoh-contoh ini menarik data dari akun yang dipilih untuk menampilkan petunjuk yang relevan, membuat antarmuka intuitif bagi pelanggan perbankan.

Contoh: E-commerce

Enter the coupon code for {{ui.cartTable.data.currency}} totalPlaceholder di sini diperbarui secara dinamis berdasarkan konten keranjang pengguna, memberikan pengalaman checkout yang mulus.

Contoh: Klinik kesehatan

Enter your {{ui.patientProfile.data.age}}-year-old patient's symptomsDengan menggunakan ekspresi yang mereferensikan usia pasien, aplikasi dapat membuat placeholder yang lebih personal dan bermanfaat.

Sumber

Pro perti Sumber memungkinkan Anda memilih sumber data untuk komponen. Setelah pemilihan, Anda dapat memilih dari jenis sumber data berikut:entity,expression, atauautomation.

Entitas

Memilih Enti tas sebagai sumber data memungkinkan Anda menghubungkan komponen ke entitas atau model data yang ada di aplikasi Anda. Ini berguna ketika Anda memiliki struktur data atau skema yang terdefinisi dengan baik yang ingin Anda manfaatkan di seluruh aplikasi Anda.

Kapan menggunakan sumber data entitas:

Memilih kueri pada entitas

Terkadang, Anda mungkin ingin menghubungkan komponen ke kueri tertentu yang mengambil data dari entitas, bukan seluruh entitas. Di sumber data entitas, Anda memiliki opsi untuk memilih dari kueri yang ada atau membuat yang baru.

Dengan memilih kueri, Anda dapat:

Misalnya, jika Anda memiliki Customers entitas dalam aplikasi Anda dengan bidang sepertiName,Email, danPhoneNumber. Anda dapat menghubungkan komponen tabel ke entitas ini dan memilih tindakan ActiveCustomers data yang telah ditentukan sebelumnya yang menyaring pelanggan berdasarkan status mereka. Ini memungkinkan Anda untuk menampilkan hanya pelanggan aktif dalam tabel, bukan seluruh database pelanggan.

Menambahkan parameter ke sumber data entitas

Saat menggunakan entitas sebagai sumber data, Anda juga dapat menambahkan parameter ke komponen. Parameter ini dapat digunakan untuk menyaring, mengurutkan, atau mengubah data yang ditampilkan dalam komponen.

Misalnya, jika Anda memiliki Products entitas dengan bidang sepertiName,Description,Price, danCategory. Anda dapat menambahkan parameter bernama category ke komponen tabel yang menampilkan daftar produk. Ketika pengguna memilih kategori dari dropdown, tabel akan diperbarui secara otomatis untuk hanya menampilkan produk yang termasuk dalam kategori yang dipilih, menggunakan {{params.category}} ekspresi dalam tindakan data.

Ekspresi

Pilih Ek spresi sebagai sumber data untuk memasukkan ekspresi kustom atau perhitungan untuk menghasilkan data untuk komponen secara dinamis. Ini berguna ketika Anda perlu melakukan transformasi, menggabungkan data dari berbagai sumber, atau menghasilkan data berdasarkan logika bisnis tertentu.

Kapan menggunakan sumber data Ekspresi:

Misalnya, jika Anda memiliki Metrics komponen yang perlu menampilkan total pendapatan untuk bulan berjalan, Anda dapat menggunakan ekspresi seperti berikut untuk menghitung dan menampilkan pendapatan bulanan:

{{ui.table1.orders.concat(ui.table1.orderDetails).filter(o => o.orderDate.getMonth() === new Date().getMonth()).reduce((a, b) => a + (b.quantity * b.unitPrice), 0)}}

Otomatisasi

Pilih Otomasi sebagai sumber data untuk menghubungkan komponen ke otomatisasi atau alur kerja yang ada di aplikasi Anda. Ini berguna ketika data atau fungsionalitas untuk komponen dihasilkan atau diperbarui sebagai bagian dari proses atau alur kerja tertentu.

Kapan menggunakan sumber data Otomasi:

Misalnya, jika Anda memiliki komponen stepflow yang memandu pengguna melalui proses lamaran pekerjaan. Komponen stepflow dapat dihubungkan ke otomatisasi yang menangani pengiriman lamaran pekerjaan, pemeriksaan latar belakang, dan pembuatan penawaran. Saat otomatisasi berlangsung melalui langkah-langkah ini, komponen stepflow dapat diperbarui secara dinamis untuk mencerminkan status aplikasi saat ini.

Dengan hati-hati memilih sumber data yang sesuai untuk setiap komponen, Anda dapat memastikan bahwa antarmuka pengguna aplikasi Anda didukung oleh data dan logika yang tepat, memberikan pengalaman yang mulus dan menarik bagi pengguna Anda.

Terlihat jika

Gunakan properti Visible if untuk menampilkan atau menyembunyikan komponen atau elemen berdasarkan kondisi atau nilai data tertentu. Ini berguna ketika Anda ingin mengontrol visibilitas bagian tertentu dari antarmuka pengguna aplikasi secara dinamis.

Pro perti Visible if menggunakan sintaks berikut:

{{expression ? true : false}}

atau

{{expression}}

Dim expression ana ekspresi boolean yang mengevaluasi salah satu atautrue. false

Jika ekspresi dievaluasi ketrue, komponen akan terlihat. Jika ekspresi dievaluasi kefalse, komponen akan disembunyikan. Ekspresi dapat mereferensikan nilai dari komponen lain, sumber data, atau variabel dalam aplikasi Anda.

Terlihat jika contoh ekspresi

Contoh: Menampilkan atau menyembunyikan bidang masukan kata sandi berdasarkan masukan email

Bayangkan Anda memiliki formulir login dengan bidang input email dan bidang input kata sandi. Anda ingin menampilkan bidang input kata sandi hanya jika pengguna telah memasukkan alamat email. Anda dapat menggunakan ekspresi Visible if berikut ini:

{{ui.emailInput.value !== ""}}

Ekspresi ini memeriksa apakah nilai emailInput komponen bukan string kosong. Jika pengguna telah memasukkan alamat email, ekspresi dievaluasi ketrue, dan bidang input kata sandi akan terlihat. Jika bidang email kosong, ekspresi dievaluasi kefalse, dan bidang input kata sandi akan disembunyikan.

Contoh: Menampilkan kolom formulir tambahan berdasarkan pilihan dropdown

Katakanlah Anda memiliki formulir di mana pengguna dapat memilih kategori dari daftar dropdown. Bergantung pada kategori yang dipilih, Anda ingin menampilkan atau menyembunyikan bidang formulir tambahan untuk mengumpulkan informasi yang lebih spesifik.

Misalnya, jika pengguna memilih Products kategori, Anda dapat menggunakan ekspresi berikut untuk menampilkan Product Details bidang tambahan:

{{ui.categoryDropdown.value === "Products"}}

Jika pengguna memilih Consulting kategori Services atau, Anda dapat menggunakan ekspresi ini untuk menampilkan kumpulan bidang tambahan yang berbeda:

{{ui.categoryDropdown.value === "Services" || ui.categoryDropdown.value === "Consulting"}}

Contoh: Lainnya

Untuk membuat komponen terlihat jika nilai textInput1 komponen bukan string kosong:

{{ui.textInput1.value === "" ? false : true}}

Untuk membuat komponen selalu terlihat:

{{true}}

Untuk membuat komponen terlihat jika nilai emailInput komponen bukan string kosong:

{{ui.emailInput.value !== ""}}

Dinonaktifkan jika

Fitur Disabled if memungkinkan Anda untuk mengaktifkan atau menonaktifkan komponen secara kondisional berdasarkan kondisi atau nilai data tertentu. Hal ini dicapai dengan menggunakan properti Dis abled if, yang menerima ekspresi boolean yang menentukan apakah komponen harus diaktifkan atau dinonaktifkan.

Pro perti Disabled if menggunakan sintaks berikut:

{{expression ? true : false}}

atau

{{expression}}

Dinonaktifkan jika contoh ekspresi

Contoh: Menonaktifkan tombol kirim berdasarkan validasi formulir

Jika Anda memiliki formulir dengan beberapa bidang masukan, dan Anda ingin menonaktifkan tombol kirim sampai semua bidang wajib diisi dengan benar, Anda dapat menggunakan ekspresi Dis abled If berikut ini:

{{ui.nameInput.value === "" || ui.emailInput.value === "" || ui.passwordInput.value === ""}}

Ekspresi ini memeriksa apakah salah satu bidang input yang diperlukan (nameInputemailInput,,passwordInput) kosong. Jika salah satu bidang kosong, ekspresi dievaluasi ketrue, dan tombol kirim akan dinonaktifkan. Setelah semua bidang yang diperlukan diisi, ekspresi dievaluasi kefalse, dan tombol kirim akan diaktifkan.

Dengan menggunakan jenis ekspresi kondisional ini di properti Visible if dan Dis abled ff, Anda dapat membuat antarmuka pengguna dinamis dan responsif yang beradaptasi dengan masukan pengguna, memberikan pengalaman yang lebih efisien dan relevan bagi pengguna aplikasi Anda.

Dim expression ana ekspresi boolean yang mengevaluasi benar atau salah.

Contoh:

{{ui.textInput1.value === "" ? true : false}}: The component will be Disabled if the textInput1 component's value is an empty string.
{{!ui.nameInput.isValid || !ui.emailInput.isValid || !ui.passwordInput.isValid}}: The component will be Disabled if any of the named input fields are invalid.

Tata letak kontainer

Properti tata letak menentukan bagaimana konten atau elemen dalam komponen diatur dan diposisikan. Beberapa opsi tata letak tersedia, masing-masing diwakili oleh ikon:

Orientasi

Penjajaran

Lebar

Pro perti Width menentukan ukuran horizontal komponen. Anda dapat memasukkan nilai persentase antara 0% dan 100%, yang mewakili lebar komponen relatif terhadap wadah induknya atau ruang yang tersedia.

Tinggi

Pro perti Tinggi menentukan ukuran vertikal komponen. Nilai “otomatis” menyesuaikan tinggi komponen secara otomatis berdasarkan isinya atau ruang yang tersedia.

Ruang antara

Pro perti Space between menentukan jarak atau celah antara konten atau elemen dalam komponen. Anda dapat memilih nilai dari 0px (tanpa spasi) hingga 64px, dengan kenaikan 4px (misalnya, 4px, 8px, 12px, dll.).

Bantalan

Pro perti P adding mengontrol ruang antara konten atau elemen dan tepi komponen. Anda dapat memilih nilai dari 0px (tanpa padding) hingga 64px, dengan kenaikan 4px (misalnya, 4px, 8px, 12px, dll.).

Latar Belakang

Latar Bel akang mengaktifkan atau menonaktifkan warna latar belakang atau gaya untuk komponen.

Properti tata letak ini memberikan fleksibilitas dalam mengatur dan memposisikan konten dalam komponen, serta mengontrol ukuran, spasi, dan tampilan visual komponen itu sendiri.

Komponen data

Bagian ini mencakup berbagai komponen data yang tersedia di studio aplikasi, termasuk komponen Tabel, Detail, Metrik, For mu lir, dan Repeater. Komponen ini digunakan untuk menampilkan, mengumpulkan, dan memanipulasi data dalam aplikasi Anda.

Tabel

Komponen Tabel menampilkan data dalam format tabular, dengan baris dan kolom. Ini digunakan untuk menyajikan data terstruktur, seperti daftar item atau catatan dari database, dengan cara yang terorganisir dan mudah dibaca.

Properti tabel

Komponen Tabel berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danActions. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Selain properti umum, komponen Tabel memiliki properti dan opsi konfigurasi tertentu, termasukColumns,Search and export, danExpressions.

Kolom

Di bagian ini, Anda dapat menentukan kolom yang akan ditampilkan dalam tabel. Setiap kolom dapat dikonfigurasi dengan properti berikut:

Cari dan ekspor

Komponen Tabel menyediakan alihan berikut untuk mengaktifkan atau menonaktifkan fungsi pencarian dan ekspor:

Baris per halaman

Anda dapat menentukan jumlah baris yang akan ditampilkan per halaman dalam tabel. Pengguna kemudian dapat menavigasi antar halaman untuk melihat dataset lengkap.

Pre-fetch batas

Tentukan jumlah maksimum rekaman untuk pra-pengambilan di setiap permintaan kueri. Maksimal adalah 3000.

Tindakan

Di bagian Tindakan, konfigurasikan properti berikut:

Ekspresi

Komponen Tabel menyediakan beberapa area untuk menggunakan ekspresi dan kemampuan tindakan tingkat baris yang memungkinkan Anda menyesuaikan dan meningkatkan fungsionalitas dan interaktivitas tabel. Mereka memungkinkan Anda untuk mereferensikan dan menampilkan data secara dinamis di dalam tabel. Dengan memanfaatkan bidang ekspresi ini, Anda dapat membuat kolom dinamis, meneruskan data ke tindakan tingkat baris, dan referensi data tabel dari komponen atau ekspresi lain dalam aplikasi Anda.

Contoh: Mereferensikan nilai baris

{{currentRow.columnName}}atau {{currentRow["Column Name"]}} Ekspresi ini memungkinkan Anda untuk mereferensikan nilai kolom tertentu untuk baris saat ini yang sedang dirender. Ganti columnName atau Column Name dengan nama sebenarnya dari kolom yang ingin Anda referensikan.

Contoh:

Contoh: Mereferensikan baris yang dipilih

{{ui.table1.selectedRow["columnName"]}}Ekspresi ini memungkinkan Anda untuk mereferensikan nilai kolom tertentu untuk baris yang saat ini dipilih dalam tabel dengan IDtable1. Ganti table1 dengan ID aktual komponen tabel Anda, dan columnName dengan nama kolom yang ingin Anda referensikan.

Contoh:

Contoh: Membuat kolom kustom

Anda dapat menambahkan kolom kustom ke tabel berdasarkan data yang dikembalikan dari tindakan, otomatisasi, atau ekspresi data yang mendasarinya. Anda dapat menggunakan nilai kolom dan JavaScript ekspresi yang ada untuk membuat kolom baru.

Contoh:

Contoh: Menyesuaikan nilai tampilan kolom:

Anda dapat menyesuaikan nilai tampilan bidang dalam kolom tabel dengan mengatur Value bidang pemetaan kolom. Ini memungkinkan Anda untuk menerapkan pemformatan kustom atau transformasi ke data yang ditampilkan.

Contoh:

Row-level tindakan tombol

{{currentRow.columnName}}atau {{currentRow["Column Name"]}} Anda dapat menggunakan ekspresi ini untuk meneruskan konteks baris yang direferensikan dalam tindakan tingkat baris, seperti menavigasi ke halaman lain dengan data baris yang dipilih atau memicu otomatisasi dengan data baris.

Contoh:

Dengan memanfaatkan bidang ekspresi dan kemampuan tindakan tingkat baris ini, Anda dapat membuat tabel yang sangat disesuaikan dan interaktif yang menampilkan dan memanipulasi data berdasarkan kebutuhan spesifik Anda. Selain itu, Anda dapat menghubungkan tindakan tingkat baris dengan komponen atau otomatisasi lain dalam aplikasi Anda, memungkinkan aliran dan fungsionalitas data yang mulus.

Detail

Komponen Detail dirancang untuk menampilkan informasi terperinci tentang catatan atau item tertentu. Ini menyediakan ruang khusus untuk menyajikan data komprehensif yang terkait dengan satu entitas atau baris, membuatnya ideal untuk menampilkan detail mendalam atau memfasilitasi entri data dan tugas pengeditan.

Properti detail

Komponen Detail berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danActions. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Komponen Detail juga memiliki properti dan opsi konfigurasi tertentu, termasukFields,Layout, danExpressions.

Tata Letak

Bagian Tata Letak memungkinkan Anda untuk menyesuaikan pengaturan dan presentasi bidang dalam komponen Detail. Anda dapat mengonfigurasi opsi seperti:

Ekspresi dan contoh

Komponen Detail menyediakan berbagai bidang ekspresi yang memungkinkan Anda untuk mereferensikan dan menampilkan data dalam komponen secara dinamis. Ekspresi ini memungkinkan Anda membuat komponen Detail yang disesuaikan dan interaktif yang terhubung secara mulus dengan data dan logika aplikasi Anda.

Contoh: Referensi data

{{ui.details.data[0]?.["colName"]}}: Ekspresi ini memungkinkan Anda untuk mereferensikan nilai kolom bernama “colName” untuk item pertama (indeks 0) dalam array data yang terhubung ke komponen Detail dengan ID “detail”. Ganti “ColName” dengan nama sebenarnya dari kolom yang ingin Anda referensikan. Misalnya, ekspresi berikut akan menampilkan nilai kolom “CustomerName” untuk item pertama dalam array data yang terhubung ke komponen “detail”:

{{ui.details.data[0]?.["customerName"]}}

Contoh: Rendering bersyarat

{{ui.table1.selectedRow["colName"]}}: Ekspresi ini mengembalikan true jika baris yang dipilih dalam tabel dengan ID table1 memiliki data untuk kolom bernamacolName. Ini dapat digunakan untuk menampilkan atau menyembunyikan komponen Detail secara kondisional berdasarkan apakah baris tabel yang dipilih kosong atau tidak.

Contoh:

Anda dapat menggunakan ekspresi ini di Visible if properti komponen Detail untuk menampilkan atau menyembunyikannya secara kondisional berdasarkan baris yang dipilih dalam tabel.

{{ui.table1.selectedRow["customerName"]}}

Jika ekspresi ini dievaluasi menjadi true (baris yang dipilih dalam table1 komponen memiliki nilai untuk customerName kolom), komponen Detail akan terlihat. Jika ekspresi dievaluasi menjadi false (yaitu, baris yang dipilih kosong atau tidak memiliki nilai untuk “CustomerName”), komponen Detail akan disembunyikan.

Contoh: Tampilan bersyarat

{{(ui.Component.value === "green" ? "🟢" : ui.Component.value === "yellow" ? "🟡" : ui.detail1.data?.[0]?.CustomerStatus)}}: Ekspresi ini secara kondisional menampilkan emoji berdasarkan nilai komponen atau bidang data.

Kerusakan:

Ekspresi ini dapat digunakan untuk menampilkan emoji atau nilai tertentu berdasarkan nilai komponen atau bidang data dalam komponen Detail.

Metrik-metrik

Komponen Metrik adalah elemen visual yang menampilkan metrik utama atau titik data dalam format seperti kartu. Ini dirancang untuk memberikan cara ringkas dan menarik secara visual untuk menyajikan informasi penting atau indikator kinerja.

Properti metrik

Komponen Metrik berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danActions. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Tren

Fitur tren Metrik memungkinkan Anda untuk menampilkan indikator visual kinerja atau perubahan dari waktu ke waktu untuk metrik yang ditampilkan.

Nilai tren

Bidang ini memungkinkan Anda untuk menentukan nilai atau ekspresi yang harus digunakan untuk menentukan arah dan besarnya tren. Biasanya, ini akan menjadi nilai yang mewakili perubahan atau kinerja selama periode waktu tertentu.

Contoh:

{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue}}

Ekspresi ini mengambil nilai pendapatan bulan-ke-bulan dari item pertama dalam data yang terhubung ke Metrik “SalesMetrics”.

Tren positif

Bidang ini memungkinkan Anda memasukkan ekspresi yang mendefinisikan kondisi untuk tren positif. Ekspresi harus dievaluasi menjadi benar atau salah.

Contoh:

{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue > 0}}

Ekspresi ini memeriksa apakah nilai pendapatan bulan-ke-bulan lebih besar dari 0, menunjukkan tren positif.

Tren negatif

Bidang ini memungkinkan Anda memasukkan ekspresi yang mendefinisikan kondisi untuk tren negatif. Ekspresi harus dievaluasi menjadi benar atau salah.

Contoh:

{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue < 0}}

Ekspresi ini memeriksa apakah nilai pendapatan bulan-ke-bulan kurang dari 0, menunjukkan tren negatif.

Bilah warna

Sakelar ini memungkinkan Anda untuk mengaktifkan atau menonaktifkan tampilan bilah berwarna untuk menunjukkan status tren secara visual.

Contoh Bar Warna:

Contoh: Tren metrik penjualan

Contoh: tren metrik inventaris

Contoh: Tren kepuasan pelanggan

Dengan mengonfigurasi properti terkait tren ini, Anda dapat membuat komponen Metrik yang menyediakan representasi visual dari kinerja atau perubahan dari waktu ke waktu untuk metrik yang ditampilkan.

Dengan memanfaatkan ekspresi ini, Anda dapat membuat komponen metrik yang sangat disesuaikan dan interaktif yang mereferensikan dan menampilkan data secara dinamis, memungkinkan Anda menampilkan metrik utama, indikator kinerja, dan visualisasi berbasis data dalam aplikasi Anda.

Contoh ekspresi metrik

Di panel properti, Anda dapat memasukkan ekspresi untuk menampilkan judul, nilai primer, nilai sekunder, dan keterangan nilai untuk menampilkan nilai secara dinamis.

Contoh: Mereferensikan nilai primer

{{ui.metric1.primaryValue}}: Ekspresi ini memungkinkan Anda untuk mereferensikan nilai utama komponen Metrik dengan ID metric1 dari komponen atau ekspresi lain dalam halaman yang sama.

Contoh: {{ui.salesMetrics.primaryValue}} akan menampilkan nilai utama dari komponen salesMetrics Metrik.

Contoh: Mereferensikan nilai sekunder

{{ui.metric1.secondaryValue}}: Ekspresi ini memungkinkan Anda untuk mereferensikan nilai sekunder komponen Metrik dengan ID metric1 dari komponen atau ekspresi lain dalam halaman yang sama.

Contoh: {{ui.revenueMetrics.secondaryValue}} akan menampilkan nilai sekunder dari komponen revenueMetrics Metrik.

Contoh: Referensi data

{{ui.metric1.data}}: Ekspresi ini memungkinkan Anda untuk mereferensikan data komponen Metrik dengan ID metric1 dari komponen atau ekspresi lain dalam halaman yang sama.

Contoh: {{ui.kpiMetrics.data}} akan mereferensikan data yang terhubung ke komponen kpiMetrics Metrik.

Contoh: Menampilkan nilai data tertentu:

{{ui.metric1.data?.[0]?.id}}: Ekspresi ini adalah contoh cara menampilkan informasi tertentu dari data yang terhubung ke komponen Metrik dengan IDmetric1. Ini berguna ketika Anda ingin menampilkan properti tertentu dari item pertama dalam data.

Kerusakan:

Contoh: {{ui.orderMetrics.data?.[0]?.orderId}} akan menampilkan orderId nilai item pertama dalam data yang terhubung ke komponen orderMetrics Metrik.

Contoh: Menampilkan panjang data

{{ui.metric1.data?.length}}: Ekspresi ini menunjukkan cara menampilkan panjang (jumlah item) dalam data yang terhubung ke komponen Metrik dengan IDmetric1. Ini berguna ketika Anda ingin menampilkan jumlah item dalam data.

Kerusakan:

Contoh: {{ui.productMetrics.data?.length}} akan menampilkan jumlah item dalam data yang terhubung ke komponen productMetrics Metrik.

Pengulang

Komponen Repeater adalah komponen dinamis yang memungkinkan Anda untuk menghasilkan dan menampilkan kumpulan elemen berdasarkan sumber data yang disediakan. Ini dirancang untuk memfasilitasi pembuatan daftar, grid, atau pola berulang dalam antarmuka pengguna aplikasi Anda. Beberapa contoh kasus penggunaan meliputi:

Komponen Repeater membedakan dirinya dari komponen Tabel dengan konten yang kaya. Komponen Tabel memiliki format baris dan kolom yang ketat. Repeater dapat menampilkan data Anda dengan lebih fleksibel.

Properti repeater

Komponen Repeater berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danActions. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Selain properti umum, komponen Repeater memiliki properti tambahan berikut dan opsi konfigurasi.

Templat item

Template I tem adalah wadah di mana Anda dapat menentukan struktur dan komponen yang akan diulang untuk setiap item dalam sumber data. Anda dapat menyeret dan melepaskan komponen lain ke dalam wadah ini, seperti Tek s, Gambar, Tombol, atau komponen lain yang Anda butuhkan untuk mewakili setiap item.

Di dalam template Item, Anda dapat mereferensikan properti atau nilai dari item saat ini menggunakan ekspresi dalam format{{currentItem.propertyName}}.

Misalnya, jika sumber data Anda berisi itemName properti, Anda dapat menggunakannya {{currentItem.itemName}} untuk menampilkan nama item dari item saat ini.

Tata Letak

Bagian Tata Letak memungkinkan Anda untuk mengkonfigurasi pengaturan elemen berulang dalam Komponen Repeater.

Orientasi

Baris per halaman

Tentukan jumlah baris yang akan ditampilkan per halaman dalam tata letak daftar. Pagination disediakan untuk item yang meluap dengan jumlah baris yang ditentukan.

Kolom dan Baris per Halaman (Grid)

Ekspresi dan contoh

Komponen Repeater menyediakan berbagai bidang ekspresi yang memungkinkan Anda untuk mereferensikan dan menampilkan data dalam komponen secara dinamis. Ekspresi ini memungkinkan Anda membuat komponen Repeater yang disesuaikan dan interaktif yang terhubung secara mulus dengan data dan logika aplikasi Anda.

Contoh: Referensi item

Contoh: Merender daftar produk

Contoh: Menghasilkan kotak avatar pengguna

Dengan menggunakan Repeater komponen, Anda dapat membuat antarmuka pengguna yang dinamis dan berbasis data, merampingkan proses rendering koleksi elemen dan mengurangi kebutuhan untuk pengulangan manual atau pengkodean keras.

Formulir

Komponen Formulir dirancang untuk menangkap input pengguna dan memfasilitasi tugas entri data dalam aplikasi Anda. Ini menyediakan tata letak terstruktur untuk menampilkan bidang input, dropdown, kotak centang, dan kontrol formulir lainnya, memungkinkan pengguna untuk memasukkan atau memodifikasi data dengan mulus. Anda dapat membuat sarang komponen lain di dalam komponen formulir, seperti tabel.

Properti formulir

Komponen Form berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danActions. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Hasilkan Formulir

Fitur Generate Form memudahkan pembuatan bidang formulir dengan cepat dengan mengisinya secara otomatis berdasarkan sumber data yang dipilih. Ini dapat menghemat waktu dan tenaga saat membangun formulir yang perlu menampilkan sejumlah besar bidang.

Fitur Generate Form sangat berguna ketika Anda memiliki model data atau kumpulan entitas yang terdefinisi dengan baik dalam aplikasi Anda yang perlu Anda tangkap masukan pengguna. Dengan membuat kolom formulir secara otomatis, Anda dapat menghemat waktu dan memastikan konsistensi di seluruh formulir aplikasi Anda.

Setelah menggunakan fitur Hasilkan Formulir, Anda dapat menyesuaikan tata letak, tindakan, dan ekspresi komponen For mulir agar sesuai dengan kebutuhan spesifik Anda.

Ekspresi dan contoh

Seperti komponen lainnya, Anda dapat menggunakan ekspresi untuk mereferensikan dan menampilkan data dalam komponen Form. Contoh:

Dengan mengonfigurasi properti ini dan memanfaatkan ekspresi, Anda dapat membuat komponen Formulir yang disesuaikan dan interaktif yang terintegrasi secara mulus dengan sumber data dan logika aplikasi Anda. Komponen ini dapat digunakan untuk menangkap input pengguna, menampilkan data yang telah diisi sebelumnya, dan memicu tindakan berdasarkan pengiriman formulir atau interaksi pengguna.

Arus langkah

Komponen Stepflow dirancang untuk memandu pengguna melalui proses multi-langkah atau alur kerja dalam aplikasi Anda. Ini menyediakan antarmuka terstruktur dan intuitif untuk menyajikan urutan langkah, masing-masing dengan set input, validasi, dan tindakannya sendiri.

Komponen Stepflow berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danActions. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Komponen Stepflow memiliki properti tambahan dan opsi konfigurasi, sepertiStep Navigation,Validation, danExpressions.

Komponen AI

Generasi AI

Komponen Gen AI adalah wadah pengelompokan yang digunakan untuk mengelompokkan komponen dan logika yang menyertainya untuk dengan mudah mengeditnya dengan AI menggunakan obrolan di dalam studio aplikasi. Saat Anda menggunakan obrolan untuk membuat komponen, mereka akan dikelompokkan ke dalam wadah Gen AI. Untuk informasi tentang mengedit atau menggunakan komponen ini, lihatMembangun atau mengedit aplikasi.

Kompon & en nomor teks

Masukan teks

Komponen input teks memungkinkan pengguna untuk memasukkan dan mengirimkan data teks dalam aplikasi Anda. Ini menyediakan cara sederhana dan intuitif untuk menangkap input pengguna, seperti nama, alamat, atau informasi tekstual lainnya.

Teks

Komponen Teks digunakan untuk menampilkan informasi tekstual dalam aplikasi Anda. Hal ini dapat digunakan untuk menampilkan teks statis, nilai dinamis, atau konten yang dihasilkan dari ekspresi.

Area teks

Komponen area Teks dirancang untuk menangkap input teks multi-baris dari pengguna. Ini menyediakan area bidang input yang lebih besar bagi pengguna untuk memasukkan entri teks yang lebih panjang, seperti deskripsi, catatan, atau komentar.

Email

Komponen Email adalah bidang input khusus yang dirancang untuk menangkap alamat email dari pengguna. Ini dapat menerapkan aturan validasi tertentu untuk memastikan nilai yang dimasukkan mematuhi format email yang benar.

Kata Sandi

Komponen Password adalah bidang input yang dirancang khusus bagi pengguna untuk memasukkan informasi sensitif, seperti kata sandi atau kode PIN. Ini menutupi karakter yang dimasukkan untuk menjaga privasi dan keamanan.

Cari

Komponen Pencarian memberi pengguna bidang input khusus untuk melakukan kueri penelusuran atau memasukkan istilah pencarian dalam data yang diisi dalam aplikasi.

Telepon

Komponen Telepon adalah bidang input yang dirancang untuk menangkap nomor telepon atau informasi kontak lainnya dari pengguna. Ini dapat mencakup aturan validasi khusus dan opsi pemformatan untuk memastikan nilai yang dimasukkan mematuhi format nomor telepon yang benar.

Bilangan

Komponen Angka adalah bidang input yang dirancang khusus bagi pengguna untuk memasukkan nilai numerik. Ini dapat menerapkan aturan validasi untuk memastikan nilai yang dimasukkan adalah nomor yang valid dalam rentang atau format tertentu.

Mata Uang

Komponen Mata Uang adalah bidang input khusus untuk menangkap nilai atau jumlah moneter. Ini dapat mencakup opsi pemformatan untuk menampilkan simbol mata uang, pemisah desimal, dan menegakkan aturan validasi khusus untuk input mata uang.

Pasangan detail

Komponen Detail pair digunakan untuk menampilkan pasangan kunci-nilai atau pasangan informasi terkait dalam format yang terstruktur dan dapat dibaca. Hal ini biasanya digunakan untuk menyajikan detail atau metadata yang terkait dengan item atau entitas tertentu.

Komponen seleksi

Beralih

Komponen Switch adalah kontrol antarmuka pengguna yang memungkinkan pengguna untuk beralih di antara dua status atau opsi, seperti on/off, true/false, atau enabled/disabled. Ini memberikan representasi visual dari keadaan saat ini dan memungkinkan pengguna untuk mengubahnya dengan satu klik atau ketukan.

Beralih grup

Komponen grup Switch adalah kumpulan kontrol sakelar individual yang memungkinkan pengguna memilih satu atau lebih opsi dari kumpulan yang telah ditentukan sebelumnya. Ini memberikan representasi visual dari opsi yang dipilih dan tidak dipilih, sehingga memudahkan pengguna untuk memahami dan berinteraksi dengan pilihan yang tersedia.

Beralih bidang ekspresi grup

Grup kotak centang

Komponen grup kotak centang menyajikan kepada pengguna sekelompok kotak centang, memungkinkan mereka untuk memilih beberapa opsi secara bersamaan. Ini berguna ketika Anda ingin memberi pengguna kemampuan untuk memilih satu atau lebih item dari daftar opsi.

Bidang ekspresi grup kotak centang

Grup radio

Komponen grup Radio adalah seperangkat tombol radio yang memungkinkan pengguna untuk memilih satu opsi dari beberapa pilihan yang saling eksklusif. Ini memastikan bahwa hanya satu opsi yang dapat dipilih pada satu waktu, memberikan cara yang jelas dan tidak ambigu bagi pengguna untuk membuat pilihan.

Bidang ekspresi grup radio

Bidang berikut dapat digunakan dalam ekspresi.

Pilihan tunggal

Komponen pilih tunggal menyajikan kepada pengguna daftar opsi, dari mana mereka dapat memilih satu item. Ini biasanya digunakan dalam skenario di mana pengguna perlu membuat pilihan dari serangkaian opsi yang telah ditentukan, seperti memilih kategori, lokasi, atau preferensi.

Bidang ekspresi pilih tunggal

Multi pilih

Komponen Multi select mirip dengan komponen pilih tunggal tetapi memungkinkan pengguna untuk memilih beberapa opsi secara bersamaan dari daftar pilihan. Ini berguna ketika pengguna perlu membuat beberapa pilihan dari kumpulan opsi yang telah ditentukan sebelumnya, seperti memilih beberapa tag, minat, atau preferensi.

Bidang ekspresi multi pilih

Komponen & navigasi tombol

Studio aplikasi menyediakan berbagai tombol dan komponen navigasi untuk memungkinkan pengguna memicu tindakan dan menavigasi dalam aplikasi Anda.

Komponen tombol

Komponen tombol yang tersedia adalah:

Komponen tombol ini berbagi properti umum berikut:

Daftar isi

Tipe

Size

Ukuran tombol. Nilai yang mungkin adalah Small, Medium, dan Large.

Ikon

Anda dapat memilih dari berbagai ikon untuk ditampilkan pada tombol, termasuk:

Pemicu

Ketika tombol diklik, Anda dapat mengonfigurasi satu atau lebih tindakan untuk dipicu. Jenis tindakan yang tersedia adalah:

JavaScript properti tombol aksi

Pilih jenis JavaScript tindakan untuk menjalankan JavaScript kode khusus saat tombol diklik.

Kode sumber

Di Source code bidang, Anda dapat memasukkan JavaScript ekspresi atau fungsi Anda. Contoh:

return "Hello World";

Ini hanya akan mengembalikan string Hello World ketika tombol diklik.

Kondisi: Jalankan jika

Anda juga dapat memberikan ekspresi boolean yang menentukan apakah JavaScript tindakan harus dieksekusi atau tidak. Ini menggunakan sintaks berikut:

{{ui.textinput1.value !== ""}}

Dalam contoh ini, JavaScript tindakan hanya akan berjalan jika nilai textinput1 komponen bukan string kosong.

Dengan menggunakan opsi pemicu lanjutan ini, Anda dapat membuat perilaku tombol yang sangat disesuaikan yang terintegrasi langsung dengan logika dan data aplikasi Anda. Ini memungkinkan Anda untuk memperluas fungsionalitas tombol bawaan dan menyesuaikan pengalaman pengguna dengan kebutuhan spesifik Anda.

Hyperlink

Komponen Hyperlink menyediakan tautan yang dapat diklik untuk menavigasi ke URL eksternal atau rute aplikasi internal.

Properti hyperlink

Daftar isi

URL

URL tujuan untuk hyperlink, yang dapat berupa situs web eksternal atau rute aplikasi internal.

Pemicu

Saat hyperlink diklik, Anda dapat mengonfigurasi satu atau lebih tindakan untuk dipicu. Jenis tindakan yang tersedia sama dengan yang untuk komponen tombol.

Kompon & en tanggal waktu

Date

Komponen Tanggal memungkinkan pengguna untuk memilih dan memasukkan tanggal.

Komponen Tanggal berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danValidation. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Selain properti umum, komponen Tanggal memiliki properti spesifik berikut:

Properti tanggal

Format

Nilai

Tanggal min

Tanggal maks

Jenis kalender

Tanggal dinonaktifkan

Perilaku

Validasi

Bagian Validasi memungkinkan Anda untuk menentukan aturan dan batasan tambahan untuk input tanggal. Dengan mengonfigurasi aturan validasi ini, Anda dapat memastikan bahwa nilai tanggal yang dimasukkan oleh pengguna memenuhi persyaratan spesifik aplikasi Anda. Anda dapat menambahkan jenis validasi berikut:

Dengan mengonfigurasi aturan validasi ini, Anda dapat memastikan bahwa nilai tanggal yang dimasukkan oleh pengguna memenuhi persyaratan spesifik aplikasi Anda.

Ekspresi dan contoh

Komponen Tanggal menyediakan bidang ekspresi berikut:

Waktu

Komponen Waktu memungkinkan pengguna untuk memilih dan memasukkan nilai waktu. Dengan mengonfigurasi berbagai properti komponen Waktu, Anda dapat membuat bidang input waktu yang memenuhi persyaratan spesifik aplikasi Anda, seperti membatasi rentang waktu yang dapat dipilih, menonaktifkan waktu tertentu, dan mengontrol visibilitas dan interaktivitas komponen.

Sifat waktu

Komponen Waktu berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danValidation. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Selain properti umum, komponen Waktu memiliki properti spesifik berikut:

Interval waktu

Nilai

Placeholder

Waktu min

Waktu maksimal

Waktu dinonaktifkan

Konfigurasi waktu dinonaktifkan

Anda dapat menggunakan bagian Waktu Dinonaktifkan untuk menentukan nilai waktu mana yang seharusnya tidak tersedia untuk pemilihan.

Sumber

Contoh ekspresi:

{{currentRow.column === "Lunch Break"}}

Ekspresi ini akan menonaktifkan kapan saja kolom “Istirahat Makan Siang” benar untuk baris saat ini.

Dengan mengonfigurasi aturan validasi ini dan ekspresi waktu yang dinonaktifkan, Anda dapat memastikan bahwa nilai waktu yang dimasukkan oleh pengguna memenuhi persyaratan spesifik aplikasi Anda.

Perilaku

Validasi

Contoh:

{{ui.timeInput.value === "09:00 AM" || ui.timeInput.value === "09:30 AM"}}

Ekspresi ini memeriksa apakah waktu yang dimasukkan adalah 9:00 pagi atau 9:30. Jika kondisinya benar, validasi akan gagal.

Anda juga dapat memberikan pesan validasi khusus untuk ditampilkan saat validasi tidak terpenuhi:

Validation not met. The time must be 9:00 AM or 9:30 AM.

Ekspresi dan contoh

Komponen Waktu menyediakan bidang ekspresi berikut:

Contoh: Nilai waktu

Contoh: Perbandingan waktu

Rentang tanggal

Komponen Rentang tanggal memungkinkan pengguna untuk memilih dan memasukkan rentang tanggal. Dengan mengonfigurasi berbagai properti komponen Rentang Tanggal, Anda dapat membuat bidang masukan rentang tanggal yang memenuhi persyaratan spesifik aplikasi Anda, seperti membatasi rentang tanggal yang dapat dipilih, menonaktifkan tanggal tertentu, dan mengontrol visibilitas dan interaktivitas komponen.

Properti rentang tanggal

Komponen Rentang Tanggal berbagi beberapa properti umum dengan komponen lain, sepertiName,Source, danValidation. Untuk informasi lebih lanjut tentang properti ini, lihatProperti komponen umum.

Selain properti umum, komponen Rentang Tanggal memiliki properti spesifik berikut:

Format

Tanggal mulai

Tanggal Akhir

Placeholder

Tanggal min

Tanggal maks

Jenis kalender

Hari wajib dipilih

Tanggal dinonaktifkan

Validasi

Bagian Validasi memungkinkan Anda untuk menentukan aturan dan batasan tambahan untuk input rentang tanggal.

Ekspresi dan contoh

Komponen Rentang Tanggal menyediakan bidang ekspresi berikut:

Contoh: Menghitung perbedaan tanggal

Contoh: Visibilitas bersyarat berdasarkan rentang tanggal

Contoh: Tanggal dinonaktifkan berdasarkan data baris saat ini

Validasi kustom

Komponen media

Studio aplikasi menyediakan beberapa komponen untuk menyematkan dan menampilkan berbagai jenis media dalam aplikasi Anda.

Menanamkan iFrame

Komponen embed iFrame memungkinkan Anda untuk menyematkan konten web eksternal atau aplikasi dalam aplikasi Anda menggunakan iFrame.

Properti sematkan iFrame

URL

URL konten eksternal atau aplikasi yang ingin Anda sematkan.

Tata Letak

Unggah S3

Komponen unggahan S3 memungkinkan pengguna untuk mengunggah file ke bucket Amazon S3. Dengan mengonfigurasi komponen Upload S3, Anda dapat memungkinkan pengguna untuk dengan mudah mengunggah file ke penyimpanan Amazon S3 aplikasi Anda, lalu memanfaatkan informasi file yang diunggah dalam logika aplikasi dan antarmuka pengguna Anda.

Properti unggah S3

Konfigurasi S3

Konfigurasi unggahan file

Validasi

Pemicu

Bidang ekspresi unggah S3

Komponen unggahan S3 menyediakan bidang ekspresi berikut:

Ekspresi dan contoh

Contoh: Mengakses file yang diunggah

Contoh: Memvalidasi unggahan file

Contoh: Tindakan memicu

Ekspresi ini memungkinkan Anda mengakses file yang diunggah, memvalidasi unggahan file, dan memicu tindakan berdasarkan hasil unggahan file. Dengan memanfaatkan ekspresi ini, Anda dapat membuat perilaku yang lebih dinamis dan cerdas dalam fungsi unggah file aplikasi Anda.

Komponen penampil PDF

Komponen penampil PDF memungkinkan pengguna untuk melihat dan berinteraksi dengan dokumen PDF dalam aplikasi Anda. App Studio mendukung berbagai jenis input ini untuk Sumber PDF, komponen penampil PDF memberikan fleksibilitas dalam cara Anda dapat mengintegrasikan dokumen PDF ke dalam aplikasi Anda, baik itu dari URL statis, URI data sebaris, atau konten yang dihasilkan secara dinamis.

Properti penampil PDF

Sumber

Sumber dokumen PDF, yang dapat berupa ekspresi, entitas, URL, atau otomatisasi.

Ekspresi

Gunakan ekspresi untuk menghasilkan sumber PDF secara dinamis.

Entitas

Hubungkan komponen penampil PDF ke entitas data yang berisi dokumen PDF.

URL

Tentukan URL dokumen PDF.

URL

Anda dapat memasukkan URL yang menunjuk ke dokumen PDF yang ingin Anda tampilkan. Ini bisa berupa URL web publik atau URL dalam aplikasi Anda sendiri.

Contoh: https://example.com/document.pdf

Data URI

URI Data adalah cara ringkas untuk memasukkan file data kecil (seperti gambar atau PDF) sebaris dalam aplikasi Anda. Dokumen PDF dikodekan sebagai string base64 dan disertakan langsung dalam konfigurasi komponen.

Gumpalan atau ArrayBuffer

Anda juga dapat menyediakan dokumen PDF sebagai Blob atau ArrayBuffer objek, yang memungkinkan Anda untuk secara dinamis menghasilkan atau mengambil data PDF dari berbagai sumber dalam aplikasi Anda.

Otomatisasi

Hubungkan komponen penampil PDF ke otomatisasi yang menyediakan dokumen PDF.

Tindakan

Tata Letak

Penampil gambar

Komponen penampil gambar memungkinkan pengguna untuk melihat dan berinteraksi dengan file gambar dalam aplikasi Anda.

Properti penampil gambar

Sumber

Teks alternatif

Deskripsi teks alternatif dari gambar, yang digunakan untuk tujuan aksesibilitas.

Tata Letak