บทความสอนกราฟิก

 ลืมรหัสผ่าน
 ลงทะเบียน
ค้นหา
ดู: 2723|ตอบกลับ: 0

[Renpy] 43. ลูกเล่น Text แบบต่างๆ

[คัดลอกลิงก์]

272

กระทู้

272

โพสต์

979

เครดิต

ผู้ดูแลระบบ

Rank: 9Rank: 9Rank: 9

เครดิต
979
แก้ไขครั้งสุดท้ายโดย nooknazha เมื่อ 2018-6-25 10:43

Text_Styles_01.jpg
[Renpy] 43. ลูกเล่น Text แบบต่างๆ
ถ้าจะให้คำพูดของตัวละครดูเรียบเนียนตลอดเวลาคนอ่านไปนานๆก็อาจจะเกิดความเบื่อเอาได้ ในบทความนี้เราจะมาดูกันว่าลูกเล่น Text คำสนทนาของตัวละครนั้นมีคำสั่งอะไรให้ใช้กันได้บ้างค่ะ

คำสั่งทั้งหมดนี้จะไม่ส่งผลใดๆต่อโครงสร้างโดยรวมของเกมส์นะคะ เป็นเพียงคำสั่งที่ไว้ใช้สำหรับเพิ่มลูกเล่นให้กับ text ในแต่ละ label ย่อยๆ เท่านั้น


ทำลิงค์ในคำพูดตัวละคร
จะแยกเป็น 2 ส่วนด้วยกันนะค่ะ คือ-ทำลิงค์ไปยังเว็บไซต์เกมส์  ใช้คำสั่ง
{a=url}...........{/a}
- ทำลิงค์ไปยังlabel ที่กำหนด ใช้คำสั่ง
{a=label}........{/a}

ตัวอย่างโค๊ด

  1. label test:

  2.     b "คุณสามารถศึกษาบทความ Renpy ได้ที่ {a=http://www.thaigraph.com/forum-86-1.html}เว็บไซต์ไทยกราฟค่ะ{/a}?"
  3.     b "หรือคุณจะมา {a=room_nook}เรียนกับฉันที่ห้องพัก{/a} ก็ได้นะ."

  4.     return

  5. label room_nook:

  6.     b "จะเริ่มจากพื้นฐานก่อนเลยดีไหมค่ะ ^^."
  7.     b "Ren'py ไม่ได้ยากอย่างที่คุณคิดหรอกค่ะ"

  8.     return
คัดลอกไปที่คลิปบอร์ด
ผลลัพธ์

Text_Styles_03.jpg
- ถ้าคลิกตามลิงค์(ภาพบน) เกมส์ก็จะเรียก WebSite ตาม url ที่เรากำหนดไว้ขึ้นมาแสดงค่ะ
Text_Styles_04.jpg
- ถ้าคลิกตามลิงค์(ภาพบน) เกมส์ก็จะวิ่งข้ามไปที่ label ที่เรากำหนดไว้ทันทีค่ะ

Text_Styles_05.jpg
******************************
ตัวหนา
Code:  {b}....{/b}
ตัวอย่าง
    b "คนอ่าน {b}สวยมาก{/b} และคนวาดก็{b}สวยมาก{/b}ด้วยนะ ^^."

ผลลัพธ์
Text_Styles_02.jpg

******************************

ทำสีตัวอักษร
Code: {color = รหัสสี}.......{/color}

ตัวอย่าง
    b "กินเยอะๆ จะได้{color=#00ff3c}โตวันโตคืน{/color}"

ผลลัพธ์

Text_Styles_06.jpg
******************************

กำหนดความเร็วในการแสดงตัวอักษร
- ทำให้ตัวอักษรแสดงช้า- เร็ว แบบปกติ ใช้คำสั่ง {cps=10}.....{/cps} ###(จะใช้เป็นตัวกำหนดคค่าช้าเร็วครั้งแรก)
- ทำให้ตัวอักษรแสดงช้า- เร็ว โดยใช้การคำนวณมาช่วย ใช้คำสั่ง {cps=*2}....{/cps} ###(สัญลักษณ์ * หมายถึงความเร็วคูณสองเท่าจากค่าความเร็วปกติ)

ตัวอย่าง
    b "{cps=10}ฉันว่ามันน่าจะอยู่แถวนี้{/cps} {cps=*2} ระวัง!!!!{/cps}"

ผลลัพธ์


Text_Styles_07.jpg
******************************

เปลี่ยน Font เฉพาะบางคำ
มีหลายท่านถามกันเข้ามานะคะว่าเอาฟ้อนไทยน่ารักๆมาใช้ได้ไหมคำตอบคือใช้ได้เกือบทุกฟ้อนที่มีสกุลเป็น .ttf นะคะ สำหรับคำสั่งนี้จะเป็นการเปลี่ยนฟ้อนเฉพาะบางคำในประโยคไม่ได้เปลี่ยนทั้งเกมส์นะคะ

CODE: {font=ชื่อฟ้อน.ttf}........{/font}

ตัวอย่าง
    b "พอดีไปเจอฟ้อนน่ารักมาค่ะชื่อ {font=pahnto.ttf} ปลาทู{/font}"

ผลลัพธ์

Text_Styles_08.jpg

เครดิตฟ้อน: http://www.f0nt.com/release/pahnto/
******************************


ทำตัวเอียง
CODE: {i}......{/i}

ตัวอย่าง
    b "..{i}เราอาจจะคิดไปเองก็ได้{/i} (T_T)"
ผลลัพธ์

Text_Styles_09.jpg
******************************

จัดช่องไฟตัวอักษร
Code: {k=ระยะห่างช่องไฟ}......{/k}###ระบุเป็นตัวเลข

ตัวอย่าง
    b"{k=-.5}Negative{/k} Normal {k=5}Positive{/k}"
ผลลัพธ์
Text_Styles_11.jpg
******************************

แทรกภาพระหว่างตัวอักษร
CODE: {image=ชื่อภาพ}

ตัวอย่าง
- แบบอ้างอึงจากไฟล์โดยตรง
    b "อยากเจอเธออีกครั้งจัง ><"{image=menu/heart.png}"

- แบบสร้างเป็นตัวแปรเก็บไว้แล้วค่อยดึงชื่อตัวแปรนั้นไปใช้ เหมาะสำหรับภาพที่เราต้องกลับมาใช้ซ้ำอีกบ่อยๆ
define b = Character('คิมหันต์', color="#f8f092")

image m ="menu/heart1.png" ###<-- สร้างตัวแปรภาพเก็บไว้

label start:
    b "อยากเจอเค้าอีกครั้งจัง{image=m}ทำไงดี>_<"

    return

ผลลัพธ์
Text_Styles_12.jpg

******************************

คำถูกขีดฆ่า

CODE: {s}...{/s}
ตัวอย่าง
    b "ห้ามพูดคำว่า {s}อิหัวเถิก{/s} นะมานปวดจายยยย"

ผลลัพธ์


Text_Styles_13.jpg
******************************

ทำอักษรตัวเล็ก - ตัวใหญ่
CODE: {size=ระบุค่าตัวเลข}....{/size}

ตัวอย่าง
    b"{size=+10}ปลาตัวใหญ่{/size}{size=24}กำลังว่ายน้ำมาหา{/size}{size=-10}ปลาตัวเล็ก{/size}"

ผลลัพธ์

Text_Styles_14.jpg

******************************

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

Code: {space=ระบุจำนวน}

ตัวอย่าง
    b"{space=30}กาลครั้งหนึ่งนานมาแล้ว มีหมาขาเป๋ตัวหนึ่ง -*-"

ผลลัพธ์


Text_Styles_16.jpg
******************************

ขีดเส้นใต้คำ
Code: {u}....{/u}

ตัวอย่าง
    b "{u}รางวัลที่ 1{/u} คือ........"

ผลลัพธ์

Text_Styles_17.jpg

******************************

ขึ้นบรรทัดใหม่ (แบบกำหนดระยะห่างระหว่างบรรทัด)
Code: {vspace=ค่าระยะห่างระหว่างบรรทัด}

ตัวอย่าง
    b "เอ๊ะ...{vspace=20}นี่เช้าแล้วเหรอเนี่ย"

ผลลัพธ์


Text_Styles_18.jpg
******************************

แสดงคำพูดต่อไปโดยต้องให้ผู้เล่นคลิกที่หน้าจอเกมส์ (ขึ้นบรรทัดใหม่)

- แบบรอจนกว่าผู้เล่นจะคลิกที่เกมส์คำสนทนาต่อไปจึงจะแสดงที่บรรทัดใหม่ให้เห็น
Code: {p}

-แบบถ้าผู้เล่นไม่ยอมคลิกที่เกมส์ให้รอจนกว่าจะถึงเวลาที่กำหนดจึงค่อย แสดงคำสนทนาที่บรรทัดใหม่ให้เห็น
Code: {p=ให้รอกี่วินาที}

ตัวอย่าง
    b "นี่ๆๆๆ{p}เห็นเพื่อนบ้านที่ย้ายมาใหม่คนนั้นไหม{p=1.0}ฉันว่ามันแปลกๆอยู่นะ"

ผลลัพธ์
Text_Styles_19.jpg
******************************

แสดงคำพูดต่อไปโดยต้องให้ผู้เล่นคลิกที่หน้าจอเกมส์ (ในบรรทัดเดียวกัน)

- แบบรอจนกว่าผู้เล่นจะคลิกที่เกมส์คำสนทนาต่อไปจึงจะปรากฏ
Code: {w}

-แบบถ้าผู้เล่นไม่ยอมคลิกที่เกมส์ให้รอจนกว่าจะถึงเวลาที่กำหนดจึงค่อย แสดงคำสนทนาที่บรรทัดใหม่ให้เห็น
Code: {w=ให้รอกี่วินาที}

ตัวอย่าง
    b "เธอคิดว่าฉันเป็นคนยังไง? {w} เชื่อคนง่าย {w=1.0}หรือดีเกินไป"

ผลลัพธ์

Text_Styles_20.jpg ******************************
คร่าวๆ ก็จะมีประมาณนี้นะคะนอกนั้นก็จะเป็นการกำหนด Style โดยตรงที่ไฟล์ Options.rpy ซึ่งเราจะมาดูกันในบทความต่อไปนะค่ะแต่ละคำสั่งมันใช้กันยังไง


แล้วเจอกันใหม่บทความหน้านะค่ะ ตอนนี้ขอตัวไปพักก่อน


******************************
บทความโดย นุ้ก
ขอจบบทความแค่เพียงเท่านี้ แล้วพบกันใหม่บทความหน้าค่ะ ^^
(ขอสงวนสิทธิ์อนุญาตให้เผยแพร่เฉพาะในเว็บ www.graphicfufu.comเท่านั้น)







ขออภัย! คุณไม่ได้รับสิทธิ์ในการดำเนินการในส่วนนี้ กรุณาเลือกอย่างใดอย่างหนึ่ง ลงชื่อเข้าใช้ | ลงทะเบียน

รายละเอียดเครดิต

ข้อความล้วน|อุปกรณ์พกพา|ประวัติการแบน|GraphicFUFU

GMT+7, 2024-4-25 20:13 , Processed in 0.153601 second(s), 32 queries .

Powered by Discuz! X3.4 R20180101, Rev.59

© 2001-2017 Comsenz Inc.

ตอบกระทู้ ขึ้นไปด้านบน ไปที่หน้ารายการกระทู้