LoginSignup
40
42

More than 5 years have passed since last update.

[Swift]Xcode6.1で確認済み!Hello Worldの次に試したい!超簡単にwebViewを表示してみる

Last updated at Posted at 2014-08-18

!まだSwiftでHello Worldをされていない方は以下の記事を参考に!

参考サイト

1・新規ProjectをSingleViewで作成する

ここではwebViewSampleというプロジェクト名で作成しています。

スクリーンショット 2014-08-19 0.09.13.png

スクリーンショット 2014-08-19 0.09.46.png

スクリーンショット 2014-08-19 0.10.16.png

2・Main.storyboardを選択する。そしてユーティリティエリアからwebviewを選び、viewControllerへwebviewを貼付ける。そしてauto layautoを設定する。

スクリーンショット 2014-08-19 0.11.03.png

次に画面表示の最適化を行うためにauto layautoを設定していきます。
画面にぴったり合わせます。
そしてMain.storyboardの右下の「△」を押し、「Add Missing Constraints」を押して、
設定していきます。

スクリーンショット 2014-10-29 20.53.04.png

スクリーンショット 2014-10-29 20.53.25.png

3・貼付けたwebviewをドラッグしてview Controllerにくっつけ、delgateを追加する

スクリーンショット 2014-08-19 0.11.37.png

4・webViewからCtrlを押しっぱなしでViewController.swiftにドラッグして、アウトレットを追加する。

スクリーンショット 2014-08-19 0.12.29.png

5・view Controllerを以下のように修正する。

//
//  ViewController.swift
//  webViewSample
//
//  Created by g08m11 on 2014/08/19.
//  Copyright (c) 2014年 Bloc. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

  @IBOutlet var webView: UIWebView!

  //表示したいURLを設定(初期化)
  var targetURL = "http://rakutenqute.herokuapp.com/"


  override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    // webviewの表示を行うメソッドを呼び出す
    loadAddressURL()

  }

  override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
  }

  func loadAddressURL(){

    // 初期化したURLを読み込む
    let requestURL = NSURL(string: targetURL)

    // 読み込んだURLの実行結果を取得する
    let req = NSURLRequest(URL:requestURL!)

    // webvieにデータをロードする
    webView.loadRequest(req)
    webView.scalesPageToFit = true

  }

}

6・指定したURLが表示されれば成功

白い画面が数秒表示されますが、慌てずに待ちましょう。

スクリーンショット 2014-08-29 0.29.06.png

swift_2.gif


備考

表示しているURLはRakuten Qute!というwebアプリです。

Rakuten Qute!

ご質問

なぜかScales Page To Fitをチェックしてもサイズが調整されません。。。
swiftでwebview内のページを調整する方法をご存知の方おりましたら
コメントのほど、宜しくお願いします :smile:

追記

画像を更新しました!

40
42
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
40
42