普通のサラリーマンのiPhone日記 Rotating Header Image

【お知らせ】AppHtml課題をクリアする為の修正完了!

AppHtmlのリニューアル版ですが、先日報告したバージョンには課題がありました。

  • アイコン角丸のCSSがRSSやiPhone最適化の画面でおかしくなる課題
  • OKなのか、キャンセルなのか分かりにくい仕様
  • スクショサイズの指定にCSSを使っていてIEでは無視されちゃう課題

上記を解決する為に実は内部的には作りも根本的に変えてます。

最初以外の課題は、Bookmarklet本体側で対応しているので既にBookmarkletをお気に入り登録している方は、再作成は必要ありません。最初のは書式テンプレートに関わる部分の為、Bookmarkletの再作成が必要になります。すみません…。

AppHtmlの書式テンプレートは7/17(土)の22時過ぎに修正しています。
それ以降にBookmarkletを作られた方は問題ありません。

アイコン角丸の件

CSS大臣(saita_ryouheiさん)の検証により、今の書式テンプレートに変わりました。このCSSですと以下のようになります。

  • IE以外はアイコンは角丸に見える(IEは角丸じゃなく四角に見える)
  • iPhoneやiPadはブラウザがSafariなのでアイコンは角丸に見える
  • RSSはCSS対応していないので四角に見える

いずれにしても、枠とアイコンが別々に表示される問題とか、アイコンが全く表示されない問題とか、そういったおかしい見え方は無くなりました。アイコン角丸のCSSは、ほんと難しい。やっとAppHtmlにて解決できました。これからは安心です。


賢くなるパズル® KENKEN 1.0.1(¥170)App
カテゴリ: ゲーム, 教育, エンターテインメント, パズル
販売元: Beeline Interactive, Inc. – Capcom Interactive, Inc.
(サイズ: 7 MB)
全てのバージョンの評価: (10件の評価)

上記がサンプル。KENKEN。もうちょっとで6×6のエキスパートが終わる…。

OKなのか、キャンセルなのかの件

説明を受けても分かりにくい。そんな仕様でごめんなさい。
そんな方々を考慮してアプリ検索の結果の度にヘルプを入れるようにしました…。

Google Chrome

これで間違うケースは減るに違いない…。

スクショサイズの指定の件

これまでは「max-width」や「max-height」を使ってCSSで画像のサイズを変えていました。このやり方ですと一撃で長辺が縦だろうと横だろうとうまくサイズ調整してくれます。このやり方はDraftPadと同じです。

だがしかし。

IEではこのCSS表記が使えないんです。使えないとどうなるかというと…。オリジナルのサイズで表示されることになる。要はスクショがでかくなるんです。見栄え最悪です…。

ということで対策を検討した結果…。

  • スクショを裏でダウンロードして縦横判定し、widthを計算する

これしかないという結論になりました。しかし、JavaScriptはスクショがダウンロードされるのを待ってくれず、処理が進んでしまう為、うまくダウンロードが完了するまで待つことができないという課題にぶちあたる…。

結果的にプログラムを全面リニューアル。

非同期で動いちゃう部分を同期で動くように抜本的に修正しました。尚、ダウンロードに関しては、複数アプリのスクショを一括ダウンロードするとそれこそ重いので、複数の選択候補からひとつに絞った後で該当アプリのスクショのみダウンロードするようにしました。

そんな理由から、キャンセルで決定してから一瞬待つようになりました。
あしからず。

前と比較すると本体外出しなのでメンテもしやすくなりました。良い感じです。
Bookmarkletメーカーの着眼点もmatubizさんのおかげ。ほんと感謝です。

-

タグ: AppStore, App紹介, Blog, Bookmarklet, hiroスタイル, HTML, Linkshare, MacAppStore, WordPress

Similar Posts:

コメントをどうぞ

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>