# Add navigationBar with + button

## ใส่ชื่อแอพ เพิ่มปุ่มบวก

เรามาเพิ่มให้มี แถบด้านบนกันดีกว่า จะได้เตรียมไว้ทำหน้าเพิ่ม todo item ด้วย

![](https://1168329629-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGk7Utff0rVWsqK4eYO%2F-LHSoHVcLB-WptqXjXut%2F-LHSp6yaRynOoOnPw8Q2%2FScreen%20Shot%202018-07-15%20at%2019.04.49.png?alt=media\&token=ede06645-f351-4370-8d08-4510374cfcd6)

ขั้นแรกให้เราเลือกที่ ViewController ก่อน \
กดที่เมนู Editor -> Embed In -> Navigation Controller

![](https://1168329629-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGk7Utff0rVWsqK4eYO%2F-LGt8X7cAEvjgQ65xiCL%2F-LGt8ZuAeG6qD_MObFuD%2FScreen%20Shot%202018-07-08%20at%2016.05.11.png?alt=media\&token=b71f1b2e-52e0-4f07-90e2-5c6d14ece824)

เราจะได้ Navigation Controller มาหนึ่งอัน ชี้มาที่ ViewController

![](https://1168329629-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGk7Utff0rVWsqK4eYO%2F-LGt8X7cAEvjgQ65xiCL%2F-LGt8bGvoRy7-3hNaffW%2FScreen%20Shot%202018-07-08%20at%2016.06.03.png?alt=media\&token=b8c797e1-eaee-408f-813b-a77e263e95ec)

จากนั้นให้เราตั้งชื่อ โดยการเลือกที่ Navigation Item ของ ViewController ที่เพิ่มมา\
เลือก Attributes Inspector ใส่ Todo ลงใน Title property

![ตั้ง Title ใน Attributes Inspector](https://1168329629-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGk7Utff0rVWsqK4eYO%2F-LGt8X7cAEvjgQ65xiCL%2F-LGt8dgOqcMTl9UcZocL%2Faddnac.gif?alt=media\&token=58f110eb-cf30-44fd-baf4-55695d19c2b2)

เพิ่มปุ่ม Add โดยการลาก **Bar Button Item** จาก Object Library ไปที่มุมขวาของ Navigation Bar

เลือก **System Item** เป็น **Add** ปุ่มจะเปลี่ยนเป็นเครื่องหมาย +

![เพิ่มปุ่ม Add](https://1168329629-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGk7Utff0rVWsqK4eYO%2F-LGt8X7cAEvjgQ65xiCL%2F-LGt9UL_VIwqEqNDnmx8%2FaddAddButton.gif?alt=media\&token=b08a59f0-7df2-49ae-af7b-55ab89d6218f)

เมื่อรันแอพอีกครั้งจะได้หน้าตาแบบนี้

![](https://1168329629-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGk7Utff0rVWsqK4eYO%2F-LGt8X7cAEvjgQ65xiCL%2F-LGt9YqyJbftAPclG--8%2FScreen%20Shot%202018-07-08%20at%2016.12.14.png?alt=media\&token=4211ac0b-7d61-41df-9295-b5690c243953)
