Visual Studio LightSwitch change font


จากบทความ Visual Studio LightSwitch Default NewEditeScreen: http://bit.ly/vBEc7V
เราได้ทิ้งท้านกันไว้ว่า จะไปกำหนดฟอนต์ ให้หน้าจอ Create New Customer…
ที่เราสร้างขึ้น…เพื่อให้ข้อมูลภาษาไทย…แสดงขนาดใหญ่ขึ้น…อ่านง่ายขึ้น…โดยไม่ต้องพึ่งแว่นขยาย

บทความนี้เราจะไปเปลี่ยนฟอนต์ให้คอนโทรลต่างๆ บนหน้าจอ Create New Customer…
image
รูป CreateNewCustomer Screen Designer

เนื่องจากว่าด้วยตัวเครื่องมือ Visual Studio LightSwitch (VSLS) ยังไม่ซัพพอร์ต การเปลี่ยนฟอนต์
ผ่านหน้าจอการออกแบบ ฉะนั้นเราจึงต้องออกแรงนิดหน่อย ในการเขียนโค้ด เพื่อใส่ฟอนต์ให้มัน
วิธีการดังนี้

  • หมายเลข(1) เปิดหน้าจอ CreateNewCustomer
  • หมายเลข(2) เข้าไปเขียนโค้ด โดยคลิกลงบนเมนู Write Code
  • หมายเลข(3) คลิก CreateNewCustomer_Created

image

คุณผู้อ่านจะเข้าสู่หน้าต่างการเขียนโค้ด…
โดย VSLS เตรียมเมธอดให้เรียบร้อย…ว่าผู้อ่านต้องเขียนโค้ดที่ใหน…
image

การเข้าถึงคอนโทรลต่างๆ บน VSLS จะใช้เมธอด FindControl() และ…
แนบ(attaching) อีเว้นต์ ControlAvailable เพื่อการเข้าถึง และตั้งค่าตัวคอนโทรล…
การ Attach อีเว้นต์ ControlAvailable ทำดดนการพิมพ์เครื่องหมาย += แล้วกดปุ่ม TAB บนคีย์บอร์ด

image

VSLS จะสร้างอีเว้นต์ CreateNewCustomer_ControlAvailable(…) ให้เราอัตโนมัติ

image

จากนั้นไปหาชื่อคอนโทรล ไปใส่ในเมธอด FindControl(“ชื่อคอนโทรล”)

image

แล้วเขียนโค้ดให้สมยูรณ์ดังนี้:…

โค้ดดิ้ง:

 1: partial void CreateNewCustomer_Created()
 2:         {
 3:             // Write your code here.
 4:             //สร้างอีเว้นต์ ControlAvailable
 5:             this.FindControl("CustomerID").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 6:             this.FindControl("CompanyName").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 7:             this.FindControl("ContactName").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 8:             this.FindControl("ContactTitle").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 9:             this.FindControl("Address").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 10:             this.FindControl("City").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 11:             this.FindControl("Region").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 12:             this.FindControl("PostalCode").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 13:             this.FindControl("Country").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 14:             this.FindControl("Phone").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 15:             this.FindControl("Fax").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(CreateNewCustomer_ControlAvailable);
 16:    
 17:         }
 18:  
 19:         void CreateNewCustomer_ControlAvailable(object sender, ControlAvailableEventArgs e)
 20:         {
 21:             //throw new NotImplementedException();
 22:  
 23:             //แปลงค่าอีเว้นต์อาร์คิวเมนต์คอนโทรล เป็น Windows Control
 24:             var ctr = (System.Windows.Controls.Control)e.Control;
 25:             if (ctr != null)// ถ้าเป้นคอนโทรล
 26:             {
 27:                 //ใส่ฟอนต์ใหม่ให้มัน
 28:                 ctr.FontFamily = new System.Windows.Media.FontFamily("Tahoma");
 29:                 //กำหนดขนาดตัวอักษร
 30:                 ctr.FontSize = 16;
 31:             }
 32:         }

เมื่อเขียนโค้ดเสร็จแล้ว…รันโปรแกรม…
ลองแก้ไข…
จะเห็นว่าหน้าจอ Create New Customer แสดงตัวอักษรภาษาไทยที่อ่านได้ง่ายขึ้น…

image

ลองกดเมนูเพิ่มข้อมุลใหม่…
เช่นกันหน้าจอ Create New Customer ก็แสดงผลถาษาไทยได้น่าพึงพอใจ…

image

–:จบบริบูรณ์:–


ผู้เขียน

clip_image019

** รู้จักกับผู้สอน อ.นุชิต **
JANAWAT Blog: https://janawat.wordpress.com
Nuchit’s Profile @microsoft
https://mvp.support.microsoft.com/profile/nuchit
Facebook:
https://www.facebook.com/nuchit
Twitter:
http://twitter.com/janawat

Advertisements
เกี่ยวกับ

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

Tagged with:
เขียนใน LightSwitch
One comment on “Visual Studio LightSwitch change font
  1. Ser พูดว่า:

    ขอบคุณมากครับ ทำเป็นรูปภาพเกี่ยวกับเรื่อง studio แล้ว อ่านดูง่ายดูครับ

ใส่ความเห็น

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: