Font Converter part#2 Let’s Try !

คราวที่แล้วพูดถึงเรื่องของที่มา คราวนี้มาพูดถึงเรื่องตัวโปรแกรมกันดีกว่าครับ

หลังจากที่ดาวน์โหลดโปรแกรมเสร็จ แตกไฟล์ออกมาแล้วจะมีหน้าตาประมาณนี้

image

ซึ่งก็จะมีแค่ตัว Executable หนึ่งตัว ไฟล์ DLL นิดหน่อย กับ Folder ที่ชื่อว่า Plugin … โปรแกรมนี้จริง ๆ แล้วไม่มีอะไรเลย เหมือนเป็นโครงหลักให้ผุ้ใช้มาขยายมันมากกว่า ผ่าน Plugin นั่นเองครับ

เปิดโปรแกรมกันเลยดีกว่า

ทีนี้ กลับมาต่อกันที่ตัวโปรแกรม หลังจากที่เราดับเบิลคลิ๊กตัวไอคอนแดง ๆ แล้ว (แต่ต้องลง .Net Framework ก่อนนะ) จะมีหน้าต่างหลักขึ้นมาแบบนี้ครับ

image

โดยหลัก ๆ แล้วจะมีสองปุ่มใหญ่ ๆ อยู่บนหน้า (และอีกสองปุ่มเล็ก ๆ ซึ่งไม่ได้มีส่วนร่วมอะไรกับเขาเท่าไหร่) สองปุ่มนี้จะทำหน้าที่เปิดหน้าต่างอื่น ขึ้นมา ซึ่งก็มีสองหน้าต่างน่ะล่ะ

หน้าต่างแรกก็คือ

ตัววาด Glyph

image

Glyph หมายถึง ภาพตัวอักษร หน้าที่ของหน้าจอนี้คือ มันจะไปดึงเอาภาพ Glyph ในรูปแบบของ Vector จากไฟล์ Truetype ที่เราเปิดขึ้นมา แล้ววาดมันลงไปเป็นไฟล์ภาพแยกกัน พร้อมกับข้อมูลของแต่ละ Glyph ซึ่งจะถูกเขียนลงเป็นไฟล์ XML ครับ

เริ่มจาก เปิดไฟล์ฟอนท์ขึ้นมา แล้วก็กดปุ่ม Update โลด

image

จะเห็นตัวหนังสือขึ้นบนหน้าจอ Preview ตรงนี้อาจจะเห็นเป็นตัวขาด ๆ ไม่ค่อยสวย ลองเปลี่ยน Painter Type เป็น Gradient ปรับค่านิดหน่อย ใส่ขอบอีกนิด แล้วกด Preview ดูอีกทีครับ

image

เริ่มสวยละนะครับ

ถ้าอยากพรีวิวด้วยข้อความอื่น ก็ลองเปลี่ยนตัวหนังสือในช่อง Text ดูนะครับ

image

ในส่วนของ Painter นั้น ถ้าเกิดว่าตัวที่มากับโปรแกรมนั้นไม่ตรงกับที่ต้องการ ผู้ใช้สามารถเขียน Plugin เพิ่มเองได้ครับ โดยการสร้าง DLL ที่เชื่อมเข้ากับ Plugin-Interface.dll ซึ่งวิธีทำขอยกยอดไว้คราวหน้าล่ะกันครับ

เมื่อปรับจนพอใจแล้ว สิ่งต่อไปก็คือ กำหนดว่าให้เซฟไฟล์ไปไว้ที่ Path ไหน และใช้สคริปท์ใดบ้าง ซึ่งในส่วนของสคริปท์ก็คือชุดของ Glyph ที่ฝังอยู่ในไฟล์นั่นเอง โดยส่วนใหญ่จะเป็นเรื่องของภาษาครับ (แต่มีบางส่วนที่เป็นสัญลักษณ์บ้าง) อันนี้อ้างตามมาตรฐาน Unicode ครับ

สิ่งนึงที่ต้องระวังก็คือ ถ้าหากว่า ฟอนท์ต้นฉบับที่เราเอามาใช้ดันไม่มีสคริปท์ตัวที่เลือก ตัวโปรแกรมจะไม่เขียนไฟล์ภาพของสคริปท์นั้นลงไปใน Ouput นะครับ (เพราะไม่รู้จะใช้ตัวไหนนั่นเอง)

ว่าแล้วผมจะเลือกภาษาไทย และภาษาอังกฤษ ก็แล้วกันนะครับ จากนั้นก็เลือกว่าจะเซฟไฟล์ไว้ที่ไหน แล้วกด Start โลด

image

โปรแกรมจะทำการเรนเดอร์ไฟล์ภาพ และเขียนข้อมูลที่จำเป็น ลงไปใน Path ที่เราเลือกไว้ครับ

image

เสร็จแล้วจะได้ Output แบบนี้

image

ภายในไฟล์ xml จะมีข้อมูลของแต่ละ Glyph อยู่ ซึ่ง ก็จะมีบอกว่า Glyph นี้เป็นของ Character Code อะไร ขนาดเท่าไหร่ และข้อมูล Glyph Metrics ซึ่งผมจะพูดถึงในครั้งต่อๆ ไปครับ แต่ถ้าอยากอ่านเอารายละเอียดไว้ก่อนก็ลองอ่านจากเวปของทาง Freetype เองดูนะครับ ลองทำความเข้าใจดูนะครับ ไม่ยาก ๆ

ทีนี้กลับมาเรื่องเดิม เรากลับไปหน้าแรก แล้วลองกดปุ่มที่สอง หน้าต่างที่สองก็จะโผล่ออกมาดังนี้ครับ

ตัวสร้างฟอนท์

image

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

image

ทีนี้ แล้ว ไฟล์ output ที่ได้นั้นเป็นอย่างไร … อันนี้ขึ้นอยู่กับว่าเลือก Converter อะไร ซึ่งผมใส่ Converter ตัวอย่างมาให้หนึ่งตัว ชื่อว่า Sample Converter นั่นเอง … ตัว Converter นี้จะสร้างไฟล์ฟอนท์เป็นภาษา Lua ตามฟอร์แมทที่ผมใช้ในเกมนึงของผม (ซึ่งล่มไปนานแล้วครับ 555) พร้อมกับไฟล์ภาพพร้อมใช้ครับ

image

imageimage

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

ทีนี้ผมก็ได้ไฟล์ฟอนท์ไว้ใช้งานแล้วเรียบร้อย … ผมก็เอาใส่เข้าไปในตัวเกมผม แล้วก็ทดลองรันดูว่าใช้ได้มั้ย แล้วก็จบครับ

image

อะไรทำนองนี้ล่ะครับ Smile

Wutipong Wongsakuldej

Programmer, interested in frontend applications, music and multimedia.

Latest posts by Wutipong Wongsakuldej (see all)

Leave a Reply

Your email address will not be published. Required fields are marked *