iPhone特有の技術いろいろ

2008年10月31日(金)
松本 庄司

クライアントサイドデータベース

 SafariはHTML5のクライアントサイドデータベース機能を先取りしています。Safariの実装ではSQLiteを使っています。Cookieのようにサーバとのやりとりを行わず、また比較的大容量のデータをSQLで処理できるため、特にWebアプリケーションには有用でしょう。

 iPhone上では5MBまでのデータベースを作成でき、「ホーム→設定→Safari→Databases」で確認や削除ができます。

 データベースは「var db=window.openDatabase("","","",);」で開くことができ、「db.transaction(処理コールバック,失敗時コールバック,成功時コールバック)」によってトランザクションを制御します。引数として与えるコールバック関数function(tx){..}の中で、「tx.executeSql("",[],処理コールバック,失敗時コールバック,成功時コールバック);」として実際にSQLを処理します。

 executeSqlのには「?」でパラメータ位置を指定でき、それぞれの位置にの値が代入されて実行されます。プリペアドステートメントと同じです。コールバック関数には、トランザクションtxと結果セットrsが渡されます。結果セットの内容は、「rs.rows.item()['']」で参照できます。

 最も汎用的なSQL実行コードは図2-1の通りです。ここで使っているobjdump()はオブジェクトのプロパティ名と内容をダンプする関数、disp()は内容を表示する関数です。サンプルをダウンロード(http://www.thinkit.co.jp/images/article/146/5/14651.zip)できますので、参照ください。(14651.zip/1.90 KB)。

 クライアントサイドデータベースの説明はSafari JavaScript Database Programming Guide(http://developer.apple.com/webapps/docs/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Introduction/chapter_1_section_1.html)にあります。

 また、データベースとは関係ありませんが、iPhoneのSafariにはHTML5のアプリケーションキャッシュも実装されているという話もあります。アプリケーションキャッシュとは、Webアプリケーションをオフラインで使えるようにする仕組みで、クライアントサイドデータベースと組み合わせれば、オフラインでも動くWebアプリケーションが作れる日も近いことでしょう。

CSS3の装飾

 SafariはCSS3の機能を先取りして実装しています。

 テキストに影をつける、BOXからテキストがはみ出したときに「...」を使う、ボックスに影をつける、1枚の画像でボーダーをつける、背景サイズの指定、複数の背景画像を使う、マルチカラムの指定についてのサンプルをダウンロード(http://www.thinkit.co.jp/images/article/146/5/14652.zip)できますので、参照ください(14652.zip/6.72 KB)。このサンプルはiPhoneで図2-2のように表示されます。

 これらの指定はiPhoneだけでなくPCのSafari3.1でも有効です。また、FireFoxでも「-webkit-」を「-moz-」に変えることで、Operaの場合も「-o-」に変えることで対応しているものもあります。

 このようなCSS3を見据えた拡張の対応状況はCSS3.Info(http://www.css3.info/preview/)で見ることができます。

株式会社モディファイ
CTO。ProjectVine、もじら組などオープンソース系コミュニティーでの活動後、大手SIerにてJavaによるアプリケーションフレームワークの構築を手がける。ベンチャーインキュベータを経て、現在は株式会社モディファイにてJavascript/CSSと格闘する毎日。http://www.modiphi.com/

Think ITメルマガ会員登録受付中

Think ITでは、技術情報が詰まったメールマガジン「Think IT Weekly」の配信サービスを提供しています。メルマガ会員登録を済ませれば、メルマガだけでなく、さまざまな限定特典を入手できるようになります。

Think ITメルマガ会員のサービス内容を見る

他にもこの記事が読まれています