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 > iOS/iPhone Web View (UIWebView) Open Web Site and HTML (Objective-C, iPhone, iPad)

iOS/iPhone Web View (UIWebView) Open Web Site and HTML (Objective-C, iPhone, iPad)

iOS/iPhone Web View (UIWebView) Open Web Site and HTML (Objective-C, iPhone, iPad) สำหรับ Web View บน iOS เป็น Object ที่ใช้งานง่าย ๆ ที่ทำหน้าที่สำหรับการแสดงข้อมูลจาก URL ของเว็บไซต์ ในรูปแบบของ Web Browser โดยสามารถเรียกข้อมูลจากเว็บไซต์มาแสดงบนหน้าจอ App ได้แบบง่าย ๆ โดยเครื่อง Smartphone นั้น ๆ จะต้องทำการเชื่อมต่อกับ Internet ด้วย และ Simulator ของ iOS ก็ไม่ต้องทำการ Set ค่าอะไรเพิ่มก็สามารถเชื่อมต่อได้ทันที และความสามารถของ Web View ยังสามารถแสดงข้อมูลจาก HTML Tag ได้เช่นเดียวกัน

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

Web View เป็น Object ที่มีรูปแบบการใช้งานง่าย ๆ ซึ่งจะเห็นหลาย ๆ App นำมาทำเป็น App ประเภทข้อมูลข่าวสาร เช่น App ของ News เช่น Thairath ซึ่งแสดงข่าวต่าง ๆ ก็ใช้ Web View ในการแสดงข้อมูลต่าง ๆ บนหน้าจอ App เพียงแต่เราส่งข้อมูลในรูปแบบของ HTML Tag มาเท่านั้น Web View ก็สามารถที่จะแสดงข้อมูลต่าง ๆ ได้ตามต้องการ เรามาดูตัวอย่างง่าย ๆ กัน

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

เริ่มต้นด้วยการสร้าง Application แบบ Single View Application

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

เลือกและไม่เลือกดังรูป

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

ตอนนี้ในหน้าจอ View จะนังมีแค่ View เปล่า ๆ

ลาก Object ชื่อว่า Web View มาไว้ในหน้าจอของ View หลัก

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

ทำการเชื่อม IBOutlet ให้เรียบร้อย

ViewController.h

//
//  ViewController.h
//
//  Created by Weerachai on 11/4/55 BE.
//  Copyright (c) 2555 Weerachai. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController
{
    IBOutlet UIWebView *myWebView;
}

@end

จากนั้นเราจะต้องเรียก URL ของ http://m.thaicreate.com ด้วยการใส่ Code ง่าย ๆ ดังรูป

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

ViewController.m

//
//  ViewController.m
//
//  Created by Weerachai on 11/4/55 BE.
//  Copyright (c) 2555 Weerachai. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.
    
    NSURL *url = [NSURL URLWithString:@"http://m.thaicreate.com"];
    NSURLRequest *req = [NSURLRequest requestWithURL:url];
    [myWebView loadRequest:req];
}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (void)dealloc {
    [myWebView release];
    [super dealloc];
}
@end

Screenshot

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

ทดสอบการทำงาน แสดงข้อมูลจาก Web Server บน Web View จะได้ผลลัพธ์ดังรูปง่าย ๆ สั้น ๆ

เพิ่มเติม ในกรณีที่ต้องการแสดงจาก HTML Tag ก็สามารถทำได้เช่นเดียวกัน

<html><head><title></title></head><body style="background:transparent;">
<center>body <font color='red'>content here</font><br>
<img src='https://www.thaicreate.com/images/mobile_03.jpg'><center>
</body></html>

นี่คือ HTML Tag ง่าย ๆ ที่แสดงข้อความ และ รูปภาพที่อยู่บน Web Server เราจะเขียน Code ได้ดังนี้

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

ViewController.m

//
//  ViewController.m
//
//  Created by Weerachai on 11/4/55 BE.
//  Copyright (c) 2555 Weerachai. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.
    
   // NSURL *url = [NSURL URLWithString:@"http://m.thaicreate.com"];
   // NSURLRequest *req = [NSURLRequest requestWithURL:url];
   // [myWebView loadRequest:req];
    
    NSMutableString *html = [NSMutableString stringWithString: @"<html><head><title></title></head><body style=\"background:transparent;\">"];
    [html appendString:@"<center>body <font color='red'>content here</font><br>"];
    [html appendString:@"<img src='https://www.thaicreate.com/images/mobile_03.jpg'><center>"];
    [html appendString:@"</body></html>"];

    
    [myWebView loadHTMLString:[html description] baseURL:nil];
    
}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (void)dealloc {
    [myWebView release];
    [super dealloc];
}
@end

Screenshot

iOS/iPhone Web View (UIWebView) Open Web Site and HTML

แสดงข้อความจาก HTML Tag บน Web View ซึ่งจะแสดงข้อมูลในรูปแบบของ Web Browser

จากตัวอย่างนี้จะเห็นว่าเราสามารถแสดงข้อมูลต่าง ๆ จาก Web Server ได้แบบง่าย ๆ ซึ่งถ้าเราเข้าใจและสามารถดัดแปลงการใช้งาน จะเกิด idea ขึ้นต่าง ๆ มากมายเกี่ยวกับการออกแบบและเขียนโปรแกรมบน iOS ในการทำงานบน iPhone และ iPad ได้

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

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


	By :	ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ)
	Score Rating :
	Create/Update Date :	2012-11-07 10:38:00 / 2017-03-26 09:55:57
	Download :

Sponsored Links / Related

iOS/iPhone Get the String contents from URL (Website)
Rating :

iOS/iPhone Image URL Display an Image from URL (Website)
Rating :

iOS/iPhone Display Image on Table View from JSON URL (Web Site)
Rating :

iOS/iPhone NSURLConnection (Objective-C)
Rating :

iOS/iPhone Image View and NSURLConnection ActivityIndicator Progress
Rating :

iOS/iPhone NSURLRequest Example (Objective-C)
Rating :

iOS/iPhone NSURLConnection POST Method and Send Parameter (Objective-C)
Rating :

iOS/iPhone NSMutableURLRequest Example (Objective-C)
Rating :

iOS/iPhone NSURLConnection and PHP MySQL / JSON (TableView,UITableView)
Rating :

iOS/iPhone NSURLConnection Show Progress and Activity Indicator View (UIActivityIndicatorView)
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
	ปรับแต่งเว็บให้โหลดเร็ว