จากบทความ
Visual Studio LightSwitch DataGrid Change Font Style
คุณผู้อ่านได้ทราบแล้วว่า
LightSwitch(LS) เวอร์ชั่น 1 (Visual Studio LightSwitch 2011)
ยังไม่รองรับการเปลี่ยนฟอนต์ ผ่านหน้าจอออกแบบ
แต่ก็พอจะมีวิธีการเปลี่ยนมันบ้างพอสมควร
เพียงว่าต้องลงแรงสักเล็กน้อยเท่านั้น
เช่น
- การปรับ Font Style เป็น Heading1:
https://janawat.wordpress.com/2011/12/25/visual-studio-lightswitch-datagrid-change-font-style/ - การปรับ Font โดยการเขียนโค้ด:
https://janawat.wordpress.com/2011/12/27/visual-studio-lightswitch-change-font/ - การปรับเปลี่ยนฟอนต์โดยการสร้างธีมใหม่ ซึ่งเป็นเนื้อหาที่กำลังจะกล่าวในบทความต่อไปนี้
ซึ่งในสองวิธีแรกการเปลี่ยนฟอนต์ดังกล่าว
ก็พอจะทำให้คุณผู้อ่านสามารถใช้ LS
สร้างโปรแกรมที่สนับสนุนภาษาไทย
แต่มีข้อเสียคือ คุณผู้อ่านต้องทำทีละหน้าจอ(Screen)
เป็นการเปลืองพลังงานพอสมควร
สิ่งที่จำเป็น
- Visual Studio Professional 2010 (or higher) with SP1
- Visual Studio LightSwitch 2011
- Visual Studio 2010 SP1 SDK
- LightSwitch Extensibility Toolkit
เราไปดูการเปลี่ยนฟอนต์โดยการ สร้างธีมกันบ้าง
ดังนี้:
สร้างโปรเจ็กต์
1. สร้างโปรเจ็กต์ LS ด้วย Extensibility แล้วเลือกภาษาที่ถนัด
ตั้งชื่อโปรเจ็กต์ตามต้องการ ในที่นี้ใช้ชื่อ JanawatTheme
2.เมื่อกด OK คุณผู้อ่านจะได้โครงสร้างโปรเจ็กต์ดังรูป
3.จากนั้นคลิกขวาบนโปรเจ็กต์
JanawatTheme.Lspkg => เลือก Add => เลือก New Item…
4. เลือกไอเทม Theme=> ตั้งชื่อธีมตามต้องการ
ในที่นี้ใช้ JanawatTheme (ชื่อเดียวกับโปรเจ็กต์)
5.VSLS จะพาคุณผู้อ่านเข้าไปที่โปรเจ็กต์ JanawatTheme.Client
โฟลเดอร์ Presentation => Themes
คุณผู้อ่านจะเห็นธีม JanawatTheme.xaml
ซึ่งเป็นไฟล์ XAML กำหนดสไตล์ของคอนโทรลนั่นเอง
6.เมื่อคุณผู้อ่านเปิดดูไฟล์ JanawatTheme.xaml จะเห็นว่า
ฟอนต์ค่าเริ่มต้น(Default) คือ Segoe UI, Arial
ขนาดฟอนต์เริ่มต้น 11
เปลี่ยนฟอนต์ใหม่
7.เปลี่ยนฟอนต์ใหม่ตามที่ต้องการ
โดยการเปลี่ยนชื่อฟอนต์ ???FontFamily และ
ถ้าต้องการเปลี่ยนขนาด
สามารถใส่ตัวเลขที่ต้องการลงไปใน ???FontSize
ปล. ??? เป็นชื่อของสไตล์ เช่น
NormalFontFamily, Heading1FontFamily เป็นต้น
การเปลี่ยนฟอนต์ โดยการแทนที่(Replace)
- โดยการ Copy Segoe UI, Arial
- แล้วกดปุ่ม Ctrl+H บนคีย์บอร์ด
- ว่าง Segoe UI, Arial ในช่อง Find what:
- พิมพ์ Tahoma ในช่อง Replace with
- เราจะกระทำเฉพาะในไฟล์ (JanawatTheme.xaml) นี้เท่านั้น
- หลังจากนั้นแทนทีทั้งหมดในไฟล์นี้โดย
การกดปุ่ม Replace All
8. เปลี่ยนฟอนต์เรียบร้อย
การติดตั้ง Extensions
9. หลังจากนั้น Build Solution 1 ครั้ง
ให้เปิดไปที่โฟลเดอร์ของโปรเจ็กต์ JanawatTheme.Vsix
เพื่อติดตั้ง Extensions ธีมของเราเข้าไปบน VSLS
10. เข้าไปที่โฟลเดอร์ JanawatTheme.Vsix\bin\Debug
แล้วเปิดไฟล์ JanawatTheme.vsix เพื่อติดตั้ง
11. หน้าต่าง Visual Studio Extension Install คลิก Install
12. ติดตั้งเรียบร้อย
13.จากนั้นเปิดโปรเจ็กต์เก่าที่เคยสร้างไว้ หรือ
สร้างโปรเจ็กต์ใหม่ ในที่นี้เป็นการเปิดโปรเจ็กต์เก่า
ที่เคยสร้างไว้แล้ว
เปิดใช้งานธีม
14.คลิกขวาบนโปรเจ็กต์ => properties
บนหน้าจอการออกแบบ=>คลิกแทบ Extensions
ติ๊กเลือก JanawatTheme
15. คลิกแทบ General Properties
คลิกดรอปดาวน์ Theme เลือกธีม JanawatTheme
16. รันโปรแกรม ทดสอบภาษาไทย
จะเห็นว่าภาษาไทยตัวอักษรใหญ่ขึ้น
17.ลองปรับเปลี่ยน Label
แสดงเป็นภาษาไทย
18. จะเห็นว่าทั้งหน้าจอ
แสดงผลภาษาไทยได้ดียิ่งขึ้น
ทั้งคอนโทรลบน DataGrid, Label หรือ TextBox
โดยที่เราไมาต้องเขียนโค้ด
จะเห็นว่าในวิธีที่สาม การสร้างธีม
เราสามารถเปลี่ยนฟอนต์ ได้ทั้งโปรแกรม
เพียงแค่กำหนดเปิดใช้ธีม
ที่เราทำการปรับฟอนต์เรียบร้อยแล้วเท่านั้น
คุณผู้อ่านก็จะมีความสุขมากขึ้นในการสร้างโปรแกรมด้วย LS
แหล่งข้อมูลดาวน์โหลด:
- JanawatTheme Theme – SkyDrive: http://bit.ly/wzlyfQ
แหล่งข้อมูลอ้างอิง:
- Walkthrough: Creating a Theme Extension:
http://msdn.microsoft.com/en-us/library/hh290139.aspx
No comments:
Post a Comment