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

人気blogランキング
[iPhone 4] LS『Typophone Weather』テーマのモディファイ例
Typophone Weather Mod
(モディファイ版Typophone Weather適用例)
(下部Tap to Unlockは別テーマです、こちらからダウンロードできます
(壁紙はテーマには含まれません、拾い物の加工品です)



 少々古いネタになってしまいますが。
 以前紹介した『Typophone Weather』テーマのモディファイ例です。
 Typophone Weatherテーマ自体がTypophoneのModなのでこれはModのModですね。

 敢えてセンターを外したり、画面外にはみ出したり、レイヤを重ね合わせる等、よりダイナミックな印象になるようレイアウトしています。その点ではオリジナルと同じ方向性です。

 これちょっとやってみる、あるいは、テーマ(Widget)カスタマイズってどうやるのよ、という方向けに手順を紹介しておきます。他のテーマをモディファイする場合も参考になるかと思います。

■用意する物

 Typophone Weatherテーマ
  オリジナルのテーマを入手します。詳しくはこちらのエントリ参照
 LS DDT BILL3Tテーマ
  今回使用するフォントが含まれています。詳しくはこちらのエントリ参照
 モディファイ用差分ファイル
  Typophone Weatherに上書きする差分ファイルです。下記。詳細は後述。
    LockBackground.html (UNLOCK文字消去)
    background.css (Converted-LockBackground.jpg使用のため)
    weather.js (温度記号を消して数字だけに)
    weather.txt (摂氏と都市の指定)
    style.css (各種テキストの位置・サイズ・色調整)
    am.png (時分のセパレータ)
    NOTamNORpm.png (時分のセパレータ)
    pm.png (時分のセパレータ)
  差分ファイルダウンロードはこちら

■手順

 1.オリジナルテーマを解凍し展開(バックアップを取りましょう)
   以下全て展開後のTypophone Weather.themeフォルダ内での作業です
   サブフォルダには一切モディファイを加えていません
 2.DicotBold(dicotbo.svg)フォントをコピー
   LS DDT BILL3Tから取り出したdicotbo.svgをコピーします
 3.差分ファイルを上書きコピー
   LockBackground.html他の差分ファイル7個を上書きコピーします
 4.ロケーションコード(都市名)変更
   東京(JAXX0085)がカレントになっています
   weather.txtを変更してご自分の都市に変更して下さい(下記設定補足参照)
 5.テーマをデバイスに転送
   転送手段はSSHあるいはi-FunBox(注意)やiPhone Explorer等任意
   テーマを置く場所に関しては下記設定補足参照
 6.WinterBoardで適用しrespring

■設定補足

 一部重複しますが設定に関するポイントを記します。

 デバイス上のテーマ配置場所について
   iOSデバイスにテーマを転送する際の注意点です
   ※このテーマ固有ではなく共通事項です
    //var/stash/Themes.xxxxxx に置く場合
      フォルダ名は「テーマ名.theme」にします
    //var/mobile/Library/SummerBoard/Themes に置く場合
      フォルダ名は「テーマ名」のみです、「.theme」は付けません
 天気を取得する都市(ロケーションコード)について
   weather.txtの"zip"でコードを指定します
   コードはこちらのサイトやWeather.com等で調べて下さい
   複数の都市を設定し切り替え可能です(日付の辺りをタップ→都市名タップ)
   "cityName"は単なる表示用なので自由に設定できます
   東京、クパチーノ、ニューヨークの3都市設定済みです、参考にして下さい
 摂氏/華氏の切り替え
   同じくweather.txtで指定します(摂氏(Celsius)設定済み)
 AM/PM表示有無の切り替え
   スクリーンショットではAM/PM表示なしに設定されています
   好みもありますので差分ファイルには加えていません
   functions.jsの3行trueをfalseにするとAM/PM表示なしになります
   どちらの設定でも差分に含まれる画像が使用されます
 背景画像(background.css)の指定について
   Wallpaper JPEGifierが生成する背景画像を使用する設定になっています
   Wallpaper JPEGifierはCydiaから入手できます
   他の画像を使用する場合はurlのパスを変更して下さい
 UNLOCK文字消去(LockBackground.html)について
   他のUnlock系テーマと組み合わせない場合は消去不要です
 各テキスト要素の位置・サイズ・色について
   style.cssで設定しています
   オリジナルのcssとコンペアして変更点を確認して下さい
   同様に数値を変更するだけでレイアウトが弄れますから色々試してみましょう
   母艦のブラウザでプレビューする場合はSafariかChrome推奨です
    (Safari→最もiPhoneの表示に近い(WYSIWYGに近い))
    (Chrome→WebKitで親和性が高くしかも強力なインスペクタがヒジョーに使える)

 他にも何か気づいたら追記しておきます。
 では。
スポンサーサイト

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


人気blogランキング
[iPhone 4] ロック画面ウィジェット『Typophone Weather』
追記:カスタマイズ例紹介
 [iPhone 4] LS『Typophone Weather』テーマのモディファイ例
 (モディファイ用ファイルダウンロードと手順解説)



 FSMdotCOMで紹介されていた『Typophone Weather』を使ってみました。
 元の『Typophone 4』は以前時々使っていましたがこのMod版は初めて。
 ロック画面に日時と天気を表示するウィジェットです。
 タップ操作による表示切り替え機能あり。

Typophone Weather (一部カスタマイズ済み)
(Typophone Weatherテーマ適用例、一部カスタマイズ済み)

注意
 要Jailbreak、当方環境は(iPhone 4、iOS 4.3.1、WinterBoard)
 テーマに関して詳しくは下記のオフィシャルサイトをご覧下さい
 これらの情報により不具合が生じても当方は一切責任をとりません(自己責任で)

関連リンク
 FSMdotCOMの紹介記事
 オフィシャルサイト

入手方法
 下記2種類から選択
  方法(1): Cydiaからインストール
  方法(2): オフィシャルサイトからダウンロードし手動で導入
    (ソース一式なのでテーマファイル以外に画像テンプレートpsd等も含まれる)

設定方法
 下記2種類から選択
  方法(1): App Storeから有料アプリを購入しGUIで設定
    (アプリは115円→App Storeリンク
    (有料版限定のテーマが使用可能になるなど特典あり)
  方法(2): オフィシャルサイトの解説を参考に手動で設定

設定補足
 今回は入手も設定も方法(2)で導入してみました。
 入手方法はどちらでも構わないと思いますが、設定方法は・・・、他のWidgetと大差なく簡単なため、わざわざこのためだけに115円払う必要はないでしょう。どうしてもデスクトップ版(アプリ版)のWidgetや追加テーマが欲しければ別です。

 以下、設定に伴うメモです。なお前掲スクリーンショットはフォント種、そのサイズとポジション、スライダー画像、壁紙等一部カスタマイズを施しておりデフォルトとは異なります。

 12時間制/24時間制
   ・functions.js の AM_PM を false にすると24時間表示(デフォルトはtrue)
 摂氏/華氏
   ・weather.txt の unit を Celsius にすると摂氏表示(デフォルトはFahrenheit )
 都市
   ・weather.txt の
     cityName に都市のセレクター表示名を入力(任意文字列)
     zip に都市コードを入力(例:東京ならJAXX0085)
 フォントについて
   ・デフォルト指定はデバイスのHelvetica系と付属svgフォントの混合
   ・このためシステムフォントを置換していると位置・サイズがずれる、要調整
 壁紙について
   ・付属LockBackground.pngが指定されている
   ・画像置換または指定書き換えによって壁紙変更可能

操作(表示の切り替え)
 このウィジェットは画面をタップすると表示内容の切り替えができます。

 カレンダー(日時)表示部分をタップ
   ・都市のセレクターが現れ表示する都市を切り替え可能
   ・都市の選択肢はweather.txtに列挙しておく

 天気表示部分をタップ
   ・天気の表示方法がタップする度に変更される(下記3種類トグル)
     デフォルト:今日の気温と天気
     今日の天気、最高気温、最低気温
     明日の天気、最高気温、最低気温

 以下のクリーンショットはその一例です。

都市選択中の画面
 都市セレクターで都市を選択中の画面
 左右矢印をタップしてリストをスクロール、都市名をタップして選択

明日の天気に切り替えたところ
 天気表示を“明日”に切り替えるとこんな感じ、最高・最低気温を表示

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


人気blogランキング
[iPhone 4] iOS 4.2.1 壁紙jpgが消えた影響(Widget等は要修正)
追記:『Wallpaper JPEGifier』で対策が可能です(使用方法解説記事はこちら


追記:iOS 4.2.1 変更箇所関連の記事一覧(当エントリを含む)
 iOS 4.2.1 で仕様変更されたテーマ関連ファイルのまとめ記事一覧
 変更情報を網羅してはいませんが記事はこれ以上増やせないかもしれません
   [iPhone 4] iOS 4.2.1 壁紙jpgが消えた影響(Widget等は要修正)
   [iPhone 4] iOS 4.2.1対応版『設定画面ミニアイコン一覧』
   [iPhone 4] iOS 4.2.1対応版『ホーム画面透明化パック』テーマ
   [iPhone 4] iOS 4.2.1のデフォルトアプリアイコン名等の変更まとめ
   [iPhone 4] iOS 4.2.1の英数フォント仕様変更まとめ


Typophone 4 対策後
(Typophone 4 壁紙対策後の表示例、対策方法は下記参照)
(画面下部のTap to Unlockテーマはこちらにあります

 前回に続きiOS 4.2.1で変更されたテーマ関連情報まとめ。

  前回の記事:[iPhone 4] iOS 4.2.1対応版『設定画面ミニアイコン一覧』
  前々回の記事:[iPhone 4] iOS 4.2.1対応版『ホーム画面透明化パック』テーマ
  その前の記事:[iPhone 4] iOS 4.2.1のデフォルトアプリアイコン名等の変更まとめ
  その前の記事:[iPhone 4] iOS 4.2.1の英数フォント仕様変更まとめ

 今回はシステム壁紙画像の仕様変更について。

■変更箇所

 従来
   /private/var/mobile/Library/SpringBoard/HomeBackground.jpg (ホーム画面)
   /private/var/mobile/Library/SpringBoard/LockBackground.jpg (ロック画面)

 変更後(iOS 4.2.1)
  ホーム画面
   /private/var/mobile/Library/SpringBoard/HomeBackground.cpbitmap
   /private/var/mobile/Library/SpringBoard/HomeBackgroundThumbnail.jpg
  ロック画面
   /private/var/mobile/Library/SpringBoard/LockBackground.cpbitmap
   /private/var/mobile/Library/SpringBoard/LockBackgroundThumbnail.jpg

■画像の詳細
  cpbitmap画像
    詳細不明、Win/OS2ビットマップではない(容量もバイナリ構成も異なる)
  Thumbnail.jpg画像
    206x308の極小壁紙サムネール
    jpgなので利用可能だがRetinaに拡大すると醜い画質

■影響
  ウィジェット等
    ソースで従来の画像パスを指定している場合壁紙が表示されない
      例:こちらのページにあるiWeatherモディファイ版
        (Wallpaper.htmlの12行目に指定あり)
    またはそれに加えて誤作動
      例:Typophone 4(8が毎秒点滅し数字が二重表示)
        (style.cssの6行目に指定あり)
        (上のスクリーンショットは対策後)

■対策方法一例
  ウィジェット毎に画像を入れる
    専用の壁紙画像を入れてその画像名(またはパス)を指定
  共有の壁紙フォルダを作っておく
    適当なフォルダ(例:/private/var/mobile/Media)に画像フォルダを作成
    壁紙画像を入れておいて各ウィジェットソースからパスを指定


 respring後にシステム壁紙変更を反映する類のウィジェットは一様にこのパス指定を行っているはずです。iOS 4.2.1にアップデート後壁紙が表示されなくなったら、ソース(html、js、css、どこかに書いてあります)を調べて書き換えましょう。

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


人気blogランキング
copyright © 2005-2011 Banco Japon de Mesa Verde all rights reserved.
Powered by FC2ブログ.
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。