Chia sẻ qua


Điều khiển nút trong Power Apps

Điều khiển cho phép người dùng có thể bấm hoặc nhấn để tương tác với ứng dụng.

Sự miêu tả

Cấu hình thuộc tính OnSelect của điều khiển Nút để chạy một hoặc nhiều công thức khi người dùng bấm hoặc nhấn vào điều khiển.

Thuộc tính khóa

OnSelect – Hành động cần thực hiện khi người dùng nhấn hoặc bấm vào điều khiển.

Text – Văn bản xuất hiện trên điều khiển hoặc do người dùng nhập vào điều khiển.

Thuộc tính bổ sung

Align – Vị trí của văn bản liên quan đến trung tâm ngang của điều khiển.

AutoDisableOnSelect – Tự động tắt điều khiển trong khi hành vi OnSelect đang chạy.

BorderColor – Màu của viền điều khiển.

BorderStyle – Viền của điều khiển là Rắn, Nét đứt, Chấm chấm hay Không.

BorderThickness – Độ dày của viền điều khiển.

Color – Màu văn bản trong điều khiển.

ContentLanguage - Ngôn ngữ nội dung của điều khiển, nếu khác với bộ chứa của điều khiển.

DisplayMode – Điều khiển có cho phép người dùng nhập (Chỉnh sửa) hay không, chỉ hiển thị dữ liệu (Xem) hay bị tắt (Tắt).

DisabledBorderColor – Màu sắc của viền điều khiển nếu thuộc tính DisplayMode của điều khiển được đặt thành Tắt.

DisabledColor – Màu của văn bản trong điều khiển nếu thuộc tính DisplayMode của nó được đặt thành Tắt.

DisabledFill – Màu nền của điều khiển nếu thuộc tính DisplayMode của điều khiển đó được đặt thành Tắt.

FocusedBorderColor – Màu sắc của viền điều khiển khi điều khiển được tập trung.

FocusedBorderThickness – Độ dày của viền điều khiển khi điều khiển được tập trung.

– Màu nền của điều khiển.

Font – Tên của họ phông chữ xuất hiện trong văn bản.

FontWeight – Độ dày của văn bản trong điều khiển: Đậm, Semibold, Thông thường hoặc Sáng hơn.

Chiều cao – Khoảng cách giữa các cạnh trên cùng và dưới của điều khiển.

HoverBorderColor – Màu sắc của viền điều khiển khi người dùng giữ con trỏ chuột trên điều khiển đó.

HoverColor – Màu của văn bản trong điều khiển khi người dùng giữ con trỏ chuột trên đó.

HoverFill – Màu nền của điều khiển khi người dùng giữ con trỏ chuột trên đó.

Nghiêng – Văn bản trong điều khiển có in nghiêng hay không.

PaddingBottom – Khoảng cách giữa văn bản trong điều khiển và cạnh dưới của điều khiển đó.

PaddingLeft – Khoảng cách giữa văn bản trong điều khiển và cạnh trái của điều khiển đó.

PaddingRight – Khoảng cách giữa văn bản trong điều khiển và cạnh phải của điều khiển đó.

PaddingTop – Khoảng cách giữa văn bản trong điều khiển và cạnh trên của điều khiển đó.

Nhấn –True trong khi điều khiển đang được nhấn, false nếu không.

PressedBorderColor – Màu sắc của viền điều khiển khi người dùng nhấn hoặc bấm vào điều khiển đó.

PressedColor – Màu văn bản trong điều khiển khi người dùng nhấn hoặc bấm vào điều khiển đó.

PressedFill – Màu nền của điều khiển khi người dùng nhấn hoặc bấm vào điều khiển đó.

RadiusBottomLeft – Mức độ mà góc dưới cùng bên trái của điều khiển được làm tròn.

RadiusBottomRight – Mức độ mà góc dưới cùng bên phải của điều khiển được làm tròn.

RadiusTopLeft – Mức độ mà góc trên cùng bên trái của điều khiển được làm tròn.

RadiusTopRight – Mức độ mà góc trên cùng bên phải của điều khiển được làm tròn.

Size – Cỡ phông của văn bản xuất hiện trên điều khiển.

Gạch ngang chữ – Dòng có xuất hiện thông qua văn bản xuất hiện trên điều khiển hay không.

TabIndex – Thứ tự dẫn hướng bàn phím liên quan đến các điều khiển khác.

Chú giải công cụ – Văn bản giải thích xuất hiện khi người dùng di chuột qua điều khiển.

Gạch dưới – Dòng có xuất hiện bên dưới văn bản xuất hiện trên điều khiển hay không.

VerticalAlign – Vị trí của văn bản trên điều khiển liên quan đến tâm dọc của điều khiển đó.

Hiển thị – Cho dù điều khiển xuất hiện hay bị ẩn.

Chiều rộng – Khoảng cách giữa các cạnh trái và phải của điều khiển.

X – Khoảng cách giữa cạnh trái của điều khiển và cạnh trái của bộ chứa mẹ (màn hình nếu không có bộ chứa cha mẹ).

Y – Khoảng cách giữa cạnh trên của điều khiển và cạnh trên của bộ chứa cha mẹ (màn hình nếu không có bộ chứa cha mẹ).

Navigate( ScreenName, ScreenTransitionValue )

Ví dụ

Thêm công thức cơ bản vào nút

  1. Thêm điều khiển nhập Văn bản và đặt tên là Nguồn.

    Bạn không biết cách thêm , đặt tên và cấu hình điều khiển?

  2. Thêm điều khiển Nút , đặt thuộc tính Văn bản thành "Thêm" và đặt thuộc tính OnSelect của nó thành công thức này:
    UpdateContext({Total:Total + Value(Source.Text)})

    Bạn muốn biết thêm thông tin về hàm UpdateContext hoặc các hàm khác?

  3. Thêm điều khiển Nhãn , đặt thuộc tính Văn bản trong thanh công thức thành Value(Total), rồi nhấn F5.

  4. Xóa văn bản mặc định khỏi Nguồn, nhập một số vào đó, rồi bấm hoặc nhấn vào Thêm.

    Điều khiển Nhãn hiển thị số bạn đã nhập.

  5. Xóa số khỏi Nguồn, nhập một số khác vào số đó, rồi bấm hoặc nhấn vào Thêm.

    Điều khiển Nhãn hiển thị tổng của hai số mà bạn đã nhập.

  6. (tùy chọn) Lặp lại bước trước đó một hoặc nhiều lần.

  7. Để trở về không gian làm việc mặc định, nhấn Esc (hoặc bấm hoặc nhấn hoặc nhấn vào biểu tượng đóng ở góc trên bên phải).

Cấu hình một nút với nhiều công thức

Thêm công thức xóa điều khiển nhập Văn bản giữa các mục nhập.

  1. Đặt thuộc tính HintText của Nguồn thành "Nhập một số".

  2. Đặt thuộc tính OnSelect của Thêm vào công thức này:

    UpdateContext({Total:Total + Value(Source.Text)});
    UpdateContext({ClearInput: ""})

    Lưu ý

    Phân tách nhiều công thức bằng dấu chấm phẩy ";".

  3. Đặt thuộc tính Mặc định của Nguồnthành ClearInput.

  4. Nhấn F5, rồi kiểm tra ứng dụng bằng cách cộng một vài số với nhau.

Thêm nút khác để đặt lại tổng

Thêm nút thứ hai để xóa tổng số giữa các phép tính.

  1. Thêm điều khiển Nút khác, đặt thuộc tính Văn bản thành "Xóa" và đặt thuộc tính OnSelect của nó thành công thức này:

    UpdateContext({Total:0})

  2. Nhấn F5, thêm một vài số lại với nhau, rồi bấm hoặc nhấn Xóa để đặt lại tổng.

Thay đổi diện mạo của nút

Thay đổi hình của nút

Theo mặc định, Power Apps tạo điều khiển Nút hình chữ nhật với các góc được làm tròn. Bạn có thể sửa đổi cơ bản hình dạng điều khiển Nút bằng cách đặt thuộc tính Chiều cao, Chiều rộngBán kính.

Lưu ý

Biểu tượng và Hình cung cấp nhiều thiết kế khác nhau và có thể thực hiện một số chức năng cơ bản tương tự như điều khiển Nút. Tuy nhiên , Biểu tượng và Hình dạng không có thuộc tính Văn bản.

  1. Thêm điều khiển Nút và đặt thuộc tính Chiều cao Chiều rộng thành 300 để tạo nút hình vuông lớn.

  2. Sửa đổi các thuộc tính RadiusTopLeft, RadiusTopRight, RadiusBottomLeftRadiusBottomRight để điều chỉnh độ cong trên mỗi góc. Dưới đây là một số ví dụ về các hình dạng khác nhau, mỗi hình bắt đầu từ nút hình vuông 300 x 300:

Thay đổi màu của nút khi bạn di chuột qua nút đó

Theo mặc định, màu tô của điều khiển Nút sẽ mờ đi 20% khi bạn di chuột qua nút đó. Bạn có thể điều chỉnh hành vi này bằng cách thay đổi thuộc tính HoverFill sử dụng hàm ColorFade . Nếu bạn đặt công thức ColorFade thành tỷ lệ phần trăm dương, màu sắc sẽ trở nên nhạt hơn khi bạn di chuột qua nút, trong khi tỷ lệ phần trăm âm làm cho màu tối hơn.

Bạn cũng có thể chỉ định màu của điều khiển Nút bằng cách đặt thuộc tính HoverFill của nó thành công thức chứa hàm ColorValue thay vì hàm ColorFade , như trong ColorValue("Red").

Lưu ý

Giá trị màu có thể là bất kỳ định nghĩa màu CSS nào, tên hoặc giá trị hex.

  • Thay thế hàm ColorFade bằng hàm ColorValue ở một trong các nút mà bạn đã tạo và quan sát các hiệu ứng.

Hướng dẫn trợ năng

Độ tương phản màu

Hỗ trợ bộ đọc màn hình

  • Văn bản phải có mặt.

Hỗ trợ bàn phím