Bangun aplikasi kanvas

Power Apps adalah platform produktivitas tinggi untuk aplikasi bisnis. Anda dapat membuat aplikasi piksel sempurna yang disesuaikan dengan kekuatan kanvas kosong Power Apps Studio. Untuk berbagi dengan pengguna Anda, render aplikasi di browser atau sematkan di berbagai kontainer seperti Teams dan SharePoint situs.

Pengalaman pengguna akhir inti untuk solusi template pengadaan SAP dibangun menggunakan aplikasi kanvas dan dapat dengan mudah diperluas untuk mendukung kebutuhan bisnis lokal Anda. Untuk memulai, ikuti pola dan praktik terbaik dalam artikel ini.

Ikuti praktik dan standar terbaik

Semua aplikasi dikembangkan menggunakan praktik terbaik dan standar yang dipublikasikan. Sebaiknya Anda mengadopsi praktik terbaik dan standar yang sama atau serupa saat memperluas atau membuat aplikasi baru.

Standard	Komentar	Informasi selengkapnya
Status Fitur	Fitur yang diaktifkan atau dinonaktifkan secara default. Termasuk subkumpulan fitur pratinjau kecuali fitur eksperimental.	Memahami fitur eksperimental, pratinjau, dan penghentian di aplikasi kanvas
Responsif	Responsif terhadap satu jenis perangkat seperti tablet atau ponsel. Memungkinkan aplikasi untuk snap ke berbagai layar standar dan ukuran wadah termasuk menyematkan aplikasi di dalamnya Microsoft Teams. Menggunakan kontrol kontainer responsif tata letak otomatis secara ekstensif.	Membuat aplikasi kanvas responsif
Standar Penamaan &; Pengkodean	Kontrol, variabel, koleksi, dan standar penamaan diikuti untuk mempromosikan kemudahan penemuan dan Dataverse pemeliharaan.	Power Apps Standar dan Panduan Pengkodean Aplikasi Canvas
Aksesibilitas	Properti yang mendukung aksesibilitas. Misalnya, Label yang Dapat Diakses, Peran, Live, Ketebalan Batas Fokus, Kontras Warna, dan Urutan Tab. Properti ini menghindari pola desain yang diketahui yang tidak mendukung persyaratan aksesibilitas.	Membuat aplikasi kanvas yang dapat diakses dan batasan Aksesibilitas di aplikasi kanvas
Kinerja	Praktik terbaik diikuti untuk menghindari batasan performa yang diketahui.	Tips dan praktik terbaik untuk meningkatkan performa aplikasi kanvas

Tema warna aplikasi global

Semua aplikasi mengikuti tema khusus dan dapat diubah sesuai dengan skema warna pilihan organisasi Anda. Variabel global diatur dalam properti App.OnStart di semua aplikasi. Variabel ini digunakan oleh sebagian besar properti terkait warna di semua kontrol dalam aplikasi. Mengubah variabel tema global warna di satu tempat akan memiliki efek langsung di seluruh aplikasi setelah menjalankan peristiwa App.OnStart .

Penting

Meskipun dimungkinkan untuk mengubah berbagai properti palet warna, sebaiknya hanya ubah properti warna primer dalam variabel tema global.

    Set(
        varThemeColors,
        {
            background: ColorValue("#FAF9F8"),
            backgroundFill: ColorValue("#FFFFFF"),
            backgroundFillDisabled: ColorValue("#F3F2F1"),
            text: ColorValue("#201F1E"),
            altText: ColorValue("#FFFFFF"),
            disabledText: ColorValue("#A19F9D"),
            primary: ColorValue("#0078D4"),
            secondary: ColorValue("#EFF6FC"),
            tertiary: ColorValue("#005A9E"),
            primaryGray: ColorValue("#8A8886"),
            secondaryGray: ColorValue ("#C8C6C4"),
            tertiaryGray: ColorValue("#605E5C"),
            requiredRed: ColorValue("#A80000"),
            lookupBlue: ColorValue("#0078D4")
        }
    )

Tambahkan logo perusahaan Anda

Tambahkan logo perusahaan Anda ke aplikasi dengan terlebih dahulu mengunggah file gambar logo perusahaan Anda ke aplikasi dan kemudian menambahkannya ke komponen ScreenHeader .

Informasi selengkapnya: Menggunakan file multimedia di aplikasi kanvas

Pelokalan dan dukungan aplikasi global

Semua aplikasi kanvas secara default memiliki dukungan untuk bahasa Inggris. Namun, semua aplikasi dirancang agar siap dilokalkan dan dapat dikelola untuk mendukung lebih banyak bahasa. Properti lebar kontrol mungkin perlu diubah secara langsung tergantung pada bahasa yang dipilih untuk disebarkan.

Pola pelokalan string

1. Pada properti OnVisible layar pertama selama peluncuran aplikasi, aplikasi membaca pengaturan bahasa browser pengguna dan menentukan nilai pilihan Kode Bahasa ISO yang sesuai .

      Set(
        varISOUserLanguageCode,
        Switch(
            Left(
                Language(),
                2
            ),
            "ar",
            'ISO Language Code'.ar,
            "de",
            'ISO Language Code'.de,
            "en",
            'ISO Language Code'.en,
            "es",
            'ISO Language Code'.es,
            "fr",
            'ISO Language Code'.fr,
            "he",
            'ISO Language Code'.he,
            "it",
            'ISO Language Code'.it,
            "ja",
            'ISO Language Code'.ja,
            "pt",
            'ISO Language Code'.pt,
            "zh",
            'ISO Language Code'.zh,
            'ISO Language Code'.en
        )
    )

Catatan

Properti kontrol label dan input mencoba mengantisipasi lebar nilai teks yang dilokalkan tetapi mungkin tidak selalu berhasil mengingat kompleksitas perhitungan tersebut. Oleh karena itu, kami menyarankan Anda untuk selalu menguji dan melakukan pengeditan kecil pada aplikasi setelah string dan perubahan yang dilokalkan dibuat.

Tip

Bahasa tambahan dapat ditambahkan dan didukung dengan menambahkan lebih banyak nilai ke komponen pilihan Kode Bahasa ISO yang terdapat dalam solusi SAP Base.

Aplikasi ini meminta entitas Pelokalan Dataverse SAP untuk string yang telah dilokalkan per bahasa yang masuk pengguna dan menyimpannya secara lokal dalam koleksi.

        ClearCollect(
            colUserLocalizedStrings,
            Filter(
                'SAP Localizations',
                Language = varISOUserLanguageCode,
                'SAP Localizations (Views)'.'Active SAP Localizations'
            )
        )

Semua properti terkait teks dalam berbagai kontrol seperti Teks, HintText, Label yang Dapat Diakses, InputTextPlaceholder, NoSelectionText, dan ToolTips memiliki rumus yang pertama-tama mencari string lokal yang setara. Jika tidak menemukan padanannya, defaultnya adalah bahasa Inggris, yang diatur dalam properti Teks di dalamblok Dengan .

  With(
      {Text: "Vendor name"},
      If(
          IsBlank(
              LookUp(
                  colUserLocalizedStrings,
                  'English Value' = Text
              ).'Localized Value'
          ),
          Text,
          LookUp(
              colUserLocalizedStrings,
              'English Value' = Text
          ).'Localized Value'
      )
  )

Untuk kontrol kotak kombo yang memfilter nilai dari tabel Daftar Nilai SAP, Kode Bahasa ISO yang dipetakan pengguna dari pengaturan browser mereka selalu diterapkan ke kriteria filter, default ke bahasa Inggris jika tidak ada daftar nilai yang dikelola untuk bahasa mereka.

Sort(
    Filter(
        'SAP List of Values',
        Status = 'Status (SAP List of Values)'.Active,
        Domain = 'Domain (SAP List of Values)'.Country,
        Language = varISOUserLanguageCode
    ),
    'Display Value'
)

Pengaturan lokal browser

Semua bidang angka, tanggal, dan waktu di aplikasi kanvas menghormati pengaturan lokal browser pengguna secara default. Misalnya, tanggal yang ditampilkan sebagai 23/03/2023 untuk pengguna yang menggunakan Amerika Serikat sebagai setelan lokalnya akan ditampilkan sebagai23.03.2023 untuk pengguna yang menggunakan setelan lokal Jerman.

Informasi selengkapnya: Membangun dukungan global ke dalam aplikasi kanvas

Komponen

Komponen adalah cara yang bagus untuk menyederhanakan proses pengembangan dan pemeliharaan aplikasi dan membantu meningkatkan kinerja.

Untuk area di mana ada kebutuhan untuk pengalaman pengguna umum baik secara internal atau di seluruh aplikasi, komponen dikonfigurasi. Mengingat keterbatasan library komponen untuk mendukung hal-hal seperti akses ke cakupan aplikasi dan alur cloud tertanam, komponen lokal dapat digunakan di semua aplikasi yang kemudian dapat diimpor ke aplikasi lain.

Misalnya, komponen VendorSearch digunakan di semua aplikasi yang mendukung proses pengadaan-ke-pembayaran dan itu terutama dibangun dalam aplikasi SAP Vendor Management dan diimpor untuk digunakan dalam aplikasi pengadaan-ke-pembayaran lainnya.

Peringatan

Konsekuensi negatif dari penggunaan komponen aplikasi lokal versus pustaka komponen adalah jika perubahan ditentukan, perubahan tersebut perlu dilakukan di semua aplikasi yang telah mengimpor komponen tersebut.

Komponen umum yang digunakan di seluruh aplikasi:

Komponen	Description
Tajuk Layar	Header umum di setiap layar
Navigasi Kiri	Navigasi utama yang memungkinkan akses cepat ke aplikasi lain yang didorong oleh sumber Item Dataverse Menu
CommandBar	Daftar kontrol umum untuk membuat, mengubah, menyimpan , membatalkan, mencari , pencarian terbaru, atau objek pencarian lanjutan
Tab Layar	Kelompok komponen logis disusun bersama menjadi tab untuk navigasi yang mudah
Tampilan Tanpa Item	Item diperlihatkan dalam kisi saat tidak ada rekaman
ObjectNameSearch	Komponen pencarian objek SAP umum disertakan dalam aplikasi yang sesuai di mana digunakan dan dapat diimpor ke aplikasi lain jika diperlukan. Contohnya termasuk VendorSearch, GLAccountSearch, MaterialSearch, dan RequisitionSearch

Informasi selengkapnya: Ikhtisar komponen kanvas

Bidang SAP tambahan

Setiap implementasi SAP berbeda dan sangat diharapkan bahwa Anda akan menambahkan bidang Anda sendiri yang mendukung proses bisnis Anda. Dengan demikian, ruang layar yang cukup dan pertimbangan desain diterapkan untuk memungkinkan Anda menambahkan bidang yang Anda butuhkan dengan mudah.

Kontainer kontrol umum

Sebagian besar kontrol terdapat dalam wadah yang terdiri dari kontrol label dan input. Misalnya, bidang untuk menangkap nama vendor dalam aplikasi SAP Vendor Management terdiri dari kontrol Label dan Input Teks seperti yang terlihat pada tangkapan layar berikut. Untuk menambahkan bidang baru, salin kontrol kontainer yang ada dan tempelkan di komponen responsif yang sesuai, perbarui nama, teks, dan akhirnya bidang yang dipetakan.

Catatan

Ada wadah serupa untuk jenis kontrol input lainnya seperti Combobox, Date Pickers, dan Buttons.

Kontainer responsif

Aplikasi dirancang agar responsif terhadap jenis perangkat tablet/desktop menggunakan kontrol wadah vertikal dan horizontal seperti yang ditunjukkan pada tangkapan layar berikut. Kontainer ini dikonfigurasi untuk memiliki titik awal untuk properti seperti tinggi, lebar, LayoutMinHeight , LayoutMinWidth, danWrap . Saat Anda menambahkan lebih banyak bidang ke kontainer ini, pastikan properti ini juga diperbarui untuk terus menangani responsivitas dengan tepat.

Informasi selengkapnya: Autolayout containers

Terhubung dengan data lain

Kekuatan aplikasi kanvas adalah bahwa mereka dapat dengan mudah terhubung ke salah satu dari beberapa ratus sistem dan aplikasi lain dengan aman menggunakan perpustakaan konektor asli mereka.

Misalnya, jika proses pesanan pembelian SAP Procurement Anda memerlukan data dari peluang prapenjualan hulu yang ada di CRM untuk menyelesaikan proses, Anda dapat menggunakan Salesforce atau Dataverse konektor untuk berintegrasi dengan Dynamics 365 sehingga Anda dapat dengan mudah menambahkan data tersebut ke aplikasi Pesanan Pembelian SAP hanya dengan memilih tombol.

Selain itu, jika Anda memiliki sistem kepemilikan internal atau sistem tanpa konektor asli, Anda dapat bekerja dengan Tim TI Anda untuk membuat konektor kustom yang memungkinkan Power Apps untuk dengan mudah berinteraksi dengan sistem tersebut melalui API yang didukung.

Informasi selengkapnya:

• Daftar konektor
• Gambaran umum konektor kustom

Penanganan kesalahan aplikasi

Semua panggilan alur yang disematkan mengevaluasi bidang status respons yang dikirim kembali oleh alur secara default dan menangani dengan menaikkan pesan melalui fungsi Beri tahu . Untuk mempelajari lebih lanjut, lihat Penanganan kesalahan.

If(
    !IsBlank(FirstError.Message),
    Patch(
        'SAP Integration Errors',
        Defaults('SAP Integration Errors'),
        {
            Action: FirstError.Source,
            'Additional Information': App.ActiveScreen.Name,
            'Error Message': FirstError.Message,
            Name: "SAP Vendor Management",
            'Source Type': 'Source Type (SAP Integration Errors)'.'Power App',
            'Workflow Status': 'Workflow Status (SAP Integration Errors)'.Failed
        }
    );
Trace(FirstError.Message);
Error(FirstError);  
)

Semua pengecualian tak terduga yang dihasilkan oleh aplikasi ditangani di properti App.OnError tempat rekaman kesalahan templat solusi SAP dibuat sebelum kesalahan dilempar ulang dan dilacak. Admin dapat melihat detail error dan menerapkan pemicu untuk diberi tahu tentang pengecualian aplikasi yang tidak ditangani seperti yangterlihat dalam dokumen error Monitor.

Informasi selengkapnya: Properti OnError

Konten terkait

• Apa itu aplikasi kanvas?
• Mengerti Power Apps Studio
• Membuat aplikasi kanvas dari dalam solusi
• Membangun UI yang dapat digunakan kembali dengan Power Apps kerangka komponen dan komponen aplikasi kanvas
• Mengelola Microsoft Power Platform
• Aplikasi kanvas untuk developer, partner, dan ISV perusahaan

Langkah berikutnya

Perluas aplikasi berbasis model dan Dataverse

Baca juga

Mulai menggunakan templat SAP Procurement