|
|
สร้างโปรเจ็ก สำหรับ Silverlight 2
ด้วย Visual Studio 2010 (VB)
|
1. เปิด VisualStudio 2010 แล้วเลือกเมนู File -> New -> Project -> Visual Basic
-> Silverlight
2. แล้วเลือก Silverlight Application
|
|
|
3. เราตั้งชื่อโปรเจ็กว่า Silverlight1 เมื่อเรากด OK แล้ว
โปรแกรมจะขึ้นไดอะลอกถามว่า ต้องการสร้างเพียงโปรเจ็ก Silverlight เพียว ๆ หรือ
ต้องการให้ผนวกโปรเจ็กนี้เข้าไปในเว็บ ASP.NET ด้วยเลย
สำหรับตัวอย่างนี้เราจะเลือกผนวกเข้าใน ASP.NET และตั้งชื่อว่า Silverlight1.Web
เมื่อเราคลิก OK โปรแกรมก็จะสร้าง โซลูชั่น ซึ่งจะมีทั้งไฟล์ในฝั่ง Client
และในฝั่ง Server ให้พร้อมกันในทีเดียว
เมื่อเรากด "Build" แล้ว VisualStudio จะคอมไพล์โปรแกรมของเรา และนำไปใส่ไว้ใน
โปรเจ็กเว็บเซิร์ฟเวอร์ของเราโดยอัตโนมัติ โดยจะสร้างหน้า Silverligh1TestPage.aspx และหน้า
Silverligh1TestPage.html ให้โดยอัตโนมัติ (โปรแกรม Silverlight รันได้กับเว็บเซิร์ฟเวอร์ทุกชนิด แม้แต่บน
Apache และหน้า Html ที่เราจะใส่ Silverlight เข้าไป ก็เขียนได้จากภาษาใดก็ได้ เช่น
PHP,Java ,Python,Ruby)
มีไฟล์อะไรบ้างใน Silverlight เมื่อเราสร้างโปรเจ็กเสร็จใหม่ เราจะได้ไฟล์
Page.xaml และ App.xaml และไฟล์ภาษา (C# หรือ VB ที่่เราได้เลือกไว้)
เป็นไฟล์ที่เรียกว่า Code Behide Class file ซึ่งจะคู่กันกับไฟล์ .xaml เช่น (vb
คือ Visual Basic)
Page.xaml คู่กับไฟล์ Page.xaml.vb
App.xaml คู่กับไฟล์ App.xaml.vb
ไฟล์ XAML คือ ไฟล์ XML ชนิดใหม่ เอาไว้สำหรับเขียนกำหนด หน้าตา
ของโปรแกรม สำหรับ silverlight หรือ WPF App.xaml ใช้เขียนเพื่อเก็บ resource
ที่จะใช้ร่วมกันทั้งโปรแกรม เช่น Brush(แปรงสี) หรือ Style App.xaml.vb ใช้เขียน
เพื่อทำงานตอนที่เกิด Event (เหตุการณ์) ต่าง ๆ ที่เกี่ยวกับโปรแกรม เช่น
Application_Startup , Application_Exit ,Application_UnhandledException Page.xaml
ใช้เขียนกำหนดหน้าตา UI ของโปรแกรม โดยเราจะเขียนว่ามี UI Control
ใดบ้างที่อยู่บนหน้าโปรแกรม และเชื่อมไปยัง Page.xmal.vb เมื่อเกิด event บน UI
เหล่านั้น
ตั้งแต่ตอนแรกที่คอมไพล์โปรเจ็กเสร็จ VS 2001 จะคอมไพล์หน้า
Page.xmal ออกมาเป็นคลาส .NET ครึ่งหนึ่ง และคอมไพล์ Page.xmal.vb อีกครึ่งหนึ่ง
แล้วนำมารวมเป็นคลาสเดียวกัน เช่นเดียวกัน คอมไพล์และรวมไฟล์ App.xaml และ
App.xmal.vb รวมเป็นอีกหนึ่งคลาส รวมได้ 2 คลาส แล้วเอามาแพ็กรวมกัน เป็นไฟล์
ClientBin/Silverlight1.xap
ไฟล์ .xap (อ่านว่า แซ๊บ) ได้ย่อขนาดมาแล้ว ด้วยวิธี Zip ดังนั้นจึงได้ขนาดที่เล็ก
การนำโปรแกรมที่ได้ไปรันบนเว็บ ก็คือ ปะแท็ก ไฟล์ .xap (อ่านว่า แซ๊บ)
ได้ย่อขนาดมาแล้ว ด้วยวิธี Zip ดังนั้นจึงได้ขนาดที่เล็ก
การนำโปรแกรมที่ได้ไปรันบนเว็บ ก็คือ ปะแท็ก บนหน้าไฟล์ Html (ไม่ต้องใช้
JavaScript) แล้วชี้ไปที่ไฟล์ .xap ง่าย ๆ แค่นั้น โปรแกรมที่เราเขียนขึ้นจะรันได้
ทั้งบน IE(Internet Explorer),FireFox ,Safari,etc) และบน Windows, Mac, Linux
Silverligh1TestPage.html
Silverligh1TestPage.aspx
มาใส่ Control และทำ Event กัน
ให้เปิดไฟล์ Page.xaml ขึ้นมา เราจะเพิ่มปุ่ม โดยเลือกคอนโทรล Button
วาดลงบนหน้าต่าง (Windows)
การสร้างเหตุการณ์ประจำตัวคอนโทรล ให้ดับเบิลคลิกที่ตัว คอนโทรลได้โดยตรง
เพื่อกำหนดให้ VS2010 สร้างเหตุการณ์ Button1_Click()
จะปรากฏ method ชื่อดีฟอลท์ว่า Button1_Click ขึ้นที่ไฟล์ Page.xaml.vb
ให้เราเขียนคำสั่งใน Method
นั้นว่า Button1.Content = "Pushed" เข้าไปดังรูป
ทดสอบการทำงาน
เมื่อเรากดปุ่ม (Button)
ข้อความบนปุ่มจะเปลี่ยนเป็น "Pushed"
|
|
|
|
|
|
|