Step 1 : พูดคุยรายละเอียดงาน

นัดพูดคุยกับทางแพลตฟอร์มเพื่อคุยรายละเอียดงานหรือส่งรายละเอียดงานผ่านฟอร์ม
โทรปรึกษาฟรี 0815459423

Step 2 : ขอใบเสนอราคา และชำระเงิน

ตกลงจ้างงาน โดยขอใบเสนอราคากับทางแพลตฟอร์ม และชำระเงิน

Step 3 : แพลตฟอร์มส่งงาน

ทางแพลตฟอร์มจะส่งงานให้ผู้ว่าจ้างตรวจสอบและปรับแก้ไขได้ 3 ครั้ง หากไม่มีแก้ไขถือว่าการส่งมอบงานเสร็จสิ้น

คำแนะนำเพิ่มเติม

Supapongai เป็นแพลตฟอร์มทำเว็บไซต์โดยคุณศุภพงศ์ Web Developer มืออาชีพ ร่วมงานกับบริษัทชั้นนำมากมาย เช่น FutureSkill , Skillane , The Blacksmith และอื่นๆ มั่นใจ ปลอดภัย งานดีมีคุณภาพ พร้อมไลน์ให้คำปรึกษาตลอดการใช้งาน

BLOG

การเขียน GUI ภาษา Python ทำ Typewrite effect animation ง่ายๆ ด้วย tkinter

Posted on by superauu
Typewrite Effect ใน tkinter
14
Dec

สวัสดีครับ ในบทความนี้ผมจะพานักอ่านทุกท่านได้รู้จักกับการเขียน GUI ภาษา Python ทำ Typewrite effect animation ง่ายๆ ด้วย tkinter นะครับ

สิ่งที่ต้องมี

  • Python version 3 ขึ้นไป
  • tkinter (เป็น library ติดเครื่องอยู่แล้ว) 
  • threading (เป็น library ติดเครื่องอยู่แล้ว) 

สำหรับการการเขียน GUI ภาษา Python ทำ Typewrite effect animation ง่ายๆ ด้วย tkinter สิ่งที่เราจะทำนะครับ จะเป็นการทำให้ข้อความของ widget Label ของเรานั้นมีเอฟเฟ็คพิเศษ คือ มันจะค่อยๆพิมพ์แสดงตัวอักษรเข้ามาทีละตัวๆจนถึงตัวสุดท้ายของคำ แล้วกลับไปเริ่มพิมพ์ใหม่ ทำแบบนี้ไปเรื่อยๆไม่รู้จบนะครับ 

ตัวอย่างตามในวิดีโอด้านล่างเลยนะครับ

ทีนี้มาดูในส่วนของขั้นตอนการทำ Typewrite Effect animation กันเลยครับ

คำอธิบายโค้ด

1. เบื้องต้นเราจะต้อง import library ที่จำเป็นมาใช้ก่อน ได้แก่ tkinter และ threading ในบรรทัดที่ 9 และ 10
Note : import tkinter as tk เป็นการนำไลบรารี่ tkinter เข้ามาใช้ และตั้งชื่อเล่นว่า tk ด้วยคำสั่ง as 
 
2. root = tk.Tk() ในบรรทัดที่ 24 เป็นคำสั่งสร้างหน้าจอพื้นฐานของโปรแกรมขึ้นมาแล้วเก็บไว้ในตัวแแร root 
 
3. root.title ในบรรทัดที่ 25 เป็นการตั้งชื่อหน้าจอ
 
4. root.iconbitmap ในบรรทัดที่ 26 เป็นการกำหนดภาพ Icon ของหน้าจอ
 
5. root.geometry ในบรรทีดที่ 27 เป็นการกำหนดขนาดของหน้าจอโปรแกรม
 
6. tk.Label(หน้าจอที่จะเลเบล, font) ในบรรทัดที่ 28 เป็นการใช้ widget Label ในการเขียนข้อตวามลงไปบนหน้าจอหลัก ในที่นี้ คือ ออปเจ็ค หรือ ตัวแปร root ในตอนแรกนั่นเอง และกำหนดให้ font เป็น Comic sans MS ขนาด 20 ตัวหนา (bold) และ ตัวเอียง (italic) โดยเราจะยังไม่ใส่ข้อความอะไรลงไป แต่เพียงแค่วาง widget Label นี้ไว้ก่อนเฉยๆ
 
7. ในบรรทัดที่ 13 เริ่มสร้างฟังก์ชันในการทำ TypeWrite Effect ก็คือฟังก์ชัน go โดยฟังก์ชันนี้จะมี parameter ที่กำหนดค่าไว้แล้ว 1 ตัว คือ counter=0 ไว้ตั้งแต่ตอนแรก โดยตัวแปร counter จะเป็นตัวแปรที่บอกว่ากำลังพิมพ์ถึงตัวอักษรไหนแล้ว
 
8. สร้างตัวแปร word ไว้เก็บข้อความที่จะแสดง Typewrite Effect ไว้ภายในฟังก์ชัน go
 
9. สร้างเงื่อนไขเอาไว้ 2 เงื่อนไข เงื่อนไขแรก ถ้าตัวแปร counter มีค่าเท่ากับ จำนวนตัวอักษรของตัวแปร word นั่นคือ Typewrite Effect นั่นได้พิมพ์ตัวอักษรไปถึงตัวสุดท้ายแล้ว เราจะกำหนดค่าให้ตัวแปร counter ใหม่ให้เป็น 0 เพื่อให้มันพิมพ์ไม่รู้จบ ส่วนอีกเงื่อนไขหนึ่ง else ก็เป็นในเคสปกติ นั่นเอง
 
 10.  คำสั่ง root.after(ใส่เวลาที่จะให้ฟังก์ชันทำ หน่วยเป็น (มิลลิวินาที ms),ชื่อฟังก์ชันที่จะทำ )
ในบรรทัดที่ 18,22 เป็นคำสั่งสุดท้ายในเงื่อนไขทั้งสอง คือ สั่งให้ฟังก์ชันนี้เรียกตัวเองไปเรื่อยๆ เป็นการทำงานแบบ recursive นั่นเอง โดยเรียกตัวเองหลังจากรอเวลา 0.2 วินาที หรือ 200 มิลลิวินาที และให้ตัวแปร counter บวกเพิ่มอีก 1 เพื่อพิมพ์ตัวอักษรต่อไป 
 
11. ในบรรทัดที่ 30 ในส่วนการทำงานหลักของโปรแกรม เป็นการสร้างเทรด thread ขึ้นมา แล้วให้รันฟังก์ชัน root.after โดนเราใส่อากูเมนท์ของฟังก์ชัน root.after เป็นลิสต์ไป 2 ตัว คือ 200 ms และ ชื่อฟังก์ชันที่จะให้ทำ recursive ก็คือฟังก์ชัน go นั่นเอง  แล้วสั่งเทรดให้ Start ทำให้คำสั่งนี้ที่เป็นเทรดจะแยกการทำงานออกไป ทำให้คำสั่งตรงนี้ไม่ต้องรอคอย การทำงานของคำสั่งอื่นว่าจะเสร็จเมื่อไหร่ ตัวเองก็ทำงานแยกกันไปเลย ทำให้โปรแกรมไม่เกิดอาการค้าง เพราะไม่ต้องรอคอยคำสั่งอื่นที่ยังไม่เสร็จ     
 

เรียบร้อยครับทีนี้ลองกดรันดูก็จะได้เอฟเฟ็คสวยๆแล้วครับ

สรุป

การเขียน GUI ภาษา Python ทำ Typewrite effect animation ด้วย tkinter อาจมีข้อจำกัดอยู่บ้าง เมื่อเทียบกับการทำอนิมเชันบนเว็บไซต์ โดยใช้ html css javascript อาจจะง่ายกว่า เนื่องจากไม่ต้องไปจัดการเรื่องเทรด แต่พอมาเป็น Desktop Application แล้วอาจต้องจัดการเรื่องเทรดอยู่บ้าง เพื่อป้องกันอาการค้างของโปรแกรม ที่มีสาเหตุมาจากการที่โปรแกรมของเราทำงานแบบ Sequential หรือโปรแกรมทำงานจากบนลงล่างนั่นเอง ทำให้เราต้องแยกการทำงานออกเป็นเทรด เพื่อให้ส่วนที่เป็นอนิเมชันได้ทำงานควบคู่ไปกับโปรแกรมส่วนอื่นที่รันยังไม่เสร็จได้ ทำให้โปรแกรมไม่ค้าง ซึ่งในผู้อ่านบางท่านที่พึ่งเริ่มต้นศึกษาการเขียน GUI ในภาษา Python ที่มีการจัดการเรื่อง Thread และ State managaement รวมถึงเรื่อง Event ต่างๆ อาจจะมองว่ายากได้ ซึ่งในบทความถัดๆไปผมอาจจะนำเรื่องการจัดการ Event หรือเทคนิคต่างๆมาเขียนเป็นบทความให้อ่านในลำดับถัดไป สำหรับบทความนี้นี้ผมอยากให้นักอ่านทุกท่านทำความเข้าใจเรื่องเทรด (Thread Programming) ให้ดี เพราะจะเป็นประโยชน์ ต่อการเขียนโปรแกรมในอนาคตแน่นอน สุดท้ายนี้ก็ขอขอบคุณนักอ่านทุกท่านที่แวะมาอ่านบทความนี้ เจอกันบทความหน้า สวัสดีครับ

Youtube Facebook Linkedin
Article Rate
5/5
superauu

Comments are closed.

เราใช้คุกกี้เพื่อพัฒนาประสิทธิภาพ และประสบการณ์ที่ดีในการใช้เว็บไซต์ของคุณ คุณสามารถศึกษารายละเอียดได้ที่ นโยบายความเป็นส่วนตัว และสามารถจัดการความเป็นส่วนตัวเองได้ของคุณได้เองโดยคลิกที่ ตั้งค่า

ตั้งค่า ปฏิเสธ ยอมรับ
Privacy Preferences

คุณสามารถเลือกการตั้งค่าคุกกี้โดยเปิด/ปิด คุกกี้ในแต่ละประเภทได้ตามความต้องการ ยกเว้น คุกกี้ที่จำเป็น

ยอมรับทั้งหมด
Manage Consent Preferences
  • คุกกี้ที่จำเป็น
    Always Active

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

  • คุกกี้สำหรับการติดตามทางการตลาด

    ประเภทของคุกกี้ที่มีความจำเป็นในการใช้งานเพื่อการวิเคราะห์ และ นำเสนอโปรโมชัน สินค้า รวมถึงหลักสูตรฟรี และ สิทธิพิเศษต่าง ๆ คุณสามารถเลือกปิดคุกกี้ประเภทนี้ได้โดยไม่ส่งผลต่อการทำงานหลัก เว้นแต่การนำเสนอโปรโมชันที่อาจไม่ตรงกับความต้องการ

บันทึก
Privacy Preferences