Chia sẻ qua


ContextMenu điều khiển

Một điều khiển được dùng để nhập lệnh.

Lưu ý

Toàn bộ tài liệu và mã nguồn có trong kho lưu trữ thành phần mã GitHub.

Điều khiển ContextMenu.

Description

Menu ngữ cảnh (ContextMenu) là danh sách các lệnh dựa trên ngữ cảnh lựa chọn, di chuột hoặc tiêu điểm bàn phím. Chúng là một trong những bề mặt lệnh hiệu quả và được sử dụng nhiều nhất, đồng thời có thể dùng được ở nhiều nơi.

Thành phần mã này cung cấp một trình bao bọc xung quanh điều khiển Fluent UI ContextualMenu được liên kết với một nút để sử dụng trong ứng dụng canvas và các trang tùy chỉnh.

Thuộc tính

Thuộc tính khóa

Thuộc tính Description
Items Các mục hành động sẽ hiển thị. Mục đầu tiên được xem là mục gốc.

Items Của cải

Tên Description
ItemDisplayName Tên hiển thị của mục menu.
ItemKey Phím sẽ sử dụng để chỉ ra mục nào được chọn và khi thêm các mục phụ. Khóa phải là duy nhất.
ItemEnabled Đặt thành false nếu tắt tùy chọn này.
ItemVisible Đặt thành false nếu tùy chọn này không hiển thị.
ItemChecked Đặt thành true nếu chọn tùy chọn này.
ItemIconName Biểu tượng Fluent UI để sử dụng (xem biểu tượng Fluent UI)
ItemIconColor Màu để hiển thị biểu tượng dưới dạng (ví dụ: giá trị được đặt tên, rgb hoặc hex).
ItemIconOnly Không hiển thị nhãn văn bản - chỉ biểu tượng.
ItemHeader Hiển thị mục dưới dạng tiêu đề phần. Nếu có các mục với ItemParentKey được đặt thành khóa của mục này, chúng sẽ được thêm dưới dạng các mục được nhóm theo ngữ nghĩa trong phần này.
ItemTopDivider Kết xuất thanh chia ở đầu phần.
ItemDivider Hiển thị mục dưới dạng dấu phân cách phần - hoặc nếu mục là tiêu đề (ItemHeader = true), sau đó kiểm soát xem có hiển thị dấu phân cách ở cuối phần hay không.
ItemParentKey Kết xuất tùy chọn dưới dạng mục con của tùy chọn khác.

Lưu ý

  • ItemIconColor sẽ ghi đè giá trị Theme của thành phần và bỏ qua các màu trạng thái khác (ví dụ: bị vô hiệu hóa).
  • ItemHeaderItemDivider phải được đặt thành true để hiển thị như một bộ chia. Nếu đặt thành false, nó sẽ đợi các giá trị khác và sẽ kết xuất trống.
  • Việc thêm thuộc tính ItemChecked và hành vi của các mục menu phụ sẽ ngăn không cho menu phụ đóng lại khi nhấp vào.

Ví dụ:

Ví dụ: công thức Power Fx cho Items:

  Table(
      {
          ItemKey: "File",
          ItemIconName: "save",
          ItemDisplayName: "Save",
          ItemOverflow:true
      },
       {
          ItemKey: "Delete",
          ItemIconName: "Delete",
          ItemDisplayName: "Delete",
          ItemOverflow:true
      }
  )
  

Thuộc tính kiểu

Thuộc tính Description
Theme Chấp nhận chuỗi JSON được tạo bằng cách sử dụng Fluent UI Theme Designer (windows.net). Để trống phần này sẽ sử dụng chủ đề mặc định được xác định bởi Power Apps. Để trống phần này sẽ sử dụng chủ đề mặc định được xác định bởi Power Apps. Xem chủ đề để biết hướng dẫn về cách đặt cấu hình.
Chevron Hiển thị hoặc ẩn chữ V xuống trên nút gốc
IconColor Tùy chọn. màu của biểu tượng trên nút menu ngữ cảnh.
HoverIconColor Tùy chọn. màu của biểu tượng khi di chuột qua nút menu ngữ cảnh.
IconSize Tùy chọn. Kích thước của biểu tượng trên nút menu ngữ cảnh, tính bằng pixel.
FontSize Tùy chọn. Kích thước của văn bản trên nút menu ngữ cảnh, tính bằng pixel.
FontColor Tùy chọn. màu của văn bản trên nút menu ngữ cảnh.
HoverFontColor Tùy chọn. màu của văn bản khi di chuột qua nút menu ngữ cảnh.
FillColor Tùy chọn. màu nền của nút menu ngữ cảnh.
HoverFillColor Tùy chọn. màu nền khi di chuột qua nút menu ngữ cảnh.
TextAlignment Lề của văn bản trên nút. Các giá trị có thể dùng: Trung tâm, Trái hoặc Phải
AccessibilityLabel Nhãn aria cho trình đọc màn hình

Thuộc tính sự kiện

Thuộc tính Description
InputEvent Một sự kiện sẽ gửi vào điều khiển. Ví dụ: SetFocus. Xem dưới đây.

Hành vi

Hỗ trợ SetFocus dưới dạng InputEvent.

Đặt cấu hình hành vi 'Khi chọn'

Sử dụng công thức Switch() trong thuộc tính OnSelect của thành phần để đặt cấu hình hành động cụ thể cho mỗi mục bằng cách tham chiếu đến ItemKey đã chọn của phần điều khiển dưới dạng giá trị chuyển đổi.

Thay thế các giá trị false bằng các biểu thức thích hợp theo ngôn ngữ Power Fx.

  Switch( Self.Selected.ItemKey,
    /* Action for ItemKey 1 */
    "File", false,
    
    /* Action for ItemKey 2 */
    "Delete", false,
  
    /* Default action */
        false
  )

Đặt Tiêu điểm trên phần điều khiển

Khi một hộp thoại mới được hiển thị và tiêu điểm mặc định nằm trên kiểm soát, thì cần có tiêu điểm được đặt rõ ràng.

Để gọi sự kiện đầu vào, bạn có thể đặt một biến ngữ cảnh được liên kết với thuộc tính Sự kiện đầu vào thành một chuỗi bắt đầu bằng SetFocus và theo sau là một thành phần ngẫu nhiên để đảm bảo rằng ứng dụng sẽ phát hiện ra đó là một thay đổi.

Ví dụ:

UpdateContext({ctxResizableTextareaEvent:"SetFocus" & Text(Rand())}));

Sau đó, biến ngữ cảnh ctxResizableTextareaEvent sẽ được liên kết với thuộc tính Input Event.

Giới hạn

Chỉ có thể sử dụng thành phần mã này trong ứng dụng canvas và trang tùy chỉnh.