บทความประกอบการเรียนรู้ => เทคนิคการอินเตอร์เฟส Visual C# => ข้อความที่เริ่มโดย: admin ที่ กันยายน 20, 2018, 03:15:21 PM

หัวข้อ: เรียนรู้ครั้งที่ 8 [การเพิ่มคอนโทรลคอมโพแนนต์ 7 Segment]
เริ่มหัวข้อโดย: admin ที่ กันยายน 20, 2018, 03:15:21 PM
โปรแกรมที่ใช้ควบคุมฮาร์ดแวร์หากแสดงผลที่สวยงามจะสร้างความสนใจแก่ผู้ใช้งานมากขึ้น สำหรับการแสดงผลที่เป็นตัวเลขในเครื่องมือเครื่องใช้ทั่วไปมักจะพบเห็นการใช้ LED ที่เป็น 7 Segment มาใช้งาน หากสร้างโปรแกรมควบคุมงานที่ใช้การแสดงผลที่มีลักษณะคล้าย ๆ กันจะทำให้โปรแกรมดูดีขึ้น แต่เนื่องจากโปรแกรม Visual Studio (C#) ไม่มีส่วนที่แสดงผลแบบ LED ตัวเลขได้จึงจำเป็นต้องติดตั้งไดร์เวอร์เพิ่มเติม

ตัวอย่างที่ได้
(http://www.praphas.com/PhotoForum/interface/HowTo8/12.png)

มีขั้นตอนดังนี้

1. สร้างโปรเจคงาน
(http://www.praphas.com/PhotoForum/interface/HowTo8/1.png)

2. ดาวน์โหลดไดร์เวอร์แสดงผล LED 7 Segment ที่
https://github.com/dbrant/SevenSegment (https://github.com/dbrant/SevenSegment)
(http://www.praphas.com/PhotoForum/interface/HowTo8/2.png)

3. ทำการแตกไฟล์ที่ดาวน์โหลดมา ทำการคัดลอกไฟล์ .DLL ที่อยู่ในโฟลเดอร์
...\SevenSegment-master\SevenSegment\bin\Release
(http://www.praphas.com/PhotoForum/interface/HowTo8/3.png)

4. นำไฟล์ที่คัดลอกวางในโฟลเดอร์โปรเจคในโฟลเดอร์ \bin\Debug
(http://www.praphas.com/PhotoForum/interface/HowTo8/4.png)

5. เพิ่มแทปใน Toolbox ดังรูป (ตั้งชื่อแทปตามต้องการ)
(http://www.praphas.com/PhotoForum/interface/HowTo8/5.png)

6. เลือกคอนโทรลคอมโพแนนต์ลงในแทปที่สร้างขึ้น ขั้นตอนดังรูป
(http://www.praphas.com/PhotoForum/interface/HowTo8/6.png)

7. คลิก Browse... เลือกไฟล์ที่วางในโฟลเดอร์โปรเจคจากขั้นตอนข้อที่ 4
(http://www.praphas.com/PhotoForum/interface/HowTo8/7.png)

8. จะได้คอนโทรลมา 2 ตัวคือ LED 7 Segment แบบตัวเดียวและแบบหลายตัว
(http://www.praphas.com/PhotoForum/interface/HowTo8/8.png)

ทดสอบการใช้งาน
โดยให้แสดงเป็นตัวเลขที่นับขึ้นทุก ๆ 1/10 วินาที

9. ลากวาง LED 7 Segment แบบหลายตัวทำการกำหนดค่าการใช้งานซึ่งหลัก ๆ มีดังนี้
ArrayCount =6         //จำนวนหลักของตัวเลข
ElementWidth=10    //ความหนาของตัวเลข
ElementPadding=8   //ความห่างระหว่างตัวเลข
DecimalShow=False // ปิดการแสดงจุดทศนิยม
ColorBackground     // สีพื้นหลัง
ColorDark               // สีเซกเมนต์ที่ดับ
ColorLight               // สีเซกเมนต์ติดสว่าง
(http://www.praphas.com/PhotoForum/interface/HowTo8/9.png)

10. วางคอนโทรล Timer ลงใน Form และกำหนดค่าใน Properties ดังนี้
   -Enabled-->True   เพื่อให้ไทเมอร์ทำงานทันทีเมื่อรันโปรแกรม
   -Interval--->100 กำหนดช่วงเวลาการกระตุ้นเป็น 100 มิลลิวินาที (1/10 วินาที)
(http://www.praphas.com/PhotoForum/interface/HowTo8/10.png)

11. ดับเบิลคลิกที่ตัว Timer แล้วเขียนโค้ด
(http://www.praphas.com/PhotoForum/interface/HowTo8/11.png)

12. รันโปรแกรมเพื่อทดสอบการแสดงผล
(http://www.praphas.com/PhotoForum/interface/HowTo8/12.png)

การปรับตัวเลขให้เอียง
จะต้องปรับ 2 ค่าดังรูป
   1. ปรับความเอียง ItalicFactor ให้มีค่า -0.1
   2. ปรับจุดเริ่มต้นด้านซ้ายของตัวเลขในแต่ละตัว ElementPadding->Left ให้มีค่าเป็น 20
(หรือจะเป็นค่าอื่นก็ได้ตามชอบ แต่ค่าข้างต้นนี้เป็นค่าที่ให้การแสดงผลกำลังพอดี)
(http://www.praphas.com/PhotoForum/interface/HowTo8/13.png)
หัวข้อ: Re: เรียนรู้ครั้งที่ 8 [การเพิ่มคอนโทรลคอมโพแนนต์ 7 Segment]
เริ่มหัวข้อโดย: admin ที่ กันยายน 20, 2018, 07:57:22 PM
...
หัวข้อ: Re: เรียนรู้ครั้งที่ 8 [การเพิ่มคอนโทรลคอมโพแนนต์ 7 Segment]
เริ่มหัวข้อโดย: admin ที่ กันยายน 20, 2018, 07:57:34 PM
...