Forgot Password ??

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

	Registered : 109,037

HOME > Mobile > [iOS/iPhone] Tutorials - สอนเขียน iPhone App ฟรี เขียน iPad App เรียน iPhone เขียนโปรแกรม iPhone > ตอนที่ 5 : โครงสร้าง Xamarin.iOS บน Visual Studio สร้าง View การเชื่อมโยง View ด้วย C#

ตอนที่ 5 : โครงสร้าง Xamarin.iOS บน Visual Studio สร้าง View การเชื่อมโยง View ด้วย C#

ตอนที่ 5 : โครงสร้าง Xamarin.iOS บน Visual Studio สร้าง View การเชื่อมโยง View ด้วย C# ในหัวข้อนี้เราจะมาเรียนรู้การสร้าง Apps บน iOS ด้วย Xamarin.iOS บน Visual Studio ที่ประกอบด้วย View (หรือเราเรียกเป็นทางการว่า View Controller) และจากบทความในตอนก่อนหน้าที่ เมื่อเราสร้าง Project แบบ Single View Application ค่า Default ที่โปรเจคให้มาจะเป็น Storyboard ที่ประกอบด้วย View จำนวน 1 View และ Class ที่มาพร้อม View ชื่อว่า RootViewController.cs

Xamarin.iOS C# Multi View

โดย Class นี้จะทำงานคู่กันกับ View (คล้าย ๆ กับ ASP.Net ที่มี .aspx และ aspx.cs) ซึ่ง Class นี้ถ้าไมไ่ด้ทำการเขียน Event หรือคำสั่งต่าง ๆ ก็ยังไม่จำเป็นจะต้องไปยุ่งกันมัน เพราะสามารถสร้าง UI บนหน้าจอ View ผ่าน Control ต่าง ๆ ที่มามาให้ได้เลย

และในกรณีที่ต้องการ View มากกว่าหนึ่ง View บน Storyboard ก็สามารถที่จะสร้าง View ต่าง ๆ ได้ตามจำนวนที่ต้องการ พร้อมกับจะสร้าง Class ขึ้นมาเพื่อทำงานคู่กับ View นั้น ๆ

กลับมายังโปรเจค Xamarin.iOS บน Visual Studio

Xamarin.iOS C# Multi View

ปัจจุบันบัน Storyboard ประกอบด้วย View (หรือจะเรียกว่า View Controller) จำนวน 1 View ซึ่ง View นี้จะทำงานคู่กับ Class ที่มีชื่อว่า RootViewController.cs

Xamarin.iOS C# Multi View

เมื่อคลิกที่ File's Owner (ไอคอนดังรูป) จะเห็นว่า View ปัจจุบันทำงานคู่กับ RootViewController

Xamarin.iOS C# Multi View

ให้เราสร้าง View ขึ้นมาอีกหนึ่งรายการ โดยคลิกที่ Control ที่ชื่อว่า View Controller โดยลากไปวางไว้บน Storyboard ดังรูป

Xamarin.iOS C# Multi View

ขั้นตอนนี้เมื่อเราได้ View แล้วเราจะต้องสร้าง Class เพื่อมาทำงานคู่กับ View ที่สองที่สร้างขึ้นมาใหม่ โดยคลิกขวาที่ Project เลือก Add -> New Item

Xamarin.iOS C# Multi View

เลือก Code -> iPhone View Controller ทดสอบตั้งชื่อว่า DetailViewController.cs

Xamarin.iOS C# Multi View

ได้ไฟล์ DetailViewController.cs เข้ามาใน Project

คลิกที่ File's Owner ของ View ที่สองและกำหนด Custom Class ให้เป็น Class ที่เราสร้างขึ้นมาใหม่คือ DetailViewController

Xamarin.iOS C# Multi View

ตอนนีเราได้ View ขึ้นมาจำนวน สอง View คือ

View แรกทำงานคู่กับ Class ของ RootViewController
View สองทำงานคู่กับ Class ของ DetailViewController

สร้าง Label ขึ้นมาทั้ง 2 View โดยใส่ Tex เป็น หน้าที่ 1 และ หน้าที่ 2 ดังรูป

Xamarin.iOS C# Multi View

ใน View แรกสร้าง Button มี Title คำว่า "Go View 2"

Xamarin.iOS C# Multi View

จากนั้นให้คลิกที่ Button ที่อยู่บน View แรก และกดปุ่ม Ctrl บน Keyboard ลากเส้นไปวางไว้บน View ที่สอง เลือก Segue แบบ Modal

Xamarin.iOS C# Multi View

จะเห็นว่าระหว่าง View แรกและ View สองจะมีเส้นที่ทำการเชื่อมโยง ซึ่งในวงการ iOS Devเราจะเรียกว่า Segue

Xamarin.iOS C# Multi View

สามารถคลิกที่ Segue เพื่อกำหนดรุปแบบการเปลี่ยนมุมมอง คล้ายๆ Effect บนโปรแกรม Power Point

ทดสอบการทำงานบน iOS Simulator

Xamarin.iOS C# Multi View

แสดง View แรก เมื่อคลิกที่ Button จะ Link ไปยัง View ที่สอง

Xamarin.iOS C# Multi View

แสดง View ที่สอง

จากตัวอย่างนี้จเห็นว่าการสร้าง View หลาย ๆ View บน Storyboard และการเชื่อมโยง View นั้นสามารถทำได้อย่างง่ายดาย โดยไม่ต้องทำการเขียน Code บน C# แม้แต่บรรทัดเดียว และจากตัวอย่างนี้ก็ยังไม่ได้ใช้ความสามารถของ Class (.cs) ที่สร้างไว้ และถ้าไม่มีการเขียน Code ก็ไม่จำเป็นจะต้องสร้าง Class เลย แต่การใช้งาน Class นี้จะเริ่มมีความสำคัญเมื่อต้องการให้หน้า View ทำงานแบบ Dynamic เช่นการรัยส่งค่า การสร้างเหตุการณ์ต่าง ๆ ที่จะเกิดขึ้นบนหน้าจอ View

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

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


	By :	ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ)
	Score Rating :
	Create/Update Date :	2014-10-22 21:36:36 / 2017-03-26 08:42:00
	Download :	No files

Sponsored Links / Related

ตอนที่ 1 : รู้จัก Xamarin สำหรับ iOS ติดตั้ง Xamarin เขียน iOS Apps ด้วย C# (.Net Framework)
Rating :

ตอนที่ 2 : รู้จัก Xamarin Studio IDE บน Mac OS การเขียน iOS บน Xamarin ด้วยภาษา C#
Rating :

ตอนที่ 3 : Mac Build Host เตรียมความพร้อม iOS Simulator สำหรับ Visual Studio (C#)
Rating :

ตอนที่ 4 : พื้นฐาน Xamarin.iOS บน Visual Studio การสร้าง Run/Project ของ iOS ด้วย C#
Rating :

ตอนที่ 6 : การสร้าง Event Handler และ UIAlertView ของ Xamarin.iOS บน Visual Studio C#
Rating :

ตอนที่ 7 : Xamarin.iOS กับ Visual Studio สร้าง Action Segue ส่งค่า Parameters ข้าม View (C#)
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
	ปรับแต่งเว็บให้โหลดเร็ว