Banco Japon de Mesa Verde
最近の主な話題-iPhone-FPS-デジタル一眼-PC自作-Mac-PS3-グルメ-ファッション-etc.-
スポンサーサイト
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
[タグ未指定]

人気blogランキング
[iPhone 3G] Webの画像をランダムに表示する壁紙
Poolgaの画像を取得して表示

 追記:iPhoneローカルの画像を切り替えるバージョンはこちら

 今回はネット上の画像を切り替えて壁紙に使えるか実験です。

 ■実験内容
 Webの画像をランダムに取得して、iPhoneのホーム画面に表示します。サーバとiPhoneに余り負担をかけないよう、取得のインターバルは30分としました。

 ■画像取得先
 iPhone用の壁紙を多数公開している『Poolga』にしました。ここに決めた最大の理由は画像のURLが
  http://poolga.com/wp/連番.jpg
 と非常に単純なため。これなら複雑なスクリプトを組まなくても一定の文字列+乱数の連結で画像URLを生成することができます。もちろんサイズは320x480でiPhoneにピッタリ。

 ■取得と表示方法
 SummerBoard(WinterBoard)のテーマフォルダ直下に“Wallpaper.html”を置き、そこに取得/表示のJavaScriptを記述します。
 ベースにしたテーマ(アイコンやマーカー画像と壁紙)はこちらの「壁紙観賞用」です。これにWallpaper.htmlのみ追加します。

 ■Wallpaper.html・スクリプトのソース
『Wallpaper.html』のソース
(青字部分が該当箇所)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; minimum-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<script type="text/javascript">
<!--
var imgNum, imgUrl;
function chgwall() {
    imgNum = Math.ceil(Math.random() * 246);
    imgUrl = "http://poolga.com/wp/" + imgNum + ".jpg";
    document.wall.src = imgUrl;
}
//-->
</script>

<style>
    body {
        background-color: black;
        margin: 0;
        padding: 0 0 0 0;
        height: 480px;
        width: 320px;
    }
    img {
        position: absolute;
        width: 320px;
        height: auto;
    }
</style>
</head>
<body style="color: black" onLoad="setInterval('chgwall()',30*60*1000)">
    <img src="Wallpaper.png" name="wall" onerror="this.src='Spirit.png'">
</body>
</html>

 前半の青字部分が画像取得のスクリプトです。Poolgaの画像URLが単純なため、このようにスクリプトもいたってシンプルなもので済みました。
   ・1~246の乱数を発生させ画像番号の変数に代入
    (最大値は画像追加に合わせて随時書き換える)
   ・画像番号と文字列を連結して画像URLの変数に代入
   ・画像のURLをオブジェクトの名前wallとして定義
 後半の青字が画像表示用です。
   ・onLoad=でhtmlロード時にスクリプトを実行、setInterval(30分)で繰り返し
   ・imgタグ(名前wall)で画像を表示
   ・ロード時はローカルのデフォルト画像(Wallpaper.png)を表示
   ・エラー時は別の画像(Spirit.png)を表示

 ■結果と問題点
 どうやらiPhone側の動作(特にスリープ中)に問題があるらしく、100%は機能してくれません。
   ・デフォルト画像が数時間表示されていることがある
     →ファンクションが実行されていない?
   ・エラー時の画像がたびたび表示される
     →実行されたが通信に問題(3G通信不能だった?)
     (通信が安定した場所にiPhoneを置きっぱなしでも発生します)
   ・Poolgaの同じ画像が数時間表示され切り替わらないことがある
     →乱数の重複でなければファンクションが実行されていない?
 試しにインターバルを10秒にして観察するとre-spring直後から正常に動作します(ごくまれにエラー画像が表示されることも)。Windows版のSafariで試したときと同様、JavaScriptの実行自体には何の問題もないようです。

 30分ごとに毎回Poolgaのサーバレスポンスに異常があるとも考えにくく、デフォルト画像がしばらく表示されることなども合わせると、スリープ中(深度の段階あり?)の仕様+3G通信の不安定など複合的な要因があるのではと推測しています。

 ■まとめ
 ランダムに切り替わる壁紙を楽しむという点では、上記問題が発生した時を除き半ば成功です。今後iPhoneのアップデートによってこの現象に変化があるのかないのか、2.2が来たら(今月か来月?)また試してみるつもりです。

 ■応用
 とりあえずJavaScriptで動的な壁紙を作れることはわかりました。次回は別のスクリプトで遊んでみようと思います。通信がなければ順調に動作するのかな?
 例えば
   ・ローカルフォルダ内の画像をランダムに表示(Arrayと乱数で) →upしました
   ・時計(日時)を表示(既に先例あり、私も試作してみました) →upしました
   ・アニメーション
   ・インタラクティブなWallpaper.htmlって無理?
 等々。




 ■余談
 iPhoneのホーム画面て、ドックの上、左右端あたりをタップすると左右にスクロールできるんですね。マニュアル読んでないから今まで知らなかった。
スポンサーサイト

テーマ:iPhone - ジャンル:携帯電話・PHS


人気blogランキング
コメント
この記事へのコメント
また見させていただきました!
応援ポチッ!!!
2008/10/22 (Wed) 18:31:37 | URL | サトシ #-[ 編集]
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
トラックバック
この記事のトラックバックURL
この記事へのトラックバック
copyright © 2005-2011 Banco Japon de Mesa Verde all rights reserved.
Powered by FC2ブログ.
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。