【KtaiLibrary】AU携帯を新規契約しちゃった…

icon_ktaiいずれ必要になりそうだとの判断で、思い切ってau携帯を新規で契約しました。
CA001なんですけど、シンプル新規一括0円だったので(笑)。
SH001と迷ったんですが、一括1万だったので、まあどうせ実機テスト用なのでムダなお金はかけないということで。

店員さんにいろいろ聞いたのですが、「au BOX」の対応の可否でベースバンドあたりが違うらしいですね。au BOXに対応している携帯は新型らしくて、スピードも高速とのこと。それに伴い「KCP+」という共通プラットホームを使用している点も(いや、順番が逆なのかな?)。一応標準的な機能を持った端末ということで購入するつもりだったのですが、これから主流になる最低限の機能として押さえておいた方が良いかなと思って本機にした次第です。

まあ、何で新規契約をしようと考えていたかというと、不具合報告として先日挙げられた件(SDK6.2kで絵文字が化ける件)を実機で確認したかったためです。純正シミュレータなので本来はたのシミュレータよりも正しく動くはずなのですが、それにしても動きがおかしいので…
で、早速チェックしてみたのですが…実機は問題ないみたいですね。
まあ、これでライブラリのチェックをもう少し厳密に出来そうなので、不安点少なくライブラリの公開が出来そうです。

まあ、auを契約した代わりに、iPhoneの契約を変更して他の端末に回しました(実質解約)。iPhoneアプリを作るつもりで買いましたが、そっちをやっている暇は全くないので(^^;。
とりあえず普通にiPodTouch同等で使えるので、まあいいかなと。試していませんがwifi経由ならライブラリのチェックも出来るでしょうし。

あとはdocomo携帯ですね。
新型をどうやって入手しようかと。
白ロム経由かなぁ…
まあそれはもう少し先の話ですね。

【Ktai】PCやiPhoneで携帯のレイアウトを模倣するTips

icon_ktai携帯サイトをiPhoneに対応させたり、デバッグ等で簡易的にPCで携帯サイトを確認したい… そのような用途はあると思います。今回は、そんな方向けの、Ktai Libraryを用いたTipsをご紹介。

携帯向けサイトをそのままPCやiPhoneで表示すると、大抵はレイアウトが異なって表示されてしまいます。特にiPhoneはひどいもので、場合によっては文字が数pixel位の、もの凄~く見にくい画面になってしまいます。まあ、PCやiPhoneは携帯と比べて高解像度なわけで、仕方のないことなんですけど、これをなんとかしたい… そんなことを思われている方もいらっしゃると思います。
単純に、divでスクリーンサイズを(width=240で)固定してしまうのも一つのアイデアですが、それですと今度は高解像度な(SB)携帯で見にくいものとなってしまい、うまくありません。

ちなみに、iPhoneの場合は、コンテンツの横幅をオートで検出して、内容の少ないものは拡大されるのですが、そうでないものは最大980pixelとのことなので、長文が含まれているコンテンツは980pixel目一杯縮小されてしまいます。divで囲う方法で一見解決しそうな感じですが、縦方向に長い場合も縮小されるようで、確実な方法ではありません。
ただ、この件については解決する方法があり、metaタグで横方向のサイズを決めることが出来ます。

というわけで、上記を加味した上で、各端末に対応するための手法をご紹介。
ビューテンプレート(layout)はおおむねこんな感じです。
基本はこの方法でカバーできるかと思います。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<?php
if($ktai->is_iphone()){
?><meta name="viewport" content="width=260"><?php } ?>
<title><?php $title_for_layout; ?></title>
</head>
<body>
<?php
if(!$ktai->is_ktai()){
?><div style="width: 240px;"><?php } ?>
<font size="2">
<!-- &&layout&& -->

<!-- %%index%% -->
ここに内容を書きます。
<!-- %%index%% -->

<!-- &&layout&& -->
</font>
<?php if(!$ktai->is_ktai()){
?>
</div><?php } ?>
</body>
</html>

宣伝を兼ねて、Tplcutter形式で公開してみたり(笑)。
上記例では、iPhone用メタタグの数値が260となっているのですが、240だとうまくいかなくて、いろいろ調整しての数値です。
多少レガシーなhtmlタグが混じっていますが、これはcssに置き換えてもよろしいかと。

まあこんな感じで、携帯サイト製作の参考になれば。