ใส่ภาพพื้นหลังให้โซโว่ ดีพีเอฟ บวก
Entry นี้ สืบเนื่องจากมีคนโหลดโซโว่ ดีพีเอฟ บวก ไปใช้
แล้วมีคำถามว่าจะใส่ภาพพื้นหลังลงไปอย่างไร (๑, ๒, ๓ ..จริงๆ คนถามคือคนเดียวกันนั่นแหละ)
..ซึ่งสำหรับ ดีพีเอฟเวอร์ชั่นดั้งเดิม และโซโว่ ดีพีเอฟ บวก ไม่ได้อำนวยความสะดวกในการระบุ path ของรูปเพื่อแสดงผลภาพพื้นหลังให้เลยนะครับ 
(เรื่องของเรื่อง จะพูดยังไงดีล่ะ ..คือผมไม่รู้ว่าผู้พัฒนาเดิมทำไมถึงไม่ได้ทำ
..แต่ที่ผมไม่เพิ่มลงไปมีเหตุผลส่วนตัวว่ามันไม่ค่อยจำเป็นเท่าไหร่)
..ทุกวันนี้ ณ เวอร์ชั่น 1.1 การจะใส่ภาพพื้นหลังลงไปคงต้องอาศัยการ Import ลงไปโดยตรงในไฟล์ .FLA เอง 
เรื่องนี้ถ้าพูดกันจริงจัง ..คือผมก็เข้าใจครับว่าถ้าสำหรับคนที่ไม่คุ้นเคยโปรแกรม Flash มากนัก -
ก็เป็นเรื่องที่เข้าใจได้ค่อนข้างยาก
(แต่ในมุมของผู้ใช้เบื้องต้นก็อาจจะมองว่า การ import ภาพให้ถูก layer -
และจัดเรียงกับ stage นิดหน่อย..ก็ไม่ใช่เรื่องซับซ้อนอะไร)
Entry นี้ก็เลยขอแนะนำวิธีการใส่ภาพพื้นหลังลงไปในโซโว่ ดีพีเอฟ บวก ละกันครับ
วิธีก็ไม่มีอะไรมาก แค่ Import ภาพใส่ลงไปให้ถูก layer และจัดเรียงนิดหน่อย
..คือเป็นพื้นฐานการใช้งาน Flash เลยว่างั้นเถอะ
(อ้อ.. เนื่องจากเป็น entry ที่พยายามแนะนำวิธีอย่างง่าย
ในที่นี้จึงเป็นการสาธิตวิธีใส่ภาพพื้นหลังแบบ Center ภาพเดี่ยวนะครับ
(ไม่ใช่แบบ Tile ที่เรียงต่อเป็น pattern แบบใน wallpaper ของ Windows นะ!))
ในที่นี้ใช้ภาพประกอบจากโปรแกรม Flash CS3 นะครับ (..ไม่ต่างกับ Flash 8)
ก่อนอื่นมาคำนวณก่อนว่าภาพพื้นหลังควรมีขนาดกว้าง x ยาวขั้นต่ำเท่าไหร่..
ในภาพข้างบน..เขียนให้เห็นถึงขอบเขตการแสดงผลเดิมของโซโว่ ดีพีเอฟ บวก นะครับ
จะเห็นว่ามีการระบุความกว้าง x ยาวเอาไว้แต่ละส่วน โดยมีตัวแปรสองตัวคือ Width และ Height
..ถามว่า Width และ Height คืออะไร?
คำตอบก็คือความกว้างและความยาวของหน้าหนังสือปกติหนึ่งหน้าที่คุณกำหนดในเอกสาร XML นั่นแหละครับ
เช่นถ้าสมมติว่าคุณกำหนดกว้าง x ยาวไว้ที่ค่าเดิม (300 x 400)
แนวนอนของการแสดงผลหลักทั้งหมดก็คือ (2 x 300) + 20 = 620 (ในกรณีที่มีการแสดงผลกรอบสีขาวรอบหน้าหนังสือ)
และแนวตั้งของการแสดงผลหลักทั้งหมดก็คือ 50 + (400 + 20) + 45 = 515 (ในกรณีที่มีการแสดงผลกรอบสีขาว และมี logo ขนาดความสูงเต็มที่)
…สรุปก็คือจากตัวอย่าง ภาพพื้นหลังควรมีความกว้าง x ยาวมากกว่า 620 x 515px
(เพราะถ้าพอดีเด๊ะหรือน้อยกว่านั้น ..ส่วนแสดงผลหนังสือก็จะบังเรียบ!)
..ตรงนี้เข้าใจนะครับ
ทีนี้ก็เริ่มต้นด้วยการเปิดเอกสาร .FLA ล่ะครับ
หน้าตาโปรแกรมก็ประมาณนี้ ..อาจมีเครื่องมือเยอะกว่านี้ก็ไม่แปลก -
เพราะในที่นี้ผมซ่อนเครื่องมือไว้เพื่อให้แสดงผลเฉพาะที่จำเป็น
ดูที่ layer ด้านบนครับ
ถ้าเลื่อนลงมาดูจนสุดด้านล่าง จะเห็นว่าต้นฉบับของโซโว่ ดีพีเอฟ บวก มี layer ที่ชื่อ Layer 18 อยู่ด้านล่างสุดตามภาพ
ปกติถ้าเราจะใส่ภาพพื้นหลังลงไป ..เราก็ควรจะวางไว้หลังทุก object และอยู่ล่างทุก layer ที่มีอยู่เดิมทั้งหมด
แต่สำหรับกรณีนี้ไม่ใช่ครับ.. ขอละ layer 18 เอาไว้สำหรับกรณีนี้
เพราะ layer 18 เป็นที่วางของ MovieClip ที่เปลี่ยนสีตามค่าที่ระบุใน XML อยู่ (ซึ่งในที่นี้มันคือพื้นหลังสุดตัวจริง)
ถ้าเรานำภาพพื้นหลังไปวางหลังส่วนนี้ ส่วนแสดงผลสีพื้นหลังนี้ก็จะบังภาพพื้นหลังไปเรียบอีกเช่นกัน
ในที่นี้ก็เลยต้องสร้าง layer ใหม่ขึ้นมาเหนือ layer 18 หนึ่งระดับครับ
โดยการคลิกที่ปุ่มตามที่เน้นกรอบสีเขียวเล็กๆ ในภาพ แล้วลากให้ layer ที่สร้างใหม่อยู่เหนือ layer 18 หนึ่งชั้น..ตามภาพ
(ผมเปลี่ยนชื่อ layer ที่สร้างใหม่เป็นชื่อ BACKGROUND นะครับ จะได้ดูง่ายๆ)
..อันนี้ไม่ต้องทำตาม แค่ดูและอ่านก็พอ
คือผมจะอธิบายว่า ..ดีพีเอฟแบ่งส่วนแสดงผลออกเป็นสองช่วงเวลาครับ
ช่วงแรกคือส่วนของการโหลด โหลด โหลด ก่อนที่จะแสดงผล ..อยู่ในช่วง frame ที่ 1-8
ช่วงที่สองคือส่วนของการแสดงผลจริง ..อยู่ในช่วง frame ที่ 9-16 (..ตามที่เน้นในภาพข้างบน)
ในที่นี้ผมตั้งใจว่า จะให้แสดงผลภาพพื้นหลังก็ต่อเมื่อเริ่มแสดงตัวหนังสือ (หมายถึงไอ้ตอนกำลังโหลด ไม่ต้องแสดงนั่นแหละ)
ก็เลยตั้งใจจะให้ภาพพื้นหลังแสดงอยู่ในเฉพาะ frame ที่ 9-16 เท่านั้นครับ
(หากต้องการให้ภาพพื้นหลังแสดงตั้งแต่เริ่มโหลด ก็ข้ามขั้นตอนนี้และขั้นตอนถัดไปได้เลย)
คลิกเบาๆ หนึ่งครั้งที่ layer BACKGROUND ที่เพิ่งสร้างขึ้นมาครับ บริเวณ frame ที่ 9 ตามภาพ
(ถ้าสังเกตุดีๆ จะเห็นตัวเลข 9 เล็กๆ ใกล้ๆ กับจุดที่เน้นเอาไว้ในภาพ
..นั่นคือเลขบอกตำแหน่งของ frame ที่สนใจอยู่)
กด F6 หรือคลิกขวาที่จุดนั้นแล้วเลือก Insert Keyframe (หรือ Insert Blank Keyframe ก็ได้)
จะเห็นว่าส่วนว่างๆ ของ layer นั้นถูกแบ่งแยกออกเป็นส่วนๆ ตามจุดที่กด F6 เอาไว้
เมื่อแบ่งส่วนของ frame ออกได้แล้ว ก็เริ่มเอาภาพมาใส่ได้เลยครับ
โดยการกดคีย์ลัด Ctrl + R หรือเลือกเมนู File / Import / Import to Stage ก็ได้
ก็จะปรากฏหน้าต่างให้เลือก file ที่ต้องการนำไปใส่ในไฟล์ .FLA ครับ
ในที่นี้ผมเตรียมภาพ Background-Image.gif เอาไว้แล้ว ขนาด 800×600 px
(ในที่นี้ภาพสีเขียวๆ สมมติว่าเป็นภาพพื้นหลังนะครับ..
ผมใช้ภาพพื้นหลังแบบนี้ก็เพราะพยายามลดขนาดภาพประกอบในบทความนี้..จะได้โหลดไม่ช้ามาก)
..ถ้าทำถูกต้อง ภาพประกอบก็จะมาปรากฏในตัวงานตามภาพ
สังเกตด้วยนะครับว่ามีสีเทาปรากฏใน layer BACKGROUND ใน timeline ส่วนหลัง
นั่นหมายถึงภาพพื้นหลังได้ถูกวางบน layer BACKGROUND แล้ว
มาจัดเรียงภาพพื้นหลังให้อยู่ตรงกลางกันสักหน่อย
ในที่นี้เลือกเครื่องมือโดยคีย์ลัด Ctrl + K หรือเมนู Window / Align
เมื่อหน้าต่าง Align ปรากฏขึ้นมาแล้ว ..ให้คลิกเลือกตรงที่ To stage: ที่เน้นไว้ตามภาพข้างบนด้วยนะครับ
(เป็นปุ่มที่จะใช้กำหนดวัตถุที่จะจัดเรียง ให้สัมพันธ์กับพื้นหลังหลักของการแสดงผล
ถ้าไม่คลิกส่วนนี้ การจัดเรียงจะไม่มีความหมายอะไรเลย)
คลิกเบาๆ ที่พื้นหลังที่ได้ import เข้าไปบน stage หนึ่งครั้ง
จากนั้นคลิกเลือกปุ่มที่เน้นตามภาพข้างบนทั้งสองปุ่มเลยครับ
..เมื่อคลิกทั้งสองปุ่มแล้ว ก็แปลว่าพื้นหลังของเราจัดเรียงตรงเป๊ะเป็นที่น่าพอใจแล้ว
..เมื่อเสร็จแล้วก็ Save
และไปที่เมนู File / Publish หรือกดคีย์ลัด Shift + F12 เพื่อ Publish ผลลัพธ์สุดท้ายออกมา
ก็จะได้ภาพพื้นหลังตามต้องการครับ
..คงไม่งงนะ 
(ป.ล. พูดถึงคำว่า “งง”
วันก่อนมีโอกาสได้นั่งดู tutorial สอนการแต่งภาพของเว็บสองหาว.. แล้วถูกใจมากเลยครับ
ไอเดียหนึ่งที่ชอบมากเลยคือการทำ tutorial กับการบันทึกกิจกรรมบนหน้าจอ / หน้าต่างโปรแกรมนั้นๆ เลย
(คือจับการกระทำบนหน้าจอมาเป็น video เลย)
จริงๆ ผมเคยมีโครงการจะทำมาหลายครั้งแล้ว ..เพียงแต่ด้วยโปรแกรมที่รู้จักมันก็ยังให้ประสิทธิภาพได้ไม่ดีเท่าไรนัก
พอได้เห็นแบบเนียนๆ แจ่มๆ ของเว็บสองหาวอย่างจริงจังแล้วเกิดไฟลุกโชนขึ้นมาอีกซะอย่างนั้นครับ
เอาไว้มีโอกาสจะหาวิธีทำให้ได้.. ซึ่งหวังลึกๆ ว่าผู้อ่านคงจะเข้าใจบทความของผมง่ายขึ้นกว่าทุกวันนี้
(ทุกวันนี้ผมยังได้รับการ comment ใน entry สอนทำสกินฮิห้าเป็นข้อความว่า “งง”, “ไม่เข้าใจ”, “ไม่รู้เรื่อง” อยู่เรื่อยๆ เลย ))
