ตัวควบคุม ปุ่ม ใน Power Apps

ตัวควบคุมที่ผู้ใช้สามารถคลิกหรือแตะเพื่อโต้ตอบกับแอป

คำอธิบาย

กำหนดคุณสมบัติ OnSelect ของตัวควบคุม ปุ่ม เพื่อเรียกใช้อย่างน้อยหนึ่งสูตรเมื่อผู้ใช้คลิกหรือแตะตัวควบคุม

คุณสมบัติของคีย์

OnSelect – การดำเนินการเพื่อดำเนินการเมื่อผู้ใช้แตะหรือคลิกตัวควบคุม

Text – ข้อความที่ปรากฏบนตัวควบคุม หรือที่ผู้ใช้พิมพ์ลงในตัวควบคุม

คุณสมบัติเพิ่มเติม

Align – ตำแหน่งของข้อความที่สอดคล้องกับจุดกึ่งกลางแนวนอนของตัวควบคุม

AutoDisableOnSelect – ปิดใช้งานตัวควบคุมโดยอัตโนมัติในขณะที่ลักษณะการทำงาน OnSelect กำลังทำงานอยู่

BorderColor – สีของเส้นขอบของตัวควบคุม

BorderStyle – กำหนดว่าเส้นขอบของตัวควบคุมจะเป็น ทึบ ประ จุด หรือ ไม่มี

BorderThickness – ความหนาของเส้นขอบของตัวควบคุม

Color – สีของข้อความในตัวควบคุม

DisplayMode – กำหนดว่าตัวควบคุมจะอนุญาตให้ผู้ใช้ป้อนข้อมูล (แก้ไข) แสดงข้อมูลเท่านั้น (มุมมอง) หรือถูกปิดใช้งาน (ปิดใช้งาน)

DisabledBorderColor – สีของเส้นขอบของตัวควบคุม ถ้าคุณสมบัติ DisplayMode ของตัวควบคุมถูกตั้งค่าเป็น ปิดใช้งาน

DisabledColor – สีของข้อความในตัวควบคุม ถ้าคุณสมบัติ DisplayMode ถูกตั้งค่าเป็น ปิดใช้งาน

DisabledFill – สีพื้นหลังของตัวควบคุม ถ้าคุณสมบัติ DisplayMode ถูกตั้งค่าเป็น ปิดใช้งาน

FocusedBorderColor – สีของเส้นขอบของตัวควบคุม เมื่อตัวควบคุมถูกโฟกัส

FocusedBorderThickness – ความหนาของเส้นขอบของตัวควบคุม เมื่อตัวควบคุมถูกโฟกัส

Fill – สีพื้นหลังของตัวควบคุม

Font – ชื่อของตระกูลของแบบอักษรที่ข้อความปรากฏ

FontWeight – น้ำหนักของข้อความในตัวควบคุม: หนา หนาครึ่งหนึ่ง ปกติ หรือ บาง

Height – ระยะห่างระหว่างขอบด้านบนและด้านล่างของตัวควบคุม

HoverBorderColor – สีของเส้นขอบของตัวควบคุม เมื่อผู้ใช้ค้างตัวชี้เมาส์ไว้บนตัวควบคุมนั้น

HoverColor – สีของข้อความในตัวควบคุม เมื่อผู้ใช้ค้างตัวชี้เมาส์ไว้บนนั้น

HoverFill – สีพื้นหลังของตัวควบคุม เมื่อผู้ใช้ค้างตัวชี้เมาส์ไว้บนนั้น

Italic – กำหนดว่าข้อความในตัวควบคุมเป็นตัวเอียงหรือไม่

PaddingBottom – ระยะห่างระหว่างข้อความในตัวควบคุมและขอบด้านล่างของตัวควบคุมนั้น

PaddingLeft – ระยะห่างระหว่างข้อความในตัวควบคุมและขอบด้านซ้ายของตัวควบคุมนั้น

PaddingRight – ระยะห่างระหว่างข้อความในตัวควบคุมและขอบด้านขวาของตัวควบคุมนั้น

PaddingTop – ระยะห่างระหว่างข้อความในตัวควบคุมและขอบด้านบนสุดของตัวควบคุมนั้น

Pressed – จริง ขณะที่กำลังกดตัวควบคุม เท็จ เมื่อไม่ได้กด

PressedBorderColor – สีของเส้นขอบของตัวควบคุม เมื่อผู้ใช้แตะหรือคลิกตัวควบคุมนั้น

PressedColor – สีของข้อความ เมื่อผู้ใช้แตะหรือคลิกตัวควบคุมนั้น

PressedFill – สีพื้นหลังของตัวควบคุม เมื่อผู้ใช้แตะหรือคลิกตัวควบคุมนั้น

RadiusBottomLeft – องศาที่มุมล่างซ้ายของตัวควบคุมจะถูกปัดเศษ

RadiusBottomRight – องศาที่มุมล่างขวาของตัวควบคุมจะถูกปัดเศษขึ้น

RadiusTopLeft – องศาที่มุมบนซ้ายของตัวควบคุมจะถูกปัดเศษ

RadiusTopRight – องศาที่มุมบนขวาของตัวควบคุมจะถูกปัดเศษ

Size – ขนาดFontของข้อความที่ปรากฏบนตัวควบคุม

Strikethrough – กำหนดว่าเส้นจะปรากฏผ่านข้อความที่ปรากฏบนตัวควบคุมหรือไม่

TabIndex – ลำดับการนำทางคีย์บอร์ดที่สัมพันธ์กับตัวควบคุมอื่นๆ

Tooltip – ข้อความอธิบายที่ปรากฏขึ้นเมื่อผู้ใช้วางเมาส์เหนือตัวควบคุม

Underline – กำหนดว่าเส้นจะปรากฏใต้ข้อความที่ปรากฏบนตัวควบคุมหรือไม่

VerticalAlign – ตำแหน่งของข้อความในตัวควบคุมที่สอดคล้องกับจุดกึ่งกลางแนวตั้งของตัวควบคุมนั้น

Visible – กำหนดว่าตัวควบคุมปรากฏขึ้น หรือถูกซ่อน

Width – ระยะห่างระหว่างขอบด้านซ้ายและด้านขวาของตัวควบคุม

X – ระยะห่างระหว่างขอบด้านซ้ายของตัวควบคุมและขอบด้านซ้ายของคอนเทนเนอร์หลัก (หน้าจอ ถ้าไม่มีคอนเทนเนอร์หลัก)

Y – ระยะห่างระหว่างขอบด้านบนของตัวควบคุมและขอบด้านบนของคอนเทนเนอร์หลัก (หน้าจอ ถ้าไม่มีคอนเทนเนอร์หลัก)

ฟังก์ชันที่เกี่ยวข้อง

Navigate( ScreenName, ScreenTransitionValue )

ตัวอย่าง

เพิ่มสูตรพื้นฐานให้กับปุ่ม

1. เพิ่มตัวควบคุม การป้อนข้อความ และตั้งชื่อว่า Source

   ไม่ทราบวิธีการ เพิ่ม ตั้งชื่อ และตั้งค่าคอนฟิกตัวควบคุม ใช่หรือไม่

2. เพิ่มตัวควบคุม ปุ่ม ตั้งค่าคุณสมบัติ Text เป็น "เพิ่ม" และตั้งค่าคุณสมบัติ OnSelect เป็นสูตรนี้:
   UpdateContext({Total:Total + Value(Source.Text)})

   ต้องการข้อมูลเพิ่มเติมเกี่ยวกับฟังก์ชัน UpdateContext หรือ ฟังก์ชันอื่นๆ ใช่ไหม

3. เพิ่มตัวควบคุม ป้ายกำกับ ตั้งค่าคุณสมบัติ Text ในแถบสูตรเป็น ค่า (รวม) แล้วจากนั้น กด F5

4. ล้างข้อความเริ่มต้นจาก แหล่ง พิมพ์ตัวเลขแล้วคลิกหรือแตะ เพิ่ม

   ตัวควบคุม ป้ายกำกับ แสดงหมายเลขที่คุณพิมพ์

5. ล้างตัวเลขจาก แหล่งที่มา พิมพ์ตัวเลขอื่นแล้วคลิกหรือแตะ เพิ่ม

   ตัวควบคุม ป้ายกำกับ แสดงผลรวมของตัวเลขสองตัวที่คุณพิมพ์

6. (ไม่บังคับ) ทำซ้ำขั้นตอนก่อนหน้านี้อย่างน้อยหนึ่งครั้ง

7. เมื่อต้องการกลับไปยังพื้นที่ทำงานเริ่มต้น ให้กด Esc (หรือคลิกหรือแตะไอคอนปิดในมุมขวาบน)

กำหนดค่าปุ่มด้วยสูตรหลายสูตร

เพิ่มสูตรที่ล้างตัวควบคุม การป้อนข้อความ ระหว่างรายการ

1. ตั้งค่าคุณสมบัติ HintText ของ แหล่งที่มา เพื่อ "ใส่ตัวเลข"

2. ตั้งค่าคุณสมบัติ OnSelect ของ เพิ่ม เป็นสูตรนี้:

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

   หมายเหตุ

   แยกสูตรหลายสูตรด้วยเครื่องหมายอัฒภาค ";"

3. ตั้งค่าคุณสมบัติ Default ของ แหล่งที่มา เป็น ClearInput

4. กด F5 และทดสอบแอปโดยการเพิ่มตัวเลขต่างๆ เข้าด้วยกัน

เพิ่มปุ่มอื่นเมื่อต้องการรีเซ็ตผลรวม

เพิ่มปุ่มที่สองเมื่อต้องล้างผลรวมระหว่างการคำนวณ

1. เพิ่มตัวควบคุม ปุ่ม อื่น ตั้งค่าคุณสมบัติ Text ของปุ่มเป็น "ล้าง" และตั้งค่าคุณสมบัติ OnSelect ของปุ่มเป็นสูตรนี้:

   UpdateContext({Total:0})

2. กด F5 เพิ่มตัวเลขต่างๆ เข้าด้วยกัน แล้วคลิกหรือแตะ Clear เพื่อรีเซ็ตผลรวม

เปลี่ยนลักษณะที่ปรากฏของปุ่ม

เปลี่ยนรูปร่างของปุ่ม

ตามค่าเริ่มต้น Power Apps จะสร้างตัวควบคุม ปุ่ม เป็นสี่เหลี่ยมผืนผ้าที่มีมุมมน คุณสามารถปรับเปลี่ยนรูปร่างของตัวควบคุม ปุ่ม แบบพื้นฐานโดยการตั้งค่าคุณสมบัติ Height Width และ Radius

หมายเหตุ

ไอคอนและรูปร่าง มีการออกแบบที่หลากหลาย และสามารถดำเนินการฟังก์ชันพื้นฐานบางอย่างได้เหมือนตัวควบคุม ปุ่ม อย่างไรก็ตาม ไอคอนและรูปร่าง ไม่มีคุณสมบัติ Text

1. เพิ่มตัวควบคุม ปุ่ม และตั้งค่าคุณสมบัติ Height และ Width ให้เป็น 300 เพื่อสร้างปุ่มสี่เหลี่ยมจตุรัสขนาดใหญ่

2. ปรับเปลี่ยนคุณสมบัติ RadiusTopLeft, RadiusTopRight, RadiusBottomLeft และ RadiusBottomRight เพื่อปรับระยะความโค้งของแต่ละมุม นี่คือตัวอย่างบางส่วนของรูปร่างต่างๆ แต่ละรูปร่างเริ่มต้นจากปุ่มสี่เหลี่ยมจตุรัสขนาด 300 x 300:

   • ตั้งค่า Radius ทั้งสี่ให้เป็น 150 เพื่อสร้างวงกลม
   • ตั้งค่า RadiusTopLeft และ RadiusBottomRight ให้เป็น 300 เพื่อสร้าง ปุ่ม รูปใบไม้
   • ตั้งค่า RadiusTopLeft และ RadiusTopRight ให้เป็น 300 และตั้งค่า RadiusBottomLeft และ RadiusBottomRight ให้เป็น 100 เพื่อสร้างปุ่มรูปแท็บ

เปลี่ยนสีของปุ่มเมื่อคุณวางเมาส์เหนือปุ่ม

ตามค่าเริ่มต้น สีเติมของตัวควบคุม ปุ่ม จะลดความสว่างลง 20% เมื่อคุณวางเหมาส์เหนือปุ่มนั้นด้วยเมาส์ คุณสามารถปรับลักษณะการทำงานนี้ได้โดยการเปลี่ยนคุณสมบัติ HoverFill ที่ใช้ฟังก์ชัน ColorFade ถ้าคุณตั้งค่าสูตร ColorFade เป็นเปอร์เซ็นต์ค่าบวก สีจะจางลงเมื่อคุณวางเมาส์เหนือปุ่ม ในขณะที่เปอร์เซ็นต์ค่าลบจะทำให้สีเข้มขึ้น

• เปลี่ยนแปลงค่าเปอร์เซ็นต์ ColorFade ในคุณสมบัติ HoverFill ของหนึ่งในปุ่มที่คุณสร้างขึ้น และสังเกตผล

คุณยังสามารถระบุสีของตัวควบคุม ปุ่ม ได้โดยการตั้งค่าคุณสมบัติ HoverFill ให้เป็นสูตรที่มีฟังก์ชัน ColorValue แทนที่จะเป็นฟังก์ชัน ColorFade เหมือนใน ColorValue("Red")

หมายเหตุ

ค่าสีสามารถเป็นนิยามสี CSS ชื่อสี หรือเลขฐานสิบหก อย่างใดอย่างหนึ่ง

• แทนที่ฟังก์ชัน ColorFade ด้วยฟังก์ชัน ColorValue ในหนึ่งในปุ่มที่คุณสร้างขึ้น และสังเกตผล

แนวทางการช่วยสำหรับการเข้าถึง

ความคมชัดของสี

• นำ ความต้องการด้านความคมชัดของสีมาตรฐาน ไปใช้

การสนับสนุนตัวอ่านหน้าจอ

• จำเป็นต้องมี Text

การรองรับแป้นพิมพ์

• TabIndex ต้องเป็นศูนย์หรือมากกว่า เพื่อให้ผู้ใช้คีย์บอร์ดสามารถนำทางได้
• ต้องมองเห็นตัวบ่งชี้โฟกัสได้อย่างชัดเจน ใช้ FocusedBorderColor และ FocusedBorderThickness เพื่อดำเนินการนี้ให้สำเร็จ

หมายเหตุ

บอกให้เราทราบเกี่ยวกับภาษาที่คุณต้องการในคู่มือ ทำแบบสำรวจสั้นๆ (โปรดทราบว่าแบบสำรวจนี้เป็นภาษาอังกฤษ)

แบบสำรวจนี้ใช้เวลาทำประมาณเจ็ดนาที ไม่มีการเก็บข้อมูลส่วนบุคคล (คำชี้แจงสิทธิ์ส่วนบุคคล)