Tổng quan về thành phần bảng tùy biến

Lưu ý

• Phần này giải thích các thành phần canvas bao gồm khả năng mở rộng giao diện người dùng low-code. Các nhà phát triển chuyên nghiệp cũng có thể sử dụng khung thành phần Power Apps để xây dựng các thành phần mã.
• Bạn cũng có thể sử dụng các thành phần canvas trong các ứng dụng dựa trên mô hình bằng cách sử dụng các trang tùy chỉnh và thư viện thành phần. Để biết thêm thông tin, hãy xem Thêm thành phần canvas vào trang tùy chỉnh trong ứng dụng dựa trên mô hình.

Các thành phần là các khối xây dựng có thể tái sử dụng cho ứng dụng canvas. Người tạo ứng dụng có thể tạo các điều khiển tùy chỉnh để sử dụng bên trong ứng dụng hoặc trên các ứng dụng bằng cách sử dụng thư viện thành phần. Thành phần có thể sử dụng các tính năng nâng cao như thuộc tính tùy chỉnh và cho phép các chức năng phức tạp. Bài viết này giới thiệu các khái niệm thành phần và một số ví dụ.

Các thành phần rất hữu ích khi xây dựng các ứng dụng lớn hơn có các mẫu điều khiển tương tự. Nếu bạn cập nhật định nghĩa thành phần bên trong ứng dụng, mọi phiên bản trong ứng dụng đó đều phản ánh các thay đổi của bạn. Các thành phần cũng giảm sự trùng lặp nỗ lực bằng cách loại bỏ nhu cầu sao chép và dán các điều khiển và cải thiện hiệu suất. Khi bạn sử dụng thư viện thành phần, các thành phần giúp tạo ra sự phát triển hợp tác và chuẩn hóa giao diện trong một tổ chức.

Để tìm hiểu cách sử dụng các thành phần trong ứng dụng canvas, hãy xem video này:

Thành phần trong ứng dụng canvas

Bạn có thể tạo một thành phần từ bên trong ứng dụng như được giải thích trong bài viết này hoặc bằng cách tạo một thành phần mới bên trong thư viện thành phần. Sử dụng thư viện thành phần khi bạn cần sử dụng các thành phần trên nhiều màn hình ứng dụng. Bạn cũng có thể sao chép các thành phần hiện có vào thư viện thành phần hiện có hoặc thư viện thành phần mới.

Để tạo một thành phần trong ứng dụng, hãy đi tới Chế độ xem cây, chọn tab Thành phần , sau đó chọn Thành phần mới:

Việc chọn Thành phần mới sẽ mở ra một khung vẽ trống. Thêm điều khiển như một phần của định nghĩa thành phần trên bảng tùy biến. Nếu bạn chỉnh sửa một thành phần trong bảng tùy biến, bạn sẽ cập nhật các phiên bản của cùng một thành phần trong các màn hình ứng dụng khác. Các ứng dụng tái sử dụng một thành phần đã tạo cũng có thể nhận được nội dung cập nhật thành phần sau khi bạn xuất bản các thay đổi về thành phần.

Bạn có thể chọn một thành phần từ danh sách các thành phần hiện có trong ngăn bên trái sau khi chọn một màn hình. Khi chọn một thành phần, bạn sẽ chèn phiên bản thành phần đó vào màn hình, giống như khi chèn một tùy chọn kiểm soát.

Các thành phần có sẵn bên trong ứng dụng xuất hiện trong danh mục Tùy chỉnh trong danh sách các thành phần bên trong chế độ xem cây. Các thành phần được nhập từ thư viện thành phần xuất hiện trong danh mục Thành phần thư viện :

Lưu ý

Các thành phần được thảo luận trong bài viết này khác với khung thành phần Power Apps cho phép nhà phát triển và người tạo tạo các thành phần mã cho ứng dụng dựa trên mô hình và canvas. Để biết thêm thông tin, hãy xem Power Apps tổng quan về khung thành phần.

Thuộc tính tùy chỉnh

Thành phần có thể nhận các giá trị đầu vào và gửi đi dữ liệu nếu bạn tạo một hoặc nhiều thuộc tính tùy chỉnh. Các tình huống này mang tính nâng cao và yêu cầu bạn phải hiểu công thức và hợp đồng ràng buộc.

Lưu ý

Một tính năng thử nghiệm dành cho các thuộc tính thành phần nâng cao cung cấp nhiều tùy chọn hơn cho các thuộc tính, bao gồm các hàm và hàm hành vi. Để biết thêm thông tin, hãy xem Thuộc tính thành phần Canvas (thử nghiệm)

Thuộc tính đầu vào là cách một thành phần nhận dữ liệu để sử dụng trong thành phần đó. Thuộc tính đầu vào sẽ xuất hiện trong tab Thuộc tính của ngăn bên phải nếu một phiên bản của thành phần được chọn. Bạn có thể đặt cấu hình thuộc tính đầu vào bằng biểu thức hoặc công thức, giống như khi đặt cấu hình thuộc tính tiêu chuẩn trong các tùy chọn kiểm soát khác. Các điều khiển khác có thuộc tính đầu vào, chẳng hạn như thuộc tính Mặc định của điều khiển Nhập văn bản .

Thuộc tính đầu ra được sử dụng để phát ra dữ liệu hoặc trạng thái thành phần. Ví dụ, thuộc tính Selected trên điều khiển Gallery là thuộc tính đầu ra. Khi tạo một thuộc tính đầu ra, bạn có thể xác định những tùy chọn kiểm soát nào khác có thể tham chiếu đến trạng thái thành phần.

Hướng dẫn sau đây giải thích thêm về các khái niệm này.

Tạo thành phần mẫu

Trong ví dụ này, bạn sẽ tạo một thành phần menu giống với đồ họa sau. Ngoài ra, bạn có thể thay đổi văn bản sau này để sử dụng trong nhiều màn hình, ứng dụng hoặc cả hai:

Lưu ý

Chúng tôi khuyên bạn nên sử dụng thư viện thành phần khi tạo thành phần để tái sử dụng. Việc cập nhật các thành phần bên trong một ứng dụng sẽ chỉ cung cấp nội dung cập nhật thành phần bên trong ứng dụng đó. Khi sử dụng thư viện thành phần, bạn sẽ được nhắc cập nhật thành phần nếu các thành phần bên trong thư viện được cập nhật và xuất bản.

Tạo thành phần mới

1. Tạo một ứng dụng canvas trống.

2. Trong Chế độ xem cây, chọn Thành phần và sau đó chọn Thành phần mới để tạo thành phần mới.

   

3. Chọn thành phần mới ở ngăn bên trái, chọn dấu ba chấm (...), sau đó chọn Đổi tên. Nhập hoặc dán tên dưới dạng MenuComponent.

4. Trong ngăn bên phải, đặt chiều rộng của thành phần là 150 và chiều cao là 250, sau đó chọn Thuộc tính tùy chỉnh mới. Bạn cũng có thể đặt chiều cao và chiều rộng thành bất kỳ giá trị nào khác nếu phù hợp.

   

5. Trong các hộp Tên hiển thị, Tên thuộc tính và Mô tả , hãy nhập hoặc dán văn bản dưới dạng Mục.

   

   Không bao gồm khoảng trắng trong tên thuộc tính vì bạn sẽ tham chiếu đến thành phần bằng tên này khi viết công thức. Ví dụ: ComponentName.PropertyName.

   Tên hiển thị sẽ xuất hiện trên tab Thuộc tính của ngăn bên phải nếu bạn chọn thành phần. Tên hiển thị mang tính mô tả giúp bạn và những người tạo khác hiểu rõ mục đích của thuộc tính này. Mô tả sẽ xuất hiện trong chú giải công cụ nếu bạn di chuột qua tên hiển thị của thuộc tính này trong tab Thuộc tính .

6. Trong danh sách Kiểu dữ liệu , chọn Bảng, rồi chọn Tạo.

   

   Thuộc tính Items được đặt thành giá trị mặc định dựa trên kiểu dữ liệu mà bạn đã chỉ định. Bạn có thể đặt thuộc tính này thành một giá trị phù hợp với nhu cầu của mình. Nếu bạn chỉ định kiểu dữ liệu là Bảng hoặc Bản ghi, bạn có thể muốn thay đổi giá trị của thuộc tính Mục để phù hợp với lược đồ dữ liệu mà bạn muốn nhập vào thành phần. Trong trường hợp này, bạn sẽ thay đổi thành danh sách chuỗi.

   Bạn có thể đặt giá trị của thuộc tính trên thanh công thức nếu bạn chọn tên thuộc tính trên tab Thuộc tính của ngăn bên phải.

   

   Như hình ảnh đồ họa tiếp theo cho thấy, bạn cũng có thể chỉnh sửa giá trị của thuộc tính trên tab Nâng cao ở ngăn bên phải.

7. Đặt thuộc tính Items của thành phần theo công thức này:

   Table({Item:"SampleText"})
   

   

8. Trong thành phần, chèn một điều khiển Bộ sưu tập dọc trống và chọn Bố cục trên ngăn thuộc tính làm Tiêu đề.

9. Đảm bảo rằng danh sách thuộc tính hiển thị thuộc tính Mục (theo mặc định). Sau đó, đặt giá trị của thuộc tính đó thành biểu thức sau:

   MenuComponent.Items
   

   Theo cách này, thuộc tính Items của điều khiển Gallery sẽ đọc và phụ thuộc vào thuộc tính Items đầu vào của thành phần.

10. (Tùy chọn) Đặt thuộc tính BorderThickness của điều khiển Bộ sưu tập thành 1 và thuộc tính TemplateSize của nó thành 50. Bạn cũng có thể cập nhật các giá trị cho độ dày viền và kích thước mẫu thành bất kỳ giá trị nào khác nếu phù hợp.

Thêm thành phần vào màn hình

Tiếp theo, thêm thành phần vào màn hình và chỉ định bảng chuỗi để thành phần hiển thị.

1. Trong ngăn bên trái, chọn danh sách màn hình, sau đó chọn màn hình mặc định.

   

2. Trên tab Chèn , mở menu Thành phần , sau đó chọn Thành phần Menu.

   

   Thành phần mới được đặt tên là MenuComponent_1 theo mặc định.

3. Đặt thuộc tính Items của MenuComponent_1 thành công thức này:

   Table({Item:"Home"}, {Item:"Admin"}, {Item:"About"}, {Item:"Help"})
   

   Phiên bản này giống với đồ họa sau, nhưng bạn có thể tùy chỉnh văn bản và các thuộc tính khác của từng phiên bản.

   

Tạo và sử dụng thuộc tính đầu ra

Cho đến nay, bạn đã tạo một thành phần và thêm nó vào một ứng dụng. Tiếp theo, tạo một thuộc tính đầu ra phản ánh mục mà người dùng chọn trong menu.

1. Mở danh sách các thành phần, sau đó chọn MenuComponent.

2. Trong ngăn bên phải, chọn tab Thuộc tính , sau đó chọn Thuộc tính tùy chỉnh mới.

3. Trong các hộp Tên hiển thị, Tên thuộc tính và Mô tả , hãy nhập hoặc dán Đã chọn.

4. Trong Loại thuộc tính, chọn Đầu ra, sau đó chọn Tạo.

   

5. Trên tab Nâng cao , đặt giá trị của thuộc tính Đã chọn thành biểu thức này, điều chỉnh số trong tên thư viện nếu cần:

   Gallery1.Selected.Item
   

   

6. Trên màn hình mặc định của ứng dụng, hãy thêm nhãn và đặt thuộc tính Văn bản thành biểu thức này, điều chỉnh số trong tên thành phần nếu cần:

   MenuComponent_1.Selected
   

   MenuComponent_1 là tên mặc định của một thể hiện, không phải là tên của định nghĩa thành phần. Bạn có thể đổi tên cho bất kỳ phiên bản nào.

7. Trong khi giữ phím Alt, hãy chọn từng mục trong menu.

   Điều khiển Nhãn phản ánh mục menu mà bạn đã chọn gần đây nhất.

Phạm vi

Thuộc tính đầu vào và đầu ra xác định rõ ràng giao diện giữa một thành phần và ứng dụng chứa thành phần đó. Theo mặc định, thành phần sẽ được đóng gói để việc sử dụng lại thành phần trên các ứng dụng dễ dàng hơn, đòi hỏi phải sử dụng các thuộc tính để chuyển thông tin vào và ra khỏi thành phần. Các hạn chế về phạm vi giúp hợp đồng dữ liệu của một thành phần trở nên đơn giản và gắn kết, đồng thời giúp cho phép cập nhật định nghĩa thành phần, đặc biệt là trên các ứng dụng có thư viện thành phần.

Nhưng đôi khi một thành phần có thể muốn chia sẻ nguồn dữ liệu hoặc biến với máy chủ của nó. Việc chia sẻ này đặc biệt hữu ích khi thành phần chỉ được thiết kế để sử dụng trong một ứng dụng cụ thể. Đối với những trường hợp này, bạn có thể truy cập trực tiếp thông tin cấp ứng dụng bằng cách bật công tắc Truy cập phạm vi ứng dụng trong ngăn thuộc tính của thành phần:

Khi bạn bật Phạm vi ứng dụng Access, bạn có thể truy cập các mục sau từ bên trong một thành phần:

• Biến toàn cục
• Bộ sưu tập
• Điều khiển và thành phần trên màn hình, chẳng hạn như điều khiển TextInput
• Nguồn dữ liệu dạng bảng, chẳng hạn như bảng Dataverse

Khi bạn tắt cài đặt này, thành phần không thể truy cập vào bất kỳ mục nào trước đó. Các hàm Set và Collect vẫn có sẵn nhưng các biến và bộ sưu tập kết quả được giới hạn trong phiên bản thành phần và không được chia sẻ với ứng dụng.

Các nguồn dữ liệu không phải dạng bảng, chẳng hạn như Azure Blob Storage hoặc trình kết nối tùy chỉnh, có sẵn cho dù cài đặt này được bật hay tắt. Hãy coi những nguồn dữ liệu này giống như tham chiếu đến tài nguyên môi trường thay vì tài nguyên ứng dụng. Khi một thành phần được đưa vào ứng dụng từ thư viện thành phần, các nguồn dữ liệu của từ môi trường cũng được đưa vào.

Các thành phần trong thư viện thành phần không bao giờ có thể truy cập vào phạm vi ứng dụng vì không có phạm vi ứng dụng duy nhất để tham chiếu. Do đó, cài đặt này không dùng được trong tình huống này và sẽ ở trạng thái tắt. Sau khi được nhập vào ứng dụng và nếu người tạo thành phần cho phép tùy chỉnh, công tắc có thể được bật và thành phần có thể được sửa đổi để sử dụng phạm vi ứng dụng.

Lưu ý

• Bạn có thể chèn các phiên bản thành phần vào một màn hình trong thư viện thành phần và xem trước màn hình đó cho mục đích thử nghiệm.
• Thư viện thành phần không hiển thị khi sử dụng Power Apps Mobile.

Nhập và xuất thành phần (đã ngừng hoạt động)

Lưu ý

Tính năng này đã ngừng hoạt động. Thư viện thành phần là cách được khuyến nghị để tái sử dụng các thành phần trên nhiều ứng dụng. Khi sử dụng thư viện thành phần, ứng dụng sẽ duy trì các phần phụ thuộc trên thành phần mà ứng dụng sử dụng. Nhà sản xuất ứng dụng được cảnh báo khi có các bản cập nhật cho các thành phần phụ thuộc. Do đó, mọi thành phần mới có thể tái sử dụng đều được tạo trong thư viện thành phần.

Khả năng nhập và xuất các thành phần bị tắt theo mặc định vì tính năng này đã ngừng hoạt động. Mặc dù phương pháp được đề xuất để làm việc với các thành phần là sử dụng thư viện thành phần, nhưng bạn vẫn có thể bật tính năng này trên cơ sở mỗi ứng dụng như một ngoại lệ cho đến khi tính năng bị xóa. Để thực hiện việc này, hãy chỉnh sửa ứng dụng của bạn trong Power Apps Studio, sau đó, đi tới Cài đặt>Tính năng sắp tới>Đã nghỉ hưu> Đặt Xuất và nhập các thành phần thành Bật.

Sau khi bật tính năng này, bạn có thể sử dụng các khả năng sau để nhập và xuất các thành phần.

Nhập thành phần từ một ứng dụng khác

Để nhập một hoặc nhiều thành phần từ một ứng dụng vào một ứng dụng khác, hãy chọn Nhập thành phần từ menu Chèn , sau đó sử dụng menu thả xuống Tùy chỉnh . Hoặc sử dụng Thành phần trong chế độ xem cây ở ngăn bên trái.

Một hộp thoại sẽ liệt kê mọi ứng dụng có chứa các thành phần mà bạn có quyền chỉnh sửa. Chọn một ứng dụng, sau đó chọn Nhập để nhập phiên bản đã phát hành gần đây nhất của tất cả các thành phần trong ứng dụng đó. Sau khi nhập ít nhất một thành phần, bạn có thể chỉnh sửa bản sao và xóa bất kỳ thành phần nào bạn không cần.

Bạn có thể lưu một ứng dụng chứa các thành phần hiện có vào một tệp cục bộ, sau đó tái sử dụng tệp bằng cách nhập tệp đó. Bạn có thể dùng tệp này để nhập các thành phần vào một ứng dụng khác.

Nếu ứng dụng chứa phiên bản sửa đổi của cùng một thành phần, bạn sẽ được nhắc quyết định xem sẽ thay thế phiên bản sửa đổi hay hủy nhập.

Sau khi bạn tạo thành phần trong một ứng dụng, các ứng dụng khác có thể dùng thành phần từ ứng dụng này bằng cách nhập các thành phần đó.

Lưu ý

Nếu một thành phần mà bạn đã nhập từ một ứng dụng khác được sửa đổi trong ứng dụng gốc, bạn phải nhập lại thành phần đó trong ứng dụng đang sử dụng theo cách thủ công để nhận các thay đổi thành phần mới nhất. Thay vào đó, hãy sử dụng thư viện thành phần để làm việc với các bản cập nhật thành phần hiệu quả hơn.

Xuất các thành phần từ ứng dụng của bạn

Bạn có thể xuất các thành phần vào một tệp và tải xuống để nhập vào ứng dụng khác.

Chọn tùy chọn Xuất thành phần từ phần Thành phần trong chế độ xem cây ở ngăn bên trái:

Bạn cũng có thể sử dụng menu Chèn và sau đó chọn menu thả xuống Tùy chỉnh .

Việc chọn Xuất thành phần sẽ tải xuống các thành phần vào một tệp:

Tệp thành phần đã tải xuống sử dụng phần mở rộng tên tệp .msapp .

Nhập thành phần từ tệp thành phần đã xuất

Để nhập các thành phần từ tệp thành phần đã xuất, hãy chọn Nhập các thành phần từ menu Chèn rồi sử dụng menu thả xuống Tùy chỉnh hoặc sử dụng Thành phần trong chế độ xem cây ở ngăn bên trái. Từ hộp thoại thành phần, chọn Tải tệp lên thay vì chọn bất kỳ thành phần hoặc ứng dụng nào khác:

Từ hộp thoại Mở , duyệt đến vị trí của tệp thành phần và chọn Mở để nhập các thành phần vào bên trong ứng dụng.

Nhập thành phần từ ứng dụng đã xuất

Bạn có thể lưu ứng dụng cục bộ bằng cách chọn Lưu tệp>dưới dạng:

Sau khi lưu ứng dụng, bạn có thể sử dụng lại các thành phần của ứng dụng bằng cách nhập chúng từ tệp. Để biết thêm thông tin, hãy xem phần trước về nhập các thành phần từ tệp thành phần đã xuất.

Các giới hạn đã biết

• Khi bạn có hai hoặc nhiều phiên bản của cùng một thành phần trong một ứng dụng, bạn không thể đặt cấu hình thuộc tính đầu vào tùy chỉnh thành giá trị thuộc tính đầu ra tùy chỉnh trên các phiên bản giống nhau hoặc khác nhau. Hành động này dẫn đến thông báo cảnh báo tham chiếu hình tròn. Để khắc phục giới hạn này, hãy tạo một bản sao của thành phần bên trong ứng dụng của bạn.
• Không hỗ trợ thêm và chạy dòng Power Automate trong thư viện thành phần.
• Bạn không thể lưu nguồn dữ liệu hoặc điều khiển bao gồm dữ liệu từ các nguồn dữ liệu đó (chẳng hạn như biểu mẫu, lưới linh hoạt hoặc bảng dữ liệu) với các thành phần.
• Bạn không thể chèn một thành phần vào bộ sưu tập hoặc biểu mẫu (bao gồm biểu mẫu SharePoint).
• Các thành phần không hỗ trợ hàm UpdateContext , nhưng bạn có thể tạo và cập nhật các biến trong một thành phần bằng cách sử dụng hàm Set . Phạm vi của các biến này được giới hạn ở thành phần, nhưng bạn có thể truy nhập vào các biến từ bên ngoài thành phần thông qua các thuộc tính đầu ra tùy chỉnh.

Các bước tiếp theo

Học cách sử dụng thư viện thành phần để tạo kho lưu trữ các thành phần có thể tái sử dụng.

Xem thêm

• Thư viện thành phần
• Quản lý vòng đời ứng dụng thư viện thành phần (ALM)
• Bản đồ các trường nhập của một thành phần
• Thêm đa phương tiện vào một thành phần
• Công thức hành vi cho các thành phần
• Power Apps khung thành phần
• Thêm các thành phần canvas vào trang tùy chỉnh trong ứng dụng dựa trên mô hình