ตัวควบคุมแถบเลื่อนใน Power Apps

ตัวควบคุมที่ผู้ใช้สามารถระบุค่าโดยการลากจุดจับ

คำอธิบาย

ผู้ใช้สามารถระบุค่า ระหว่างค่าต่ําสุดและค่าสูงสุดที่คุณระบุ โดยการลากจุดจับแถบเลื่อนซ้ายขวา หรือขึ้นลง ขึ้นอยู่กับทิศทางที่คุณเลือก

คุณสมบัติที่สำคัญ

Default – ค่าเริ่มต้นของตัวควบคุมก่อนที่ผู้ใช้จะเปลี่ยนแปลง

Max – ค่าสูงสุดที่ผู้ใช้สามารถตั้งค่าแถบเลื่อนหรือการจัดอันดับ

Min – ค่าต่ําสุดที่ผู้ใช้สามารถตั้งค่าแถบเลื่อน

Value – ค่าของตัวควบคุมการป้อนข้อมูล

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

AccessibleLabel – ป้ายชื่อสําหรับโปรแกรมอ่านหน้าจอ

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

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

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

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

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

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

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

HandleActiveFill สีของจุดจับสําหรับแถบเลื่อนเมื่อผู้ใช้เปลี่ยนแปลงค่า

HandleFill สีของจุดจับ (องค์ประกอบที่เปลี่ยนตําแหน่ง) ในตัวควบคุมการสลับหรือแถบเลื่อน

HandleHoverFill สีของจุดจับในแถบเลื่อนเมื่อผู้ใช้ชี้เมาส์ไว้

HandleSize – เส้นผ่านศูนย์กลางของที่จับ

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

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

Layout – กําหนดว่าผู้ใช้เลื่อนผ่านแกลเลอรีหรือปรับแถบเลื่อนจากด้านบนไปด้านล่าง (Vertical) หรือซ้ายไปขวา (Horizontal)

OnChange – การดําเนินการที่จะดําเนินการเมื่อผู้ใช้เปลี่ยนแปลงค่าของตัวควบคุม (ตัวอย่างเช่น ด้วยการปรับแถบเลื่อน)

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

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

RailFill – สีพื้นหลังของสี่เหลี่ยมผืนผ้าในตัวควบคุมการสลับเมื่อค่าเป็น false หรือสีของเส้นด้านขวาของที่จับในตัวควบคุมแถบเลื่อน

RailHoverFill – เมื่อคุณเลื่อนบนตัวควบคุมสลับหรือแถบเลื่อน สีพื้นหลังของสี่เหลี่ยมผืนผ้าในตัวควบคุมการสลับเมื่อค่าเป็น false หรือสีของเส้นทางด้านขวาของที่จับในตัวควบคุมแถบเลื่อน

ReadOnly – กําหนดว่าผู้ใช้สามารถเปลี่ยนค่าของตัวควบคุมแถบเลื่อนหรือการจัดอันดับได้หรือไม่

Reset – กําหนดว่าตัวควบคุมจะแปลงกลับเป็นค่าเริ่มต้นหรือไม่

ShowValue – กําหนดว่าค่าของแถบเลื่อนหรือการจัดอันดับปรากฏขึ้นเมื่อผู้ใช้เปลี่ยนแปลงค่านั้นหรือโฮเวอร์เหนือตัวควบคุม

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

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

ValueFill – สีพื้นหลังของสี่เหลี่ยมผืนผ้าในตัวควบคุมการสลับเมื่อค่าเป็น true หรือสีของเส้นทางด้านซ้ายของที่จับในตัวควบคุมแถบเลื่อน

ValueHoverFill – เมื่อคุณเก็บตัวชี้เมาส์บนตัวควบคุมสลับหรือแถบเลื่อน สีพื้นหลังของสี่เหลี่ยมผืนผ้าในตัวควบคุมการสลับเมื่อค่าเป็น true หรือสีของเส้นทางด้านซ้ายของจุดจับในตัวควบคุมแถบเลื่อน

Visible – กําหนดว่าตัวควบคุมแสดงอยู่หรือถูกซ่อนอยู่

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

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

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

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

Sum( Value1, Value2 )

ตัวอย่าง

1. เพิ่มปุ่ม และตั้งค่าคุณสมบัติ OnSelect เป็นสูตรดังนี้:
   ClearCollect(CityPopulations, {City:"London", ประเทศ:"สหราชอาณาจักร", ประชากร:8615000}, {City:"Berlin", Country:"Germany", Population:3562000}, {City:"Madrid", Country:"Spain", Population:3165000}, {City:"Rome", Country:"Italy", Population:2874000}, {City:"Paris", Country:"France", Population:2273000}, {City:"Hamburg", Country:"Germany", Population:1760000}, {City:"Barcelona", Country:"Spain", Population:1602000}, {City:"Munich", Country:"Germany", Population:160200}, {City:"Munich", Country:"Germany", Population:1494000}, {City:"Milan", Country:"อิตาลี", Population:1344000})

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

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

2. กด F5 เลือกปุ่ม จากนั้นกด Esc

3. เพิ่มแถบเลื่อน ย้ายแถบเลื่อนไปด้านล่างปุ่ม และตั้งชื่อแถบเลื่อนว่า MinPopulation

4. ตั้งค่าคุณสมบัติ Max ของแถบเลื่อนเป็น 5000000 และคุณสมบัติ Min เป็น 1000000

5. เพิ่มแกลเลอรีข้อความในทิศทางแนวตั้ง ย้ายไปที่ด้านล่างแถบเลื่อน และตั้งค่าคุณสมบัติ Items ของแกลเลอรีเป็นสูตรนี้:
   Filter(CityPopulations, Population > MinPopulation)

6. ในรายการแรกของแกลเลอรี ตั้งค่าคุณสมบัติ Text ของป้ายชื่อด้านบนเป็น ThisItem.City และตั้งค่าคุณสมบัติ Text ของป้ายชื่อด้านล่างเป็นสูตรนี้:
   Text(ThisItem.Population, "##,###")

7. กด F5 จากนั้นปรับ MinPopulation เพื่อแสดงเฉพาะเมืองที่มีจํานวนประชากรมากกว่าค่าที่คุณระบุ

8. เมื่อต้องการกลับไปยังพื้นที่ทํางานเริ่มต้น ให้กด Esc

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

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

ต้องมีความคมชัดของสีที่เพียงพอระหว่าง:

• ValueFill และ RailFill
• ValueHoverFill และ RailHoverFill
• สีเส้นขอบที่โฟกัส และสีนอกตัวควบคุม
• ValueFill และสีพื้นหลัง
• RailFill และสีพื้นหลัง
• ValueHoverFill และสีพื้นหลัง
• RailHoverFill และสีพื้นหลัง

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

• จําเป็นต้องมี AccessibleLabel

การสนับสนุนแป้นพิมพ์

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