UIWebKitをコンポーネントとして使う
Cocoa勉強会 #422010/9/25Masayuki Niitwitter: msyknii
12010年9月24日金曜日
Agenda
UIWebViewについて
クラスが持つ機能
開発時の使い方
22010年9月24日金曜日
UIWebView
Safariとほぼ同じ機能を持つコンポーネント• HTMLを与えれば、レクタングル内でほぼ「ブラウザでロードし
た」状態で稼働する
Mac OS Xにもある• iOSのコンポーネントは機能的には少ない
標準的でないユーザインタフェースを作れる• たとえば、タブ
32010年9月24日金曜日
UIWebViewクラスの機能
HTMLのロード
ナビゲーション
JavaScriptの実行
デリゲート UIWebViewDelegate
各種の設定• メディアプレイバック、データ検出(電話番号など)
42010年9月24日金曜日
CRUDをベースに考える
CRUD• Create/作成、Read/読み取り、Update/更新、Delete/削除• データのライフサイクルを検討するときの基本概念
UIWebViewは、UIViewオブジェクトのサブビューとして存在する
以下の状況での「手法」を知る必要がある• UIWebViewの内部→UIWebViewの内部• 外部→UIWebViewの内部• UIWebViewの内部→外部
52010年9月24日金曜日
状況に応じた手法の選択
Create Read Update Delete
Inside→Inside
Outside→Inside
Inside→Outside
62010年9月24日金曜日
状況に応じた手法の選択
Create Read Update Delete
Inside→Inside JavaScript:DOMJavaScript:DOMJavaScript:DOMJavaScript:DOM
Outside→Inside API:loadHTMLなど
API:stringByEvaluatingJavaScriptFromString:
API:stringByEvaluatingJavaScriptFromString:
API:stringByEvaluatingJavaScriptFromString:
Inside→Outsideリンク
UIWebViewDelegate
リンクUIWebViewDelegate
リンクUIWebViewDelegate
リンクUIWebViewDelegate
72010年9月24日金曜日
UIWebViewへのHTMLのロード
基本的な方法• HTMLファイルを作成しておき、リソースとしてコピーする• NSBundleの機能でファイルを特定して文字列を取得• loadHTMLString:baseURL:でロード
応用例• 実行時に決まる値を挿入してロードしたい場合• HTMLファイルに「%@」を含める• HTMLファイルをNSStringとして取得→htmlString• [NSString stringWithFormat: htmlString, @”123”, @”45”];• 最初の%@が「123」、次の%@が「45」に置き換わる
82010年9月24日金曜日
JavaScript実行メソッド
stringByEvaluatingJavaScriptFromString:• 引数のJavaScriptを、UIWebViewで表示しているHTMLページに
対して適用できる
必要な準備• HTMLの要素にID属性をきちんとつけておけばほぼ問題ない• ex: <div id=”ItemsName”></div>
値の設定/変更/削除• [WEBVIEW stringByEvaluatingJavaScriptFromString:
@”document.getElementById(‘ItemsName’).innerHTML=‘Kind_of_String’;”]• inputタグの要素は、valueやcheckedなどのプロパティを利用
92010年9月24日金曜日
JavaScript実行メソッド
値の取得• ex: <input type=”checkbox” id=”box” />• [WEBVIEW stringByEvaluatingJavaScriptFromString:
@“document.getElementId(‘box’).checked;”];
メソッドの実行結果• trueあるいはfalseという文字列が返る• メソッドの返り値はステートメントの評価結果が返る• 従って、return…の必要はない
102010年9月24日金曜日
内部から外部へのアクセス
HTML内にリンクを作る• ex: <a href=”.?a=1&b=2”>Do It!</a>• 自分自身を呼び出すとともに、パラメータを追加する
UIWebViewのデリゲートを設定する• webView:shouldStartLoadWithRequest:navigationType:メソッ
ドを実装する• NOを返せば、HTMLページは変化しない
クエリーパラメータを解析する• 引数requestに、リクエスト情報が渡される• NSArray *queryParams = [[[request URL] query]
componentsSeparatedByString: @"&"];• 結果に応じて必要な作業をObjective-Cで記述できる
112010年9月24日金曜日
その他の考慮点
HTML内のリンクをタップしたときのUI• モーダルビューが表示され、リンク先に移動するかをユーザに問い
合わせる
事実上使えないHTMLの手段• ポップアップメニュー• divを使ったドロップダウンメニュー
UIWebView内部での選択処理• 外部にボタンを作る• モーダルビューなど、一覧して選択するUIを作る• 選択結果を、HTMLの内部に挿入する
122010年9月24日金曜日
まとめ
通常のコンポーネントで作りにくいものはUIWebView
JavaScriptのDOMモデルで処理をする
外部へのインタラクトはリンクとデリゲート
and More...• 次回の浦和での勉強会は:2010/10/25(Mon)• http://coolnotify.com/devurawa
132010年9月24日金曜日