BusyIndicator Control in Silverlight 4


Prerequisites

ในหน้าจอในการโหลดข้อมูล ถ้าเราไม่ต้องการให้ผู้ใช้งาน รู้สึกรอนานเกินไป ฉะนั้นในขณะรอการโหลดข้อมูลอยู่นั้น เราจะกระทำบางสิ่งบางอย่างเพื่อเบี่ยงเบนความสนใจของผู้ใช้งานออกจากการรอคอยนั้น หรือเพื่อบ่งบอกให้ใช้งานรู้ว่า มันกำลังทำงานอยู่ ไม่ได้นิ่งเฉย หรือแฮงค์ไปแล้ว และใน SL4 มีคอนโทรลชื่อ BusyIndicator สามารถนำมาใช้งานดังกล่าวได้ โดยเราต้องติดตั้งเพิ่มเติมจากชุดเครื่อง Silverlight 4 Beta Toolkit November 2009  และในบทความนี้ผู้เขียนขอใช้ตัวอย่างโปรเจ็กต์จากบทความ: Printing in Silverlight 4 ก่อนหน้านี้มาเป็นตัวอย่าง ประกอบครับ โดยเราจะออกแบบหน้าเพิ่มเติมสักเล็กน้อยดังนี้

 

เปิดโปรเจ็กต์ด้วย Expression Blend Preview for .NET 4 แล้วเปิดไฟล์ Home.xaml ขึ้นมา จากนั้นเข้าที่แทบ Assets> พิมพ์ bu เพื่อค้นหาชื่อคอนโทรลที่ชื่อมีตัวอักษร bu> เลือกคอนโทรล  BusyIndicator โดยดับเบิ้ลแล้ววางบนฟอร์มดังรูป

1

 

เราต้องการให้คอนโทรล BusyIndicator แสดงตอนโหลดข้อมูล และปิดมันเมื่อโหลดข้อมูลเรียบร้อยแล้ว ให้ไปใส่โค้ดในอีเวนท์ LoadingData และอีเวนท์ LoadedeData ของคอนโทรล คอนโทรล productsDomainDataSource  โดยการคลิกเลือกคอนโทรล productsDomainDataSource => เลือกหน้าต่าง Properties => แล้วดับเบิ้ลคลิกอีเวนท์ ดังรูป

2

 

ทีอีเวนท์ LoadingData เราให้แสดงคอนโทรล BusyIndicator โดยกำหนดพลอเพอร์ตี IsBusy = true  และที่อีเวนท์ LoadedeData เมื่อโหลดข้อมูลเรียบร้อยแล้ว เรากำหนดให้ปิดคอนโทรล BusyIndicator โดยกำหนดพลอเพอร์ตี IsBusy = false เพียงเท่านี้ก็เป็นอันเสร็จเรียบร้อย

3

 

จากนั้นทำการรันแอปพลิเคชัน เราจะได้หน้าจอ คอนโทรล BusyIndicator แสดง Please wait… และมี Progress bar วิ่ง แสดงการทำงาน

4

 

เมื่อโหลดข้อมูลเรียบร้อยคอนโทรล BusyIndicator จะถูกปิด

5

 

ตัวอย่างในชุดเครื่องมือ Silverlight 4 Beta Toolkit เมื่อเราทำการติดตั้งเรียบร้อย ให้เข้าไปรันตัวอย่างได้ตามพาธ D:Program FilesMicrosoft SDKsSilverlightv4.0ToolkitNov09Samples (เครื่องผมติดตั้งที่ Drive D:) แล้วดับเบิ้ลคลกรันไฟล์ default.htm เราจะได้ตัวอย่างหน้าจอคอนโทรล ดังรูป6

 

แหล่งข้อมูลดาวน์โหลด:
http://cid-7d608959d854cb28.skydrive.live.com/embedicon.aspx/SourcesCode/11-25-2009_Drag-DropDataBindingToSilverlight4_BusyIndicator.zip

 

แหล่งข้อมูลอ้างอิง:


Application Silverlight 4 Beta Toolkit November 2009 (Recommended default)

 

ผู้เขียน:
nano_mvp_2009_1

เกี่ยวกับ

Nuchit Atjanawat is a Microsoft MVP, GreatFriends Community Leader, WindowsITPro Columnist(Mr.Nano), Silverlight Business Application Instructor, Speaker in various Microsoft events, Author, passionate Blogger and a Software Engineer by profession. He has a very good skill over Silverlight, LightSwitch, C#, XAML & Blend. He shares his technical findings, tutorials in his technical blog. Follow his Blog and Facebook page to be updated on latest articles. - Technical Blog: https://janawat.wordpress.com - WindowsITPro Columnist(Mr.Nano): http://windowsitpro.net - The GreatFriends.Biz Community Discussion Board (nano): http://greatfriends.biz - witter: https://twitter.com/janawat - Facebook Page: https://www.facebook.com/nuchit - Instructor: http://bit.ly/GF250-01, http://bit.ly/GF150-02

เขียนใน Silverlight

ใส่ความเห็น

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / เปลี่ยนแปลง )

Twitter picture

You are commenting using your Twitter account. Log Out / เปลี่ยนแปลง )

Facebook photo

You are commenting using your Facebook account. Log Out / เปลี่ยนแปลง )

Google+ photo

You are commenting using your Google+ account. Log Out / เปลี่ยนแปลง )

Connecting to %s

In Archive
%d bloggers like this: