|
|
|
|
|
|
|
|
ดาวน์โหลดโปรแกรม RSS Reader ได้ที่นี่ ...
| |
|
|
|
| Visitors - Session views |     
7 ธันวาคม พ.ศ.2549
399 Users On-Line. |
|
| Visitors - Page views |  
1 กุมภาพันธ์ พ.ศ.2551 |
| |
|
|
 |
|
การทำ Progress Bar แบบบ้านๆ เมื่อศาสตร์และศิลป์มารวมกันได้อย่างลงตัว |
Category »
VB 6/VB.Net
โดย : Webmaster เมื่อ 21/7/2552 เวลา: 15:12 | | (อ่าน : 24077) |  ตัวผมเองศึกษาความรู้ทางด้านคอมพิวเตอร์ ทั้งฮาร์ดแวร์ และ ซอฟท์แวร์ ในลักษณะของ "การเรียนรู้นอกระบบ รบกันนอกตำรา" ... คิดเอง ฝึกเอง ทำเอง ... ดังนั้นสิ่งที่ผมพยายามถ่ายทอดออกมา ผมก็มองในแง่มุมของนักปฏิบัติ เพราะผมไม่ได้มาจากสาย วิชาเกิน เอ้ย วิชาการ เฉกเช่นหัวข้อนี้ ที่ผมนำมาใช้ฝึกน้องๆที่หื่นกระหาย อยากได้ความรู้ไปจากผมซ่ะเหลือเกิน (ในแต่ละปีจะมีเพียงไม่กี่คนหรอกครับ) ... เป็นเรื่องของ Progress Bar Control ซึ่งเป็นตัวแถบแสดงสถานะให้กับผู้ใช้ เช่น ปริมาณการคัดลอกข้อมูล แต่งานนี้ผมเอา Control มาตรฐาน Shape โดยไม่ต้องเรียกใช้ไฟล์ OCX อื่น (แต่หากอยากใช้ Progress Bar คุณต้องเรียกใช้งาน OCX เพิ่ม) จากนั้นนำมาลงโค้ด ผสมกับหลักการทำภาพเคลื่อนไหว (อ่านรายละเอียดเพิ่มเติม ... ที่นี่) ... ผมเองไม่อยากจะสาระแน แจกแจงอะไรไปมากกว่านี้ ขอให้ท่านที่ได้เข้ามาอ่าน ลองคิดเพิ่มเติมซิครับ ... คุณได้อะไรไปจากบทความตอนนี้บ้างล่ะครับ (ซึ่งมันเป็นทั้งเวลา และ เงินทองของผมด้วยน่ะ ... 55555+)
หลักการ และ แนวคิด
 จัดเรียง Shape1(0), Shape1(1), ...... Shape1(9) จนครบ 10 ตัว- กำหนดให้มี Shape (รูปสี่เหลี่ยมผืนผ้า) ทั้งหมด 10 ตัว โดยให้มีชื่อเดียวกัน (คุณสมบัติ Name) และอาศัย Index ในการอ้างอิงถึง คือ Shape1(0), Shape1(1), ... Shape1(9)
- ให้ Shape ทั้ง 10 ตัว ถูกปิดการมองเห็น คือ Shape1(Index).Visible = False
- ตั้งค่า Timer1 ให้ทำงานทุกๆ 150 มิลลิวินาที เพื่อทำการเปิดการแสดงผล (Visible) ของ Shape1 ทีละตัวจนครบ 10 ตัว
หลักการทำภาพนิ่งให้เป็นภาพเคลื่อนไหว
- การนำภาพนิ่งที่มีการเปลี่ยนแปลงทีละเล็กละน้อยมาเรียงต่อกัน ทำให้เสมือนเกิดเป็นภาพเคลื่อนไหวได้ พูดง่ายๆก็คือ "ภาพมันหลอกสายตาเรานั่นเองแหละครับ" หากอธิบายแบบหลักวิชาการก็คือ เนื่องมาจากการกระพริบตาในแต่ละครั้งของคนเรา ช้ากว่า หรือ ไม่ทันพอ ที่จะมองเห็นการเปลี่ยนแปลงอย่างรวดเร็วของภาพนิ่ง จึงทำให้เรามองเห็นภาพนิ่งกลายเป็นภาพเคลื่อนไหวได้
ออกแบบโปรแกรม (Design - Time)
จัดเรียง Shape1(0), Shape1(1), ...... Shape1(9) จนครบ 10 ตัว
ก่อนกดปุ่มทดสอบ
เมื่อ Shape1(1).Visible = True (ตัวที่ 2)
เมื่อ Shape1(2).Visible = True (ตัวที่ 3)
 ทุกๆ 150 มิลลิวินาที (เราตั้งจาก Timer1.Interval) จะทำให้ Shape1 ค่อยๆเปิดให้มองเห็นทีละตัวจนครบ 10 ตัว (0 - 9)
เมื่อภาพนิ่ง เกิดการเปลี่ยนแปลงของแต่ละภาพไปเล็กน้อย และการกระพริบตาของเราในแต่ละครั้งไม่ทันต่อการเปลี่ยนแปลงของภาพนิ่ง จึงสามารถทำให้มันหลอกสายตาของเรา ให้มองเห็นเป็นภาพเคลื่อนไหวได้นั่นเอง โอว ว้าววว Amazing in VB6 Programming
Option Explicit
' ประกาศตัวแปรแบบ Public ให้มองเห็นทั่วทั้งฟอร์ม
Dim Num As Byte
' หรือ ...
'Public Num As Byte
Private Sub cmdOK_Click()
' สั่งให้ Timer1 ทำงาน
Timer1.Enabled = True
' กำหนดขนาดแสดงผลฟอร์มใหม่แบบ Run Time
Me.Height = 705
Me.Width = 4920
End Sub
Private Sub Form_Load()
Me.Move (Screen.Width - Width) \ 2, (Screen.Height - Height) \ 2
For Num = 0 To 9
Shape1(Num).Visible = False
Next
' กำหนดค่าเริ่มต้นให้กับตัวแปร Num เพื่อความแน่ใจว่ามันเริ่มจาก 0 จริงๆ
Num = 0
' กำหนดระยะเวลา หรือ ความเร็ว หน่วยเป็น Millisecond
' 1000 Millisecond = 1 Second (วินาที)
Timer1.Interval = 150
' นั่นคือ ทุกๆ 150 ms. มีการแยกร่าง หรือ โปรเซส เพื่อวิ่งไปทำงานในโปรแกรมย่อย Timer1_Timer แต่ ...
' ทั้งนี้ทั้งนั้น ต้องขึ้นกับคำสั่งข้างล่างนี้ด้วย นั่นคือ Timer1.Enabled ต้องเป็น True เท่านั้น
' แต่ในขณะนี้ต้องปิดการทำงานไว้ก่อนน่ะครับ
Timer1.Enabled = False
End Sub
' ========================================================
' ส่วนของ Timer1 จะถูกกระตุ้นการทำงาน ตามเวลาที่ตั้งเอาไว้
' ========================================================
Private Sub Timer1_Timer()
' ========================================================
' จากจุดนี้ พี่น้องสามารถเขียนเงื่อนไขได้หลายแบบเลยน่ะครับ ... เช่น
' ใช้ Loop เข้ามาช่วย ... ลองใส่ติ่งไอเดียของตัวเองแก้ไขดูครับผม
' ========================================================
If Num > 9 Then
' หากมากำหนด Num = 0 ก่อนลูป For ข้างล่างจะเกิดอะไรขึ้น
'Num = 0
' ปิดการแสดงผลของ Shape ทุกตัว ...
' โดยผมเอาตัวแปร Num เวียนมาใช้งานก่อน เพื่อที่ไม่ต้องประกาศตัวแปรเพิ่มใหม่
' เสี้ยวหนึ่งของการทำ Optimized ระหว่างการโค้ด ... แต่ต้องระมัดระวังเรื่องของ
' L O G I C A L E R R O R - คือ ผลลัพธ์ผิดไปจากที่ต้องการด้วยครับ ... พี่น้อง
For Num = 0 To 9
Shape1(Num).Visible = False
Next
' เมื่อทดสอบให้ Num = 0 อยู่ด้านบน บรรทัดข้างล่างต้อง Comment เอาไว้ก่อนน่ะครับ
' แล้วลองดูผลลัพธ์ของการวางตำแหน่ง Num ทั้งคู่ดูด้วยว่ามีผลต่างหรือเหมือนกันอย่างไร
Num = 0
' ปรับขนาดหน้าจอกลับสู่สภาพเดิม
Me.Height = 1290
Me.Width = 4920
cmdOK.Visible = True
' ปิดการทำงานของ Timer1
Timer1.Enabled = False
' ================================================
' เงื่อนไขที่ตัวแปร Num มีค่า 0 - 9
' ================================================
Else
cmdOK.Visible = False
' เริ่มต้นปฏิบัติการแสดงผล Shape ทีละตัว
Shape1(Num).Visible = True
' เพิ่มค่าขึ้น 1 (Increment) ... หากลดค่าลงจะใช้คำว่า Decrement
Num = Num + 1
End If
End Sub
|
Conclusion:
บางคนอาจจะมองว่าเป็นเรื่องไร้สาระ (ว่ะ) เสียเวลาเปล่า ... เนื่องจากสิ่งที่คุณเห็นอยู่นี้ มันคือตัวอักษร และยิ่งมาถึงในส่วนสรุป หรือ ลงท้าย ผมเองก็ล้ามือในการพิมพ์ด้วยน่ะ 55555+ ... การพูดบรรยายจะได้ครบรส ครบเรื่องมากกว่าการอ่าน เป็นไหนๆครับ ... ประโยชน์จากบทความนี้ ผมสื่อไปถึง สำหรับผู้ที่กำลังฝึกฝน ให้ได้รู้จักคิด รู้จักหาไอเดีย หรือแนวทางของตัวเองในการเรียนรู้ พัฒนา อย่าเพียงมุ่งหวังแต่เกาะตำราหากินอย่างเดียวเลย ...
|
|
