โปรแกรมเมอร์ มีความสุข เกิดสมาธิ จากการเขียนโค้ด โปรดักทิวีตี้เพิ่มขึ้น ตอนที่ 2


บทความจาก นิตยสาร WindowsITPro (December – January 2014)
ได้ขออนุญาตทางบก. เรียบร้อยแล้ว

เมื่อวันที่ 26 พฤศจิกายน 2556 ที่ผ่านมา
ณ ห้องบอลรูม โรงแรมแชงกรีลา บางรัก กรุงเทพฯ
ไมโครซอฟต์ได้จัดงาน
Microsoft TechDays Thailand 2013
ซึ่งเป็นงานสัมมนาที่ Microsoft จัดขึ้นทุกๆ ปี
ที่คนอยู่ในวงการเทคโนโลยี และนักพัฒนาให้ความสนใจ
ในงานดังกล่าว ได้เปิดตัวผลิตภัณฑ์ใหม่ของ Microsoft ดังนี้>

  • Windows Server 2012 R2,
  • System Center 2012 R2,
  • Windows 8.1 Enterprise,
  • Windows Azure และ
  • Visual Studio 2013


รูปที่1:
Microsoft TechDays Thailand 2013

ซึ่งผมได้รับเกียรติจาก ไมโครซอฟท์ ให้บรรยายหัวข้อ
What’s new for developers in Visual Studio 2013
ซึ่งเป็นการพูดถึงฟีเจอร์ใหม่ที่มาใน Visual Studio 2013
ที่เน้นเรื่อง Productivity ของนักพัฒนาเป็นหลัก
สำหรับท่านที่สนใจข้อมูล สามารถเข้าไปโหลดสไลด์
และสคริปในการบรรยายหัวข้อดังกล่าวได้จาก

Blog โปรแกรม ซอฟต์แวร์
ในบทความ: What’s new for developers in Visual Studio 2013
และในบทความตอนที่2 นี้
ผมจะพาคุณผู้อ่านไปรู้จักฟีเจอร์ Enhanced Scrollbar
ซึ่งเป็นอีกหนึ่งฟีเจอร์ที่ช่วยให้นักพัฒนา
สามารถเขียนโค้ดโปรแกรมได้อย่างราบรื่น มีความสุข
และ เมื่อคุณทำงานอย่างมีความสุข คุณจะเริ่มมีสมาธิ
เมื่อคุณมีสมาธิ จะเริ่มมีสิ่งดีๆ ตามมา

สิ่งดีๆ
นั่นคือ ความสุข สงบในใจของคุณ
> ความสุข ที่คุณ ไม่ต้องไปพึ่งใคร
> ความสุข ที่คุณ ไม่ต้องค้นหา
> ความสุข ที่คุณ สามารถสัมผัสได้ด้วยตัวเอง
> ความ สุข จาก การ ทำ งาน
ความสุข เกิดขึ้น ได้อย่างไรนั้น ลองติดตามดู

Enhanced Scrollbar
ความแตกต่างของฟีเจอร์แรก
และ มองเห็นได้อย่างชัดมากที่สุด ฟีเจอร์หนึ่ง
ใน Visual Studio 2013 คือ Enhanced Scrollbar
ถ้าไฟล์โค้ดของคุณมีขนาดใหญ่ ฟีเจอร์นี้
จะช่วยให้คุณ ดูโค้ดส่วนอื่นๆ ได้อย่างง่ายดาย

  • โดยที่คุณ ไม่ต้องออกจากหน้าต่าง Editor
  • โดยที่คุณ ไม่ต้องไล่ดูลงไปในเนื้อซอร์สโค้ด
  • ในขณะที่คุณกำลังเขียนโค้ด คุณสามารถเห็นสถานกาณ์ต่างๆ
    ในโค้ดของคุณผ่าน Scroll bar ทันที เช่น
    • เมื่อคุณมีการแก้ไขโค้ด:
      • คุณจะเห็นเครื่องหมาย สีเหลืองปรากฏ
      • เพื่อให้คุณทราบว่ามีการแก้ไข ได้เกิดขึ้น
    • หากมีข้อผิดพลาด:
      • คุณจะเห็นเครื่องหมาย สีแดงปรากฏ
      • คุณรู้ทันทีว่า ณ จุดใหนของซอร์สโค้ด มีปัญหา

จุดสี บน Scrollbar
บน Scrollbar จะมีการระบายจุดสี
เพื่อบ่งบอกถึงสถานการณ์ของโค้ดโปรแกรมของคุณ ดังนี้

  • สีเขียว: เป็นการบอกตำแหน่ง ของโค้ดที่เคยมีการแก้ไข
    และผ่านการ Build ไปเรียบร้อยแล้ว
    คุณสามารถรู้ได้ทันทีบน Scroll bar
  • สีเหลือง: เป็นการบอกตำแหน่ง โค้ดในการแก้ไขครั้งล่าสุด
    ในขณะปัจจุบันที่กำลังเขียนโค้ด ที่ยังไม่ผ่านการ Build
    คุณสามารถรู้ได้ทันทีบน Scroll bar
  • สีส้ม: เป็นการบอกคุณว่า ณ ตำแหน่งใหนของโค้ด
    ทีมี Message ที่คุณกำลังค้นหา
    โดย Message ดังกล่าวจะถูกไฮไลท์สีด้วย
    คุณสามารถรู้ได้ทันทีบน Scroll bar เช่น
    • ดังรูปที่2 ค้นหา Message “Page”
    • บน Editor จะไฮไลท์ โค้ดที่มีคำว่า Page
    • บน Scroll bar ระบายจุดสีส้ม ณ ตำแหน่งของโค้ดที่มีคำว่า Page อยู่
  • สีเทาเข้ม: เป็นการบอกคุณว่า ณ ตำแหน่งใหนของโค้ด
    ที่คุณวาง Bookmark ไว้บ้าง คุณสามารถรู้ได้ทันทีบน Scroll bar
  • สีแดง: เป็นการบอกคุณว่า ณ ตำแหน่งใหนของโค้ด
    ที่มี Error บ้าง คุณสามารถรู้ได้ทันทีบน Scroll bar
  • เส้นสีฟ้า: เป็นการบอกคุณว่า ตอนนี้ ตำแหน่ง Cursor อยู่ที่ใหน
    คุณสามารถรู้ได้ทันทีบน Scroll bar
  • สีน้ำตาล: เป็นการบอกคุณว่า ณ ตำแหน่งใหนของโค้ด
    ที่คุณได้วาง Breakpoint บ้าง คุณสามารถรู้ได้ทันทีบน Scroll bar เช่นกัน
    โดยจุดสีต่างๆ แสดงดังรูปที่2


รูปที่2:
จุดสี บน Scrollbar

จากรูปที่2
กล่าวได้ว่า Scroll bar จะเป็นตัวรายงานสถานะของซอร์สโค้ดบน Editor
ให้คุณทราบตลอดเวลา ณ ขณะที่คุณกำลังเขียนโค้ด

  • โค้ดตรงจุดใหน ที่เคยมีการแก้ไข และผ่านการ Build ไปเรียบร้อยแล้ว
  • โค้ดจุดตรงใหน ที่เคยมีการแก้ไข และยังไม่ผ่านการ Build
  • คุณวาง Bookmark, วาง Breakpoint ไว้ ณ จุดใหนของซอร์สโค้ดบ้าง
  • ซอร์สโค้ดของคุณ จุดใหนที่มี Error

คุณสามารถเห็นได้ทันที จาก Scroll bar
โดยคุณไม่ต้องเสียเวลาในการไล่ดูลงไปในเนื้อซอร์สโค้ด
ซึ่งช่วยให้คุณประหยัดเวลาได้มากในการเขียนโค้ด
จะไม่มีอะไรไปรบกวนความคิดคุณ
ให้หลุดหายไปจาก Flow ที่คุณกำลังคิด
ที่คุณกำลังเขียนโปรแกรม ความคิด และความอ่านของคุณ
จะไหลลื่นเป็นน้ำท่อประปาแตก ไม่มีอะไร จะไปฉุดควาคิดคุณได้
งานคุณจะเสร็จเร็วขึ้น นั่นคือ Productivity ของคุณจะสูงขึ้น

Scroll Bar Options
คุณสามารถเข้าไปปรับ Scroll Bar Options
ให้แสดงตามความชอบใจ ซึ่งสามารถเข้าได้ 3 ทางคือ

  1. คลิกขวาบน Scroll Bar
  2. ค้นหาในช่อง Quick Launch (Ctrl+Q)
  3. เข้าทางเมนู TOOLS=> Options…

1. คลิกขวาบน Scroll Bar
คุณสามารถปรับ Option ของ Scrollbar ได้โดย=>
คลิกขวาบน Scroll bar เลือก Scroll Bar Options… ดังรูปที่3


รูปที่3:
ทางเข้า Scroll Bar Options (1)

2. ค้นหาในช่อง Quick Launch (Ctrl+Q)
ค้นหาในช่อง Quick Launch
ให้พิมพ์ “Scroll bar” =>
คลิก Text Editor =>
All Languages =>
Scroll Bars ดังรูปที่4


รูปที่4:
ทางเข้า Scroll Bar Options (2)

3. เข้าทางเมนู TOOLS=> Options…
ในหน้าต่าง Option บนช่อง Search Option (Ctrl+E)
ให้พิมพ์ Scroll =>
แล้วคลิก Scroll Bars ดังรูปที่ 5

รูปที่5: ทางเข้า Scroll Bar Options (3)

จากทางเข้า 3 ทางดังกล่าวจะนำคุณเข้าสู่ หน้าต่าง Scroll Bar Options ดังรูปที่6

รูปที่6:
Scroll Bar Options

จากรูปที่6:
กล่าวได้ว่า

  • Show horizontal scroll bar: แสดง scroll bar ในแนวนอน
  • Show vertical scroll bar: แสดง scroll bar ในแนวตั้ง
  • ในกล่อง Display
    • Show annotations over vertical scroll bar: แสดงคำอธิบายประกอบบน scroll bar
    • Show changes: ระบายจุดสี เมื่อมีการเปลี่ยนแปลงโค้ด
    • Show marks: ระบายจุดสี เมื่อมีการ marks ในโค้ด เช่น Bookmark, Breakpoint
    • Show errors: ระบายจุดสี เมื่อมีการ Error
    • Show caret position: แสดงเส้นตำแหน่ง cursor
  • ในกล่อง Behavior
    • Use bar mode for vertical scroll bar: บาร์โหมด
    • Use map mode for vertical scroll bar: แมปโหมด
    • Show Preview Toltip: แสดงตัวอย่าง Toltip
      • Source overview: แสดงขนาดพื้นที่ของ Map mode

Scroll bar mode
Scroll bar คุณสามารถดูได้ 2 โหมด คือ

  1. Bar mode: แสดงเฉพาะแท่ง Bar และจุดสีต่างๆ
  2. Map mode: แท่ง Bar จะขยายกว้างขึ้น แล้วซอร์สโค้ดของคุณอยู่ภายใน เหมือนคุณมองจากที่สูง เหมือนคุณดูแผนที่ใน Google พร้อมกับแสดงจุดสีต่างๆ

1. Bar mode
ในการเปลี่ยน Bar mode คุณสามารถทำได้ง่ายๆ ดังนี้=>
คลิกขวาบน Scroll Bar เลือก Scroll Bar Options…=>
ในกล่อง Behavior=>
เลือก Use bar mode for vertical scroll bar
ซึ่งเป็นดีฟอลต์ที่ Visual Studio 2013
เลือกไว้อยู่แล้ว ดังรูปที่7
คุณจะเห็นเฉพาะแท่ง bar และจุดสีต่างๆบนแท่ง bar เท่านั้น
รูปที่7 Bar mode

2. Map mode
เปลี่ยน Map mode ทำได้โดย=>
คลิกขวาบน Scroll Bar เลือก Scroll Bar Options…=>
ในกล่อง Behavior=>
เลือก Use map mode for vertical scroll bar
คุณจะเห็น Scroll bar จากเป็นเพียงแท่ง bar จะขยายกว้างขึ้น
เปลี่ยนเป็นพื้นที่แสดงซอร์สโค้ดเล็กๆ แทน
พร้อมจุดสีต่างๆ เหมือนคุณกำลังดูแผนที่บน Google ดังรูป
รูปที่8 Map mode

ใน Map mode ถ้าคุณติ๊กถูก (CheckBox)
Show Preview Tooltip ตอนคุณนำ Cursor Mouse ไปบน Map bar
มันจะแสดงหน้าต่างขึ้นมา โดยจะขยายซอร์สโค้ดในส่วนที่ Cursor Mouse ชี้อยู่
เพื่อให้คุณทราบว่า ณ ตำแหน่งนั้นโค้ดคืออะไร?
(เหมือนคุณซูมกล้องส่องทางไกล ไปในจุดนั้น มันจะแสดงรายละเอียดให้คุณเห็นมากขึ้น)

ดังรูปที่9


รูปที่9
Preview Toltip

ใน Map mode นั้นคุณสามารถขยายพื้นที่ Map
ตามความชอบ ได้โดยการปรับแต่งที่ Source overview:
โดยเลือกขนาดจาก DropDownList
โดยดีฟอลต์ Visual Studio 2013
จะเลือก Source overview: เป็น Medium มาให้ ดังรูปที่10
รูปที่10 Source overview

ฟีเจอร์ Enhanced scrollbar
จะทำให้คุณมีตา เหมือนตานกอินทรีย์
ซึ่งสายตาอันเฉียบคมของนกอินทรีนั้น
สามารถมองไปได้ไกล เหมือนกล้องส่องทางไกล
และแม้จะบินอยู่บนที่สูง ก็จะมองเห็นเหยื่อตัวเล็กๆ
บนพื้นล่างได้อย่างง่ายดาย
และบินโฉบลงมาจับกินได้อย่างรวดเร็ว ทันที

คุณจะมองเห็นโค้ด
ของคุณได้อย่างง่ายดาย ในแบบนั้นเลย
แม้ไฟล์โค้ดของคุณจะมีขนาดใหญ่มาก
หลายหมื่น หลายแสนบรรทัดก็ตาม
เมื่อโค้ดของคุณมีความผิดพลาด ณ จุดใดใน Editor
คุณสามารถเห็นสถานการณ์นั้นบน scrollbar ทันที
คุณเพียง ดับเบิ้ลคลิกบนจุดสีนั้น
มันจะนำคุณกระโดดไปยัง จุดโค้ดเจ้าปัญหาทันที
โดยที่คุณไม่ต้องสลับหน้าต่าง ไปที่อื่น
โดยที่คุณไม่ต้องค้นหารายละเอียด
ลงไปในเนื้อซอร์สโค้ด แต่อย่างใด

Enhanced scrollbar
ช่วยให้คุณประหยัดเวลา
ช่วยให้คุณเขียนโค้ดได้เร็วขึ้น ช่วย
ให้คุณเขียนโค้ดได้อย่างราบรื่น
> เมื่อคุณเขียนโค้ดได้อย่างราบรื่น
> คุณจะเริ่มมีความสุข ในการเขียนโปรแกรม
> เมื่อคุณทำงานอย่างมีความสุข
> สมาธิคุณจะเริ่มเกิดขึ้น
> เมื่อสมาธิคุณเกิด
> Productivity ของคุณ ก็จะเพิ่มขึ้น

ความสุขนั้น
อยู่ตรงหน้าคุณ ตลอดเวลา
เหมือน อากาศธาตุ ที่อยู่รายรอบตัวคุณ

จงหายใจเข้า เพื่อ
นำความสุข ความสว่าง
เข้าสู่ตัวคุณ

และหายใจออก เพื่อ
คลาย ความทุกข์ ความมืดดำ
ออกไปจากตัวคุณ

จงใช้แสงสว่าง
นำทางชีวิตของคุณ ไปสู่เป้าหมาย
แสงสว่างเท่านั้น
ที่จะทำให้คุณเห็นความสวยงาม สองข้างทาง

จงเขียนโค้ดของคุณ อย่างมีความสุข
เมื่อคุณมีความสุข
คุณจะทำงาน โดยไม่ต้องทำงาน

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

ตอนที่ 1

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

เขียนใน Visual 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: