Kiểu bảng html powerapps

Tác vụ Tạo bảng HTML trong Power Automate là một công cụ hữu ích nhưng thiếu bất kỳ tùy chọn định dạng hoặc kiểu dáng nào. Trong bài đăng này, tôi sẽ giải thích cách định dạng bảng HTML do Power Automate tạo ra. Đây là một ví dụ về đầu ra mặc định

theo ý kiến ​​của tôi

• Cái bàn thật xấu xí
• Không có tùy chọn căn chỉnh cột
• Nếu bạn đang sử dụng cột tùy chỉnh, nó không cho phép bạn đặt khoảng trắng trong tiêu đề cột

Tin vui là hành động Tạo bảng HTML tạo HTML cơ bản có thể dễ dàng sửa đổi hoặc tạo kiểu. Nguồn HTML của bảng do Power Automate tạo ở trên là

   

      

         
FirstName
         
LastName
         
JobDescription
         
Furloughed
         
FurlougedDate
      
   
   

      

         
Paul
         
Murana
         
Power Automate Developer
         
No
         

      
      

         
Micheal
         
Knight
         
Lone Ranger
         
Yes
         
1986-04-04
      
      

         
Peter
         
Venkman
         
Ghost Hunter
         
No
         

      
      

         
John
         
Rambo
         
Mercenary
         
No
         

      
   

Sử dụng CSS để tạo một bảng hấp dẫn hơn nhiều

Bằng cách thêm một số CSS, bạn có thể làm cho bảng hấp dẫn hơn rất nhiều một cách nhanh chóng

CSS đơn giản tôi đã áp dụng ở trên là

Nếu bạn không phải là trình hướng dẫn CSS, bạn có thể sử dụng https. // bảng chia. com/table-styler/ để giúp bạn bắt đầu

Vì vậy, bây giờ bạn đã có CSS, đây là cách thêm nó vào bảng

• Tạo một bước soạn thảo có tên CSS Table Style
• Dán CSS của bạn vào hành động soạn thảo đó
• Trong hành động Gửi email của bạn, hãy dán CSS và sau đó là Bảng HTML
  
  
  
  

Bạn có thể đặt bất kỳ thứ gì khác mà bạn cần vào phần thân, nhưng tôi khuyên bạn nên đặt CSS trước bất kỳ thứ gì khác

Thêm khoảng trắng vào tiêu đề cột

Trong ví dụ của tôi, tôi đã sử dụng cột tùy chỉnh và tôi không thể thêm dấu cách vào tiêu đề cột. Vì vậy, đây là cách giải quyết của tôi

• Sử dụng biểu tượng carat ^ bất cứ nơi nào bạn muốn có khoảng trắng trong tiêu đề cột
• Tạo một hành động soạn thảo để thay thế carat bằng một khoảng trắng
• Chọn đầu ra của phần soạn thảo trong email của bạn thay vì đầu ra Bảng HTML của bạn
  

Biểu thức soạn thảo là

replace(body('Create_HTML_table'), '^', ' ')

Tất nhiên, bạn có thể sử dụng bất kỳ biểu tượng nào, nhưng hãy đảm bảo sử dụng biểu tượng sẽ không được sử dụng ở nơi khác trong bảng. Các carat được thay thế bằng khoảng trắng

Bạn có thể tiến xa hơn nữa bằng cách hoàn toàn không sử dụng tác vụ Tạo bảng HTML mà xây dựng bảng của riêng bạn trực tiếp trong Power Automate và lặp qua một loạt bản ghi. Đây là điều tôi thỉnh thoảng làm, nhưng nó tốn nhiều công sức hơn và tôi muốn nhanh chóng đề cập đến cách cải thiện giao diện của hành động tiêu chuẩn

Điều khiển văn bản HTML không chỉ hiển thị văn bản và số đơn giản mà còn chuyển đổi các thẻ HTML, chẳng hạn như không gian không phá vỡ. Kiểm soát văn bản HTML không chỉ hiển thị văn bản và số thuần túy mà còn chuyển đổi các thẻ HTML, chẳng hạn như khoảng trắng không ngắt

Ghi chú

Điều khiển văn bản HTML giả định HTMLText tương đối có vị trí. Nếu bạn cần sử dụng một vị trí tuyệt vời đối với văn bản HTML của mình, hãy đánh văn bản xung quanh một div tương đối có vị trí. Ví dụ. "

Thuộc tính chính

Color color - Màu sắc của văn bản trong một điều khiển. – Màu của văn bản trong điều khiển

Phông chữ - Tên của gia đình phông chữ trong văn bản xuất hiện. – Tên của họ phông chữ trong đó văn bản xuất hiện

HTMLTEXT - Văn bản xuất hiện trong điều khiển văn bản HTML và có thể chứa các thẻ HTML. – Văn bản xuất hiện trong điều khiển văn bản HTML và có thể chứa các thẻ HTML

Tài sản bổ sung

BorderColor - Color color of the control border. – Màu của đường viền của điều khiển

BorderStyle - Cho dù đường viền của điều khiển là rắn, lao, chấm hoặc không có. – Đường viền của điều khiển là Đường liền nét, Đường đứt nét, Đường chấm hay Không

Borderthickness - Độ dày của biên điều khiển. – Độ dày của đường viền của điều khiển

DisplayMode - Cho dù điều khiển cho phép đầu vào của người dùng (chỉ sửa), chỉ hiển thị dữ liệu (chế độ xem) hoặc bị vô hiệu hóa (tắt). – Kiểm soát có cho phép người dùng nhập (Chỉnh sửa), chỉ hiển thị dữ liệu (Xem) hay bị tắt (Đã tắt)

DisableDbanderColor - Màu của đường viền của điều khiển nếu thuộc tính DisplayMode của điều khiển được đặt thành vô hiệu hóa. – Màu của đường viền của điều khiển nếu thuộc tính Chế độ hiển thị của điều khiển được đặt thành Tắt

DISSABSFILL - Màu nền của điều khiển nếu thuộc tính DisplayMode của nó được đặt thành Vô hiệu hóa. – Màu nền của tùy chọn kiểm soát nếu thuộc tính DisplayMode của tùy chọn đó được đặt thành Tắt

Điền vào - màu nền của một điều khiển. – Màu nền của điều khiển

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

Hover BorderColor - color of the control panel khi người dùng giữ con trỏ chuột trên bộ điều khiển đó. – Màu của đường viền của điều khiển khi người dùng giữ con trỏ chuột trên điều khiển đó

OnSelect - Hành động cần được thực hiện khi người dùng chọn điều khiển. – Thao tác thực hiện khi người dùng chọn một điều khiển

Ghi chú

OnSelect bỏ qua các siêu liên kết trong nội dung được tham chiếu bên trong thuộc tính HTMLTEXT. bị bỏ qua đối với các siêu liên kết trong nội dung được tham chiếu bên trong thuộc tính HtmlText

PaddingBottom - Khoảng cách giữa văn bản trong bảng điều khiển và cạnh dưới của bảng điều khiển đó. – Khoảng cách giữa văn bản trong một điều khiển và cạnh dưới cùng 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 đó. – Khoảng cách giữa văn bản trong một đ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 đó. – Khoảng cách giữa văn bản trong một đ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 một điều khiển và cạnh trên của điều khiển đó. – Khoảng cách giữa văn bản trong một điều khiển và cạnh trên cùng của điều khiển đó

Kích thước - Kích thước phông chữ của văn bản xuất hiện trên một điều khiển. – Cỡ chữ của văn bản xuất hiện trên điều khiển

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

Có thể nhìn thấy - cho dù một trình điều khiển xuất hiện hoặc bị ẩn. – Liệu một đ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 bên trái và bên phải của điều khiển. – 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 thùng chứa cha mẹ (màn hình nếu không có thùng chứa cha). – Khoảng cách giữa cạnh trái của một điều khiển và cạnh trái của vùng chứa chính của nó (màn hình nếu không có vùng chứa chính)

Y - Khoảng cách giữa cạnh trên của điều khiển và cạnh trên của thùng chứa cha (màn hình nếu không có thùng chứa cha). – Khoảng cách giữa cạnh trên cùng của tùy chọn kiểm soát và cạnh trên cùng của vùng chứa chính (màn hình nếu không có vùng chứa chính)

Tìm (FindString, withinstring)( FindString, InsideString )

Thí dụ

1. Thêm nhãn điều khiển, đặt tên cho nguồn và đặt thuộc tính văn bản của nó vào chuỗi này. Kiểm soát nhãn, đặt tên là Nguồn và đặt thuộc tính Văn bản của nó thành chuỗi này

   " Chúng tôi   đã thực hiện một cách bất thường "Deep"toàn cầu hóa và nội địa hóa. "

   Không biết làm thế nào để thêm, đặt tên và định cấu hình điều khiển?

2. Thêm điều khiển văn bản HTML và đặt thuộc tính HTMLTEXT của nó thành giá trị này. Nguồn. textHTML kiểm soát văn bản và đặt thuộc tính HtmlText của nó thành giá trị này.
   Nguồn. Văn bản

   Điều khiển văn bản HTML hiển thị cùng văn bản với nhãn điều khiển nhưng chuyển đổi các thẻ thành các ký tự thích hợp. Điều khiển văn bản HTML hiển thị văn bản giống như điều khiển Nhãn nhưng chuyển đổi các thẻ thành các ký tự thích hợp

Directions next to

Ánh xạ ARIA cho các phần tử bên trong điều khiển văn bản HTML không được xác định tự động bởi các nguồn ứng dụng. Kiểm soát văn bản HTML không được xác định tự động bởi Power Apps