Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,036

HOME > Mobile > [iOS/iPhone] Tutorials - สอนเขียน iPhone App ฟรี เขียน iPad App เรียน iPhone เขียนโปรแกรม iPhone > เริ่มต้นการสร้าง Project ของ iPhone และ iPad บน Xcode การทดสอบ Run บน iOS Simulator

เริ่มต้นการสร้าง Project ของ iPhone และ iPad บน Xcode การทดสอบ Run บน iOS Simulator

เริ่มต้นการสร้าง Project ของ iPhone และ iPad บน Xcode การทดสอบ Run บน iOS Simulator หลังจากที่เราได้เตรียมพร้อมทั้งการมีเครื่อง Mac และ ติดตั้งโปรแกรม Xcode เรียบร้อยแล้ว บทความนี้จะเริ่มต้นจริงกับ Xcode การเริ่มสร้าง Project ของ iOS ที่จะเขียนโปรแกรมบน iPhone และ iPad พร้อมทั้งการสร้าง Application แสดงข้อความง่าย ๆ และการทดสอบรันโปรแกรมที่เราเขียนบน iOS Simulator ซึ่งเป็นโปรแกรมจำลองสภาพแวดล้อมของเครื่อง iPhone หรือ iPad ที่มาพร้อมกับ Tools ของ Xcode

ก่อนการเขียน App บน iOS จะอธิบายเพิ่มเติมเกี่ยวกับ iPhone และ iPad ว่าในการสร้าง Project Xcode นั้นเราจะต้องทำการเลือกว่าจะพัฒนา App สำหรับ iPhone หรือสำหรับ iPad หรือจะสร้าง Project ที่ครอบคลุมการทำงานได้ทั้ง 2 อุปกรณ์ ซึ่งในการเขียน App ให้รองรับทั้ง 2 ตัวนั้นจะต้องเขียนหน้าจอ Interface ทั้ง 2 แยกกันและทำออกเป็น 2 หน้าจอ ดูตัวอย่างข้างล่างเพื่อความเข้าใจ

เปิดโปรแกรม Xcode จาก Dock หรือเรียกจาก Applications -> Xcode

Xcode Create Project iPhone iPad

เลือก "Create a new xcode project" เพื่อเริ่มต้นการสร้าง Project

Xcode Create Project iPhone iPad

ในหน้าจอนี้จะเห็นว่า Xcode สามารถเขียนได้ทั้ง iOS (iPhone, iPad) และ OS X (โปรแกรมบนเครื่อง Mac)

ให้เราเลือก iOS -> Application -> Single View Application

โดยเราจะทดสอบสร้าง App แบบง่าย ๆ ที่มีหน้าจอเดียว

Xcode Create Project iPhone iPad

ขั้นตอนนี้นี้จะเป็นการกำหนดชื่อ Project และรายละเอียดอื่น ๆ ของ Project

จุดที่สำคัญ ในขั้นตอนนี้เราจะเห็นว่ามีให้เลือก Devices เราสามารถเลือกสำหรับ iPhone หรือ iPad หรือจะกำหนดเป็น Universal (ได้ทั้ง 2 รูปแบบ)

Xcode Create Project iPhone iPad

ขั้นตอนนี้จะเป็นการกำหนด Path ของ Project โดยผมเลือกจัดเก็บไว้ที่ Desktop

หลังจาก Create Project เรียบร้อยแล้ว เราจะพบกับหน้าจอของ Tools Xcode ดังรูป ซึ่งจะประกอบด้วยหลัก ๆ อยู่ 3 ส่วนคือ

Xcode Create Project iPhone iPad

1. Navigator View เป็นส่วนโครงสร้างของ Project ซึ่งจะประกอบด้วยหลาย ๆ ไฟล์ที่เกี่ยวข้องกัน
2. UI User Interface View เป็นส่วนหน้าจอในการออกแบบ User Interface ต่าง ๆ สำหรับการแสดงผล
3. Utilities View เป็นส่วนของโปรแกรมและเครื่องมือที่จะใช้ออกแบบ ปรับแต่งคุณสมบัติต่าง ๆ User Interface

สำหรับโครงสร้างของไฟล์ต่าง ๆ ผมจะขออธิบายในหัวข้อถัดไป แต่สิ่งที่เราจะเห็นและสังเกตุคือในโครงสร้างของไฟล์จะมีไฟล์ที่ชื่อว่า ViewController_iPhone.xib ซึ่งไฟล์นี้จะเป็น UI Interface สำหรับแสดงผลบน iPhone เราสามารถออกแบบ Desugn UI ได้จากไฟล์นี้

Xcode Create Project iPhone iPad

ภายใต้ ViewController_iPhone.xib เราจะได้หน้าจอว่าง ๆ ดังภาพ ภายใต้ Object ให้เราลาก Label ไปวางไว้ในหน้าจอ Design ของ iPhone

Xcode Create Project iPhone iPad

หลังจากได้ Label ให้คลิกที่ Label และปรับแต่งคุณสมบัติโดยคลิกที่ตำแหน่ง (Show Attribute inspector) เหมือนในรุปภาพประกอบ

Xcode Create Project iPhone iPad

จะเห็นว่าเราสามารถแก้ไขข้อความใน Label และปรับแต่งคุณสมบัติอื่น ๆ เช่น Size และ Color ของ Label

หลังจากที่เราลองสร้างข้อความบน Label แบบง่าย ๆ แล้ว เราจะมาทดสอบการรันโปรแกรมบน iPhone Simulator

Xcode Create Project iPhone iPad

จะเห็นว่าในส่วนของการรันโปรแกรมจะมีให้เลือก iOS Devices ว่าจะทดสอบบน Simulator สำหรับ iPhone หรือว่า iPad (ส่วน Version ของ iOS เราสามารถอัพเดดได้จาก App Store)

Xcode Create Project iPhone iPad

คลิกเลือก iPhone 6.0 Simulator สำหรับทดสอบ App บน iPhone

Xcode Create Project iPhone iPad

จากนั้นคลิกที่ปุ่ม Run หรือ Start

Xcode Create Project iPhone iPad

ในครั้งแรกโปรแกรมจะใช้การโหลดประมาณ 30-60 วินาที และจะแสดงผลลัพธ์ที่เราได้ออกแบบไว้ในหน้าจอ Design

ถ้าผลลัพธ์สามารถแสดงผลบน Simulator ได้ ก็แสดงว่าการติดตั้ง Xcode และการเขียนโปรแกรมบน iOS นั้นสมบูรณ์ เราสามารถที่จะเริ่มเขียนโปรแกรมอื่น ๆ ที่มีความซับซ้อนยิ่งขึ้นได้

เพิ่มเติม

Xcode Create Project iPhone iPad

การย่อโปรแกรม Xcode และ Simulator สามารถเรียกได้จากมุมล่างขวาของหน้าจอ

Xcode Create Project iPhone iPad

ใน Desktop จะเห็นชื่อโฟเดอร์ของ Project ของเรา

Xcode Create Project iPhone iPad

เมื่อคลิกเข้าไปก็จะพบกับไฟล์ของ Project และในการนำโปรเจคไปยังเครื่องอื่น ๆ ก็สามารถทำการ Copy ทั้งโฟเดอร์นี้ได้ในทันที

Xcode Create Project iPhone iPad

การเปิดโปรเจคเดิมสามารถเรียกจาก Recent ที่เราเคยเปิดไว้แล้ว หรือดับเบิ้ลคลิกที่ไฟล์ในโฟเดอร์ที่จัดเก็บไว้ได้เช่นเดียวกัน

.

ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท

ลองใช้ค้นหาข้อมูล


	By :	ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ)
	Score Rating :
	Create/Update Date :	2012-10-07 19:12:52 / 2017-03-25 23:25:03
	Download :	No files

Sponsored Links / Related

รู้จักกับ Project แต่ล่ะตัวของ Xcode ที่ใช้ในการเขียน iOS บน iPhone และ iPad
Rating :

สอน Windows Phone การเขียนโปรแกรม Windows Phone 7 และ 8

สอน Java GUI การเขียนโปรแกรม ภาษา Java GUI

Free Tutorial

	สอน Google Maps Api
	สอน Windows Service
	สอน Entity Framework
	สอน Android
	สอน Java เขียน Java
	Java GUI Swing
	สอน JSP (Web App)
	iOS (iPhone,iPad)
	Windows Phone
	Windows Azure
	Windows Store
	Laravel Framework
	Yii PHP Framework
	สอน jQuery
	สอน jQuery กับ Ajax
	สอน PHP OOP (Vdo)
	Ajax Tutorials
	SQL Tutorials
	สอน SQL (Part 2)
	JavaScript Tutorial
	Javascript Tips
	VBScript Tutorial
	VBScript Validation
	Microsoft Access
	MySQL Tutorials
	-- Stored Procedure
	MariaDB Database
	SQL Server Tutorial
	SQL Server 2005
	SQL Server 2008
	SQL Server 2012
	-- Stored Procedure
	Oracle Database
	-- Stored Procedure
	SVN (Subversion)
	แนวทางการทำ SEO
	ปรับแต่งเว็บให้โหลดเร็ว