投稿日: 投稿者: MASA-P

【KtaiLibrary】バージョン0.4.0公開！

お待たせしました、Ktai Libraryのバージョン0.4.0を公開いたします！

基本的にはバグフィックスと機種情報などデータ面の更新がメインだったのですが、一つだけ他の携帯向けライブラリ等には存在しない便利な機能を搭載しました。

高解像度携帯の登場で、画像の大きさがまちまちになって画面レイアウトが崩れる件については先に搭載しています画像のフィット機能で改善する事ができますが、これだけでは完全に解決することができませんでした。何故かというと「フォントの大きさ」もキャリア・機種によって異なるため、同じ文字幅で改行する事が困難だったからです。
そこで、キャリア・機種によって異なるフォントサイズの指定を肩代わりして同じように見せるような機能を搭載しました。簡単に仕組みを説明しますと、まず3キャリアでフォント使用の指定タグが異なるためそれを吸収し、またキャリア毎、あるいはSoftBankの高解像度携帯とdocomoのブラウザ2.0以降、それ以外での文字サイズの差をなくすために一工夫している感じです。

ただ、厳密にフォントの大きさを変える事はできません。携帯内が持っているフォントは固定幅でありアウトラインフォントではないため、1ピクセル単位でなめらかに大きさを変える事ができないからです(docomoのブラウザ2.0以降のみできる)。なので、おおむねそれに近い大きさの出力が可能な「small」「medium」「large」の3つの大きさが指定できます。それ以外の大きさも指定は可能ですが、そのまま出力するため同じ大きさに見えるかどうかは分かりません(というか見えないはず)。
それから本機能はXHTMLのみ有効です。HTMLでは機能しませんのでお気をつけください。

具体的にはこのように使用する事ができます。

■コントローラ(デフォルトのフォントサイズを変更する)


App::import('Controller', 'KtaiApp');
class KtaipagesController extends KtaiAppController {

	var $name = 'Ktaipages';
	var $uses = array();
	var $components = array('Ktai');
	var $helpers = array('Ktai');
	var $layout = 'ktai_default';

	//Sample ktai params
	//
	var $ktai = array(
		'use_img_emoji' => true,
		'input_encoding' => 'UTF8',
		'output_encoding' => 'UTF8',
		'use_xml' => true, 		//XHTMLに(重要)
		'default_font_size' => 'small', 	//デフォルトフォントサイズをsmallに
	);

	//Sample index action
	//
	function index(){
	}

}




■レイアウトファイル(ここが一番やりやすい)



<?php
if(Configure::read('debug') == 0){
	echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";
}
?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
<?php if($ktai->is_iphone()){ ?><meta name="viewport" content="width=260"><?php } ?>
<title><?php echo $title_for_layout; ?></title>
</head>
<body>
<?php $ktai->font(); //フォントサイズをデフォルトに指定 ?>
<?php if(!$ktai->is_ktai()){ ?><div style="width: 240px;"><?php } ?>
<?php echo $content_for_layout; ?>
<div align="center">
<hr width="90%" size="1" color="#333333" noshade>
(C)2009-2010 <a href="http://www.ecworks.jp/">ECWorks</a>
</div>
<?php if(!$ktai->is_ktai()){ ?></div><?php } ?>
<?php $ktai->fontend(); //フォントタグの終端 ?>
</body>
</html>




ktai-devのサンプルにもフォント指定がされていますので、お試しいただく事ができます。ただし、FireMobileSimulatorでは正しい文字サイズで表示する事ができませんので注意が必要です。


また、上記サンプルは完全にオプション値を省略していますが、フォント指定を行うタグを変更したり追加のスタイルを与える事もできます。詳しくは添付ドキュメントもしくはソースコード内のコメントを参照してください。


ちなみに本機能はフォントの大きさについてあまりこだわりのない方向けの機能ではないのですが、レイアウトにこだわる必要があるサイト、特に携帯ソーシャルサイトなどに便利にご利用いただけると思います(というか当方の案件で必要だったため制作しました(笑))。


Ktai Libraryの基本的な情報やダウンロードについては こちら をご覧ください。

“【KtaiLibrary】バージョン0.4.0公開！” への2件の返信

コメントは受け付けていません。