Category Archives: Technic

Swift String กับภาษาไทย

วันก่อนๆ มีคนโพสในกลุ่มของ iOS Dev Thai เกี่ยวกับปัญหาภาษาไทยของ swift string ว่ามันไม่สามารถค้นหาคำได้อย่างที่ต้องการ ยกตัวอย่างเช่น

จากตัวอย่างง่ายๆนี้จะเห็นว่า เราสามารถหาคำว่า “ชี” ได้  แต่ในขณะที่ “ช” ตัวเดียวนั้นกลับหาไม่เจอ

ว่าแต่ทำไม มันหาไม่เจอละ ?

ปัญหาของมันก็คือว่า Swift นั้นใช้ Grahpheme ซึ่งมันจะ เอา สระ วรรณยุกต์ และ ตัวอักษร มารวมเป็นตัวเดียวกัน คือพูดง่ายๆว่ามันนับตามช่องไฟของตัวอักษร

ถ้าหากเรานับจำนวนตัวอักษร มันก็จะนับได้แบบนี้

ก็จะเห็นว่า ไม่ว่าจะเป็น ก , กู , กู้ มันก็นับได้ 1 เหมือนกัน

ในภาษาจำพวกภาษาอังกฤษ ตัวอักษณ e กับ é เขามองเป็นตัวอักษรคนละตัวอักษร

จากโค้ดข้างบน มันก็ทำงานถูกละ เพราะ e กับ é มันคนละตัวอักษร

แต่ในกรณีของภาษาไทย  เราไม่ได้นับ ช กับ ชี เป็นตัวอักษรคนละตัวกัน แต่เราบอกว่า มันคือ

  • ช ที่มี สระ อี

ดังนั้นแล้ว มันจึงเกิดปัญหาว่า เมื่อใช้เมธอด อย่าง contains เนี่ย มันเจอ “ชี” แต่กลับไม่เจอ “ช” เพราะมันมองว่าเป็นคนละตัวกัน

เราจะแก้ปัญหานี้ยังไงดี

วิธีการแรก คือ ใช้เมธอด localizedStandardCompare เมธอดนี้ มีใช้ใน iOS9

เมธอดนี้ อาจจะแก้ปัญหาเรื่องที่ว่า มันหา “ช” ไม่เจอ

แต่ถ้าเราใช้เมธอดนี้ในการหา string มันก็อาจจะทำงานไม่ค่อยถูกมากนัก เพราะเมธอด มันทำการเปรียบเทียบ โดยที่ไม่สนใจ วรรณยุกต์ และ สระ

อย่างเช่นมี “ก” ตัวเดียว แต่ถ้าหาด้วย “กู้” มันก็จะบอกว่า เจอเหมือนกัน เช่นตัวอย่างนี้

 

วิธีการที่สองคือ เปรียบเทียบ ตาม character ไปทีละตัว โดยใช้เมธอด range(of:) แล้วก็กำหนด option ให้เป็น literal ซึ่งเราอาจจะเขียนออกมาเป็น extension ง่ายๆ แบบนี้

จะเห็นว่าผลลัพธ์นั้นให้ความถูกต้องมากกว่าวิธีการแรก
วิธีการแรก อาจจะเหมาะกับการค้นหาแบบ คร่าวๆ อย่างเช่นการ search แต่ถ้าหากต้องการผลลัพธ์ที่ถูกต้องวิธีที่สองน่าจะเหมาะสมกว่า

หวังว่าจะช่วยให้หลายคนหายสงสัยเกี่ยวกับ String ใน Swift นะครับ

Swift 3 @escapeing & @nonescape closure

วันก่อนๆ ได้โหลด XCode 8 มาใช้งานซึ่งมันก็มาพร้อมกับ Swift3 แน่นอนว่า ภาษามันเปลี่ยนแปลงไป ไม่ว่าจะเป็น ชนิดของข้อมูลแบบใหม่ หรือว่า syntax ภาษาใหม่ๆ และหนึ่งในนั้นคือ closure

ถ้าหากเคยเขียน โคลเชอร์ ใน Swift2 มา ก็อาจจะเห็น คีย์เวิร์ด @nonescape ผ่านตามาบ้าง

ใน Swift2 พารามิเตอร์ที่เป็นโคลเชอร์จะมีค่าเริ่มต้นเป็น escape closure ถ้าหากเขียน @nonescape กำกับไว้ ก็จะเป็นการบอกว่า closure นี้เป็น nonescape  อย่างไรก็ตาม keyword นี้ได้นำออกไปจาก Swift 3 เป็นที่เรียบร้อย เนื่องจากว่า ใน Swift3 นี้ได้กำหนดไว้ว่า โคลเชอร์มีค่าเริ่มต้นเป็น nonescape

ถึงตรงนี้หลายคนอาจจะเกาหัว แล้วร้องว่า What ? เชี่ยยยย อะไรเนี่ย .. nonescape closure , escape closure มันคืออะไรว่ะ ?

ใจเย็นๆ แป๊ะอย่าร้อง ผมจะอธิบายให้ฟังแบบง่ายๆก็แล้วกัน

closure ที่ถูกส่งเข้าเป็นพารามิเตอร์ในฟังก์ชัน ถ้า closure ถูกเรียกหลังจากทีฟังก์ชันทำงานเสร็จได้ เรียกว่า escape closure

เพื่อให้เห็นภาพง่ายๆ ว่า escape  คืออะไรก็ดูตัวอย่างต่อไปนี้ละกัน

สมมติว่า ผมเขียนฟังก์ชัน download ไฟล์รูป ซึ่งเรียกใช้ฟังก์ชัน loadData  ของ http ที่เป็น asynchronous call ประมาณนี้

เมื่อฟังก์ชัน loadData ทำงานเสร็จ ก็จะเรียกโคลเชอร์ completion  พร้อมกับส่ง image กลับไป

การทำงานของ completion ลักษณะแบบนี้ จะเรียกว่า escape เพราะว่า มันทำงานได้ แม้ว่า ฟังก์ชัน loadProfileImage จะทำการ return (แต่ http.loadData จะยังทำงานต่อไป และแน่นอนว่า completion ก็จะถูกเรียกหลังจากที่ http.loadData ทำงานเสร็จ) สรุปคือว่า แม้ว่า loadProfile จะทำงานเสร็จ มันก็ยังเรียก completion

โค้ดตัวอย่างที่เขียนไป สามารถทำงานได้ปกติใน Swift 2 เพราะ โคลเชอร์ได้กำหนดให้เป็น escape มาตั้งแต่แรกเริ่ม ไม่ต้องเขียนอะไรเพิ่มเติมทั้งสิ้น

แต่ถ้าหาก เอาโค้ดนี้ไปใช้งานกับ swift 3 ตัว  completion จะไม่ถูกเรียก เนื่องจาก ฟังก์ชัน loadProfileImage จะทำการ return ก่อน ที่ฟังชัน loadData จะทำงานเสร็จ (เพราะเป็น asynchronous ไม่ต้องรอให้ทำงานเสร็จก็ return ได้)

เมื่อ @nonescape ได้นำออกไป มันก็ถูกแทนที่ด้วย  @escaping

@escaping ใช้กำหนดให้โคลเชอร์เป็นแบบ escape คือทำงานได้แม้ว่าตัวฟังก์ชันที่เรียกมันจะทำงานเสร็จไปแล้ว

ดังนั้นหากเราต้องการให้มันเรียก completion หลังจากที่ loadData ทำงานเสร็จ ก็ต้องกำหนดให้เป็น @escaping ดังชั่นตัวอย่าง

และจะเห็นว่า @escaping นั้นเป็น Type ประเภทหนึ่ง เช่นเดียวกับ String , Int ไม่ได้เป็น parameter attribute  เหมือนอย่างแต่ก่อน

ทำไมต้อง non escape ?

Swift3 เปลี่ยนมาใช้ non escape closure ก็เพราะเรื่องประสิทธิภาพ รวมไปถึงการจัดการหน่วยความจำ เนื่องจากว่า non escape นั้น จะไม่ทำการเก็บ closure ไว้  ปัญหา retain cycle ก็น้อยลงไป  ข้อดีอีกอย่างคือเราไม่ต้องเขียน self ถ้าหาก closure เรียกฟังก์ชันของตัวเอง

นอกจากนี้แล้ว การเขียน closure ใน Swift3 นั้นจะไม่สามารถกำหนด argument label ได้

ยกตัวอย่างเช่นใน Swift2 เราอาจจะเขียนฟังก์ชั่น แบบนี้

แต่ใน Swift 3 จะแจ้งว่า error

untitled-2

เพราะใน Swift3 นั้น closure ได้กำหนดว่า ไม่ให้มี argument label ดังนั้นแล้ว เราจึงต้องเพิ่ม _ เข้ามาในโค้ด ดังเช่นตัวอย่าง

ลองทำความเข้าใจ และศึกษา Swift3 , Closure กันครับ หวังว่าจะช่วยให้หลายคนเข้าใจ closure มากขึ้น

Class and Struct

เขียน Swift ไปสักพัก ก็น่าจะพอรู้แล้วแหละว่า ในภาษา Swift มันมี  class , enum , struct   ทั้งสามอย่างนี้เพื่อเก็บข้อมูล แต่หลักๆ ที่มันแตกต่างกัน คือ enum และ struct นั้นเป็น value type ส่วน class นั้นเป็น reference type

Continue reading Class and Struct

Custom UI and Easy to customize

เมื่อเขียนโปรแกรม ios ไปเรื่อยๆสักระยะหนึ่ง สิ่งหนึ่งที่โปรแกรมเมอร์แบบเราๆ จะต้องเจอแน่ๆ นั่นก็คือ custom ui หรือการปรับแต่งหน้าตาของโปรแกรม ให้มันดู cool นั่นเอง .. ก็แน่นอนว่า วิธีที่ง่ายสุดในแต่งปรับแต่งนั่นก็คือ ให้คนอื่นทำให้เรา (แต่มันคงเป็นไปได้ยาก ใช่ม่ะ) อะๆๆ งั้นมาลองวิธีที่ง่ายกว่านั้น และนั่นก็คือ การไปใช้ ui control ของคนอื่นที่เค้าเขียนไว้แล้ว (แน่นอนละใครจะอยากไปเขียนเองให้เหนื่อย ถูกม่ะ) อย่างในเวป cocoacontrol.com ก็มีหลายอย่างให้เลือกใช้งาน

แต่ถ้ามันไม่มีละ ? (นั่นไง ซวยละ) .. สุดท้ายมันก็หนีไม่พ้นที่จะต้องเขียน custom control ถูกป่ะ ?

ผมเชื่อว่าหลายๆคน คงจะเคย custom ui กันมาแล้วแน่นอน อย่างเช่น UIButton หรือ UITableViewCell ใช่ม่ะ ถ้าใครยังไม่เคยก็คงต้องบอกว่าคุณยังไม่ใช่ iOS Dev ที่แท้จริง .. อันที่จริงการ ปรับแต่ง หรือสร้าง  control พวกนี้มันก็ไม่ใช่เรื่องยากอะไรเท่าไหร่ แต่ว่า พวก control ที่เราสร้างขึ้นมา มันมักจะปรับแต่งไม่ง่าย standard ui ที่มาพร้อมกับ XCode  เพราะว่า ui เหล่านั้น แค่ลากวาง แล้วก็กดเปลี่ยน property ใน inspector เป็นอันเสร็จพิธีเลยถูกต้องม่ะ

อย่างในรูปด้านล่างนี่ ถ้าอยากจะเปลี่ยนสีปุ่ม ก็แค่กดเปลี่ยนสีก็จบ ไม่ต้องเขียนโค้ดให้เหนื่อยเลย ให้ตายสิโรบิ้น

button

แต่ถ้าหากเป็น ui control ที่เราสร้างขึ้นมาเองละ ?

เช่น สมมติว่า เขียน control ที่เป็น ปุ่มแบบโค้งมน เราก็อาจจะเขียน control ได้ประมาณนี้

เมื่อนำไปใช้ใน Storyboard หลังจากลาก Button วางแล้ว ก็ต้องเปลี่ยนให้เป็นคลาสที่เราได้สร้างไว้

button

ถ้าให้โปรแกรมทำงาน  มันก็จะได้แบบนี้

round_button

ปัญหาก็คือว่า ถ้าเราอยากจะเปลี่ยนสีของ ขอบ ปรับขนาดของเส้นรอบๆ จะทำยังไง โดยที่ไม่ต้องไปแก้ไขโค้ด ?

เราสามารถที่จะทำให้มันมี property ปรับง่ายๆเหมือนอย่าง standard ได้ไหม ?

ผมบอกเลยว่า “ได้”

วิธีการนั้นไม่ยากเลย แค่ใช้ IBDesignable และ IBInspector เข้ามาช่วย

ซึ่งโค้ดที่ปรับใหม่ ก็จะมีลักษณะแบบนี้

เมื่อพิจารณาจากโค้ด เราได้บอกว่า คลาส RoundButton นั้นรองรับ Interface Builder และ มี inspector ทั้งหมด 3 ตัวที่สามารถปรับแต่งได้ นั่นก็คือ Border Color , Border Width และ Corner Radius

ซึ่งถ้าหากเราใช้คลาสที่สร้างขึ้นใหม่นี้ ก็จะเห็นว่า จากที่มันแสดงผลใน storyboard แบบไม่มีเส้นขอบโค้งๆ แต่ตอนนี้มันแสดงได้แล้ว

ok_button

และถ้าเข้าไปดูใน inspector ก็จะเห็นว่า มี property ใหม่เพิ่มขึ้นมา  3 อย่างด้วยกัน

prop

เป็นไง มันช่าง F**King DAMN Cool ไหมละ ?

คราวนี้อยากจะปรับอะไรก็ทำใน Storyboard ได้เลยทันที ไม่ต้องไปแก้ code ให้มันเสียเวลา

Pimp my command line

อาทิตย์ก่อนๆ ผมมีเพื่อนใหม่ชื่อ Christ มาจากเยอรมัน เค้าเป็น DevOps ซึ่งต้องใช้พวก command line  เยอะมาก ในระหว่างที่ผมไปนั่งดูเค้าทำงาน ก็ได้เหลือบไปเห็น Terminal ที่เค้าใช้ ซึ่งมันสวยงามมาก จนต้องร้อง … เจ๋งงงง !!!!!

Untitled-9

Terminal ใน Mac ที่เค้าใช้งานนั้น มันดู Damn Cool !!! มาก และต่างจากของผมมากมาย  .. นั่นแหละจึงเป็นที่มา ทำให้ผมต้องเขียนบทความนี้

หลายคนอาจจะยังไม่รู้จัก Terminal หรือ Command line ก็ไม่เป็นไร แต่ผมเชื่อว่าถ้าเขียนโปรแกรมไปสักพักหนึ่ง .. จะต้องได้ใช้ command line หรือ terminal อย่างแน่นอน และการใช้ command line interface  (ต่อไปนี้ขอเรียกว่า CLI) .. มันจะทำให้คุณดูเท่ห์ โคตรคูลลล .. จาก noob จะดูเป็น pro ขึ้นมาทันที

การใช้ terminal มันก็เปรียบเหมือนๆกับการใช้ hot key กด skill รัวๆ ในตอนเล่นเกมส์ มันย่อมเร็วกว่าลากเมาส์ไปกด icon เพื่อปล่อย skill ใช่ไหมละ ? นั่นแหละ เราถึงต้องมาหัดใช้ terminal กัน (ฟังดูอาจจะไม่เกี่ยวกันม่ะ แต่ก็ช่างมันเถอะ) แต่ .. เดี๋ยวก่อน .. เนื้อหาที่ผมจะเขียนต่อไปนี้ ไม่ใช่การหัดใช้ terminal แต่จะเป็นการปรับแต่ง ดังนั้นแล้ว ถ้าไม่เคยใช้มาก่อนเลย ผมแนะนำให้ไปฝึกใช้งานก่อน ซึ่งหาข้อมูลได้ทั่วไปจาก internet หรือจะอ่านจาก https://leanpub.com/lets_learn_cli_right_now/read  ก็ได้ และเนื่องจาก Mac OX นั้นมีพื้นฐานมาจาก BSD ดังนั้นคำสั่งต่างๆ มันก็เหมือนใน linux , unix นั่นแหละครับ ใช้กันได้

และที่เราต้องปรับแต่งก็เพราะว่า CLI ที่เราใช้ๆ กันอยู่ใน mac ถึงแม้ว่ามันจะดีกว่า CLI บน windows แต่เมื่อเทียบกับ unix หรือ linux แล้วมันก็ไม่ cool ไม่แจ่ม ประการที่สองถ้าเรามี terminal ที่ดูดี อลังการงานสร้าง และทำได้งานได้ดีกว่า CLI เดิม มันก็ดีกว่าใช่ม่ะ ?

Terminal App

ก่อนจะไปปรับแต่ง เราต้องทำความเข้าใจเกี่ยวกับ terminal ก่อน อย่างที่รู้ๆกันว่า ถ้าหากอยากจะใช้ CLI ใน Mac OSX นั้นสามารถทำได้ด้วยการเปิด Terminal ขึ้นมา โดยทั่วๆไปแล้ว เมื่อเปิดโปรแกรมขึ้นมาก็จะเจอหน้าตาของ  Terminal ประมาณนี้

01_basic

ดูๆแล้ว มันก็เห่ยๆ ไม่มีสีสันเอาซะเลย งั้นเราจะเพิ่มสีสันให้มันซะหน่อย ซึ่งโปรแกรม Terminal นี้สามารถปรับแต่ง color scheme สีสันของตัวอักษรต่างๆได้ จากเมนู preference

perference

เช่น ผมปรับเป็น  Ocean ก็จะได้หน้าตา สีสันแบบนี้

peref

 

จากสีขาวดำ .. ก็เปลี่ยนเป็นสีฟ้า แจ่มใสแล้ว .. เพียงเท่านี้ เราก็จะได้ Terminal สีสันแจ่มๆแล้ว ..  เป็นไงครับ Cool ไหม ?

Are-You-Fucking-Kidding-Me-Rage-Face-Meme-Temp

 

อ้าวเปลี่ยน color scheme ได้นี่ยังไม่คูลอีกเหรอ ..

แหม่ .. ถ้าจะปรับแค่นี้ คงไม่ต้องมาเขียนบทความนี้ให้เมื่อยหรอก เพราะใครๆก็ปรับได้

Shell

มันไม่ใช่ หอย หรือปั้มน้ำมันที่เราคุ้นเคย แต่อย่างใด ที่เราจะพูดถึงกันก็คือ Shell ในคอมพิวเตอร์ ซึ่ง Ken Thomson ได้พัฒนาขึ้นมาเป็นคนแรก ตั้งแต่ปี  1971 ( ลุง Ken คือหนึ่งในผู้พัฒนา Unix ) นับตั้งนั้นมา ก็มี shell หลายอย่างเกิดขึ้นมามากมาย ซึ่งหนึ่งในนั้นก็คือ bash และมันก็ได้เป็น shell หลักของ linux และ Mac OS X

ZSH

อย่างที่ได้บอกไปว่า bash เป็น shell มาตรฐานของ Mac OS X โดยทั่วๆไปมันก็ทำงานได้ดี แต่ว่ามันมี shell อื่นๆ ที่ดีกว่า bash ตั้งเยอะ และที่จะนำเสนอต่อไปนี้ก็คือ  zsh shell นั่นเอง มันฟีเจอร์เจ๋งๆกว่า bash เยอะ เช่น

  • cd completion
  • spell correction
  • git plugin
  • useful tab key.

นอกจากฟีเจอร์ต่างที่ดีกว่า bash แล้ว อีกเหตุผลหนึ่งที่ควรจะเปลี่ยนไปใช้ zsh ก็เนื่องจาก bash ตัวใหม่ล่าสุด .. มันเก่ามากกกกกกกกก เก่าแค่ไหนนะเหรอ …. มันก็ตั้งแต่ปี 2007

02_oldShell

เดี๋ยวๆๆๆๆ นะ .. bash ตัวใหม่ล่าสุด แต่เก่ามาก ? .. ถูกกกกกกก ต้อง ถ้านับเวลาตั้งแต่ปี 2007 จนถึงปีนี้ 2015 ก็ 8 ปีแล้วมั้ง .. จริงๆแล้ว bash มีการปรับปรุงพัฒนามาเรื่อย และตอนนี้ version 4.2 เป็นตัวล่าสุด .. อ้าวววววววว แล้วทำไม Apple ไม่เปลี่ยนไปใช้ bash ตัวใหม่ นั่นก็เพราะ bash 4.3 นั้นใช้ GPL license v.3 ซึ่งแอปเปิ้ลไม่ต้องการจะใช้  GPL license v.3 ดังนั้นแล้ว bash ตัวใหม่ล่าสุดที่ยังเป็น GPL ตัวเก่า หรือ v.2 อยู่นั้น ก็คือ รุ่น 3.2 นั่นแหละ ฟังดูย้อนแย้งดีม่ะ

เอาละเล่าประวัติศาสตร์มาซะเยอะ .. มาเปลี่ยนใช้ zsh กันดีกว่า โดยเราจะใช้  oh my zsh ซึ่งเป็น zsh configuration ที่นิยมใช้อย่างกว้างขวาง

วิธีการติดตั้งก็สุดแสนจะง่ายดาย ทำได้ด้วยคำสั่ง

จากนั้นก็ปล่อยให้มันโหลด และลงโปรแกรม

03_install

เมื่อลง oh my zsh เรียบร้อย ก็จะเจอข้อความบอกดังนี้

04_install

จากนั้นก็ให้ออกจาก Terminal และเปิดเข้ามาใหม่ ก็จะเห็นความเปลี่ยนแปลง โดยดูได้จากที่ shell prompt ของเราจะเปลี่ยนเป็นแบบนี้

promp

หากเจอแบบนี้ก็แสดงว่าตอนนี้เราได้เปลี่ยนไปใช้ zsh shell แล้ว ถ้าลองใช้คำสั่งง่ายๆเช่น ls ก็จะเห็นว่า zsh นั้นได้แสดงความแตกต่างระหว่าง folder กับ file ด้วยการใช้สีเป็นตัวแยกให้ด้วย ผิดกับ bash ที่ใช้สีเดียวกัน

compare

นอกจากจะเพิ่มสีสั้นให้กับโฟลเดอร์และไฟล์แล้ว zsh ยังมีความสามารถในการแสดง git branch และ status  ได้อีกด้วย แจ่มสุดๆ

07_Git

ZSH Theme

นอกจาก git สีสันของโฟลเดอร์และไฟล์แล้ว ความเจ๋งของ zsh มันยังไม่หมด เพราะเราสามารถเปลี่ยน theme ได้อีกด้วย และมันก็มีหลาย theme ให้เลือกมากมาย เข้าไปดูได้ที่

https://github.com/robbyrussell/oh-my-zsh/wiki/themes

เช่น them ที่ชื่อว่า pygmalion

theme2

วิธีการเปลี่ยน theme สามารถทำได้ด้วยการแก้ไขไฟล์ .zshrc ที่อยู่ในโฟรเดอร์ home ของเรา ใครถนัดใช้ VI ก็เปิดไฟล์แก้ไขได้เลย หรือถ้าชอบใช้ textEdit , sublime ,  textMate แก้ไขก็ทำได้ด้วยคำสั่ง open ดังเช่น

เมื่อเปิดไฟล์ .zshrc แล้ว ก็แก้ไข theme ตามใจชอบ (ตรงที่ไฮไลท์ไว้) และรายชื่อ theme ก็ดูได้จาก link ที่ให้ไว้

text_edit

 

เท่านี้ก็จะเพิ่มความ cool ของ zsh ได้อย่างมากมาย แต่…มันยังไม่หมด .. เพียงเท่านี้

Customize zsh

ไหนๆ ก็ไหนละ เราจะทำให้ zsh มันดู โคตร cooooool  จนต้องร้อง Holy Cow !!! ซึ่งสิ่งที่เราจะทำก็คือ

  1. ใช้ zsh theme ที่ชื่อว่า agnoster
  2. ใช้ Solarized Dark colorscheme
  3. ใช้ Powerline font
  4. เปลี่ยนไปใช้ iTerm แทน Terminal
  5. เพิ่มสีสันให้ไฟล์ และโฟลเดอร์

Step 1

อย่างแรกคือเปลี่ยนไปใช้ zsh theme ที่ชื่อว่า agnoster ซึ่งถ้าเราเปลี่ยนไปใช้ theme นี้พร้อมกับใช้ terminal color scheme ที่ชื่อ Basic แล้วก็จะได้ผลดังนี้

terminal

จะเห็นว่ามันอ่านไม่ออกว่าอะไรเป็นอะไร ถ้าหากเปลี่ยนใช้ IR Black ก็พออ่านได้บ้าง

term3

แล้วมัน cool ตรงไหน ?

Step 2

ใจเย็นๆ ตอนนี้มันยังไม่ cool ก็เพราะว่า agnoster นั้นถูกปรับมาใช้กับ color scheme ที่ชื่อ Solarized Dark ดังนั้นก็ไปโหลด color scheme สำหรับ Terminal กันได้ที่ https://github.com/altercation/solarized  หลังจากที่โหลดไฟล์ zip มาแล้ว ก็จะเข้าไปดูที่โฟลเดอร์  osx-terminal.app-colors-solarized จะเห็น color scheme สำหรับ terminal ก็ให้กดเปิดไฟล์ หรือจะ import ไฟล์ เข้ามาก็ได้

solarize

เมื่อให้ terminal เปลี่ยนมาใช้ solarized color แล้วก็จะได้ผลดังนี้

08_No_Font

Step 3

เมื่อดูจาก terminal แล้วก็จะเห็นว่า zsh shell ของเรานั้น ตัวอักษร บางตัวมันยังแสดงไม่ได้ นั่นก็เพราะว่า theme นี้ต้องการ font ที่เป็น powerline  ซึ่งฟ้อนต์ประเภทนี้จะมีการแก้ไขเพิ่มอักรพิเศษเข้ามา ซึ่งสามารถโหลดได้จาก

https://github.com/powerline/fonts

ผมแนะนำฟ้อนต์ Meslo หรือถ้าใครชอบ  Menlo ก็โหลดได้ที่

https://github.com/abertsch/Menlo-for-Powerline

เมื่อโหลดฟ้อนต์ เสร็จ ก็ปรับฟ้อนต์ใหม่ ก็จะได้ terminal ที่แสดงผลได้ถูกต้องแล้ว (ในตัวอย่างนี้ ใช้ฟ้อนต์ Menlo Powerline 12 pt.)

09_Font

อะ ฮ้าาาาา เป็นไง … มันเริ่มดู cool แล้วใช่ม่ะ ?

Step 4

ในตอนนี้ มันก็ เกือบจะ cool แต่เมื่อสังเกตดูจะเห็นว่า สีสันของ ลูกศร สีเหลือง ด้านขวา มันยังเพี้ยนๆ อยู่ นั่นก็เพราะว่า Terminal ของเรานั้น แสดงผลของ ANSI Color ได้แค่ 16 สี ( scheme color ที่ import เข้ามานั้น คนละอย่างกับ ANSI ) วิธีการที่จะทำให้ Terminal ของเราแสดงสีได้มากกว่า 16 สีนั้น คือ เปลี่ยนไปใช้ iTerm2 ซึ่งเป็นเป็น terminal ที่ดีกว่า (ดีกว่า .. อีกแล้ว)

เมื่อโหลด iTerm เสร็จแล้ว ก็จัดการเพิ่ม scheme color เข้ามาได้จาก preference > color ซึ่ง solarized color scheme ที่เราโหลดมาก่อนหน้านี้ก็มีให้อยู่แล้ว และเมื่อจัดการติดตั้ง scheme เสร็จ เปิด iTerm ใหม่ ก็จะได้ terminal ที่สุด cool ละ

10_install_iterm

Step 5

ต่อท้ายให้อีกนิด ตอนนี้มันก็ดู cool กว่าเดิมละ แต่ว่าเมื่อเราใช้คำสั่ง ll หรือ ls แล้วมันยังแยกความแตกต่าง ระหว่างไฟล์และโฟลเดอร์ยากอยู่ ก็อย่างที่เห็น ตัวหนาคือ folder ส่วนตัวหนังสือ ธรรมดาคือ file ถ้าเป็นสีแดง หมายถึง shell script

ls_color

เราจะเพิ่มสีสันให้กับ ls ด้วยการเปิดไฟล์ .zshrc และเพิ่มบรรทัด

เข้าไปต่อท้ายไฟล์

จากนั้นเมื่อเรียกใช้ ls หรือ ll ก็จะเห็นความแตกต่างแล้ว

final

เป็นไงละทีนี้ เจ๋งงงง ยัง

Before and After

จากขั้นตอนต่างๆที่เราได้ทำไปทั้งหมดนั้น เราได้เปลี่ยนจาก Terminal ของเดิม

default

ให้กลายเป็น Terminal สุด cool !!!!! เรียบร้อยละ

11_Directory

เท่านี้จาก noob ก็จะเปลี่ยนเป็น pro แล้ว