Mobileアドオン(モバイル開発支援) | Addons

Mobileアドオンを使用するとモバイルサイトの構築で面倒な絵文字、文字コード変換などの面倒な処理から解放してくれます。

絵文字は基本的な絵文字250個に対応しています。それ以外の絵文字は顔文字、もしくは〓に変換されます。

モバイルアドオンをロードすると、アプリケーションはPC・モバイル3キャリアに対応します。モバイルとその他を完全にわける場合はこちらを参照してください。 < /p>

レイアウトの変更

キャリア等に合わせて、XMLやDOCTYPE宣言を変更する必要があります。
そこで、レイアウト(デフォルトは app/view/layout.tpl)を下記のように変更します。

<?php echo mb::get_doctype() ?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
  <head>
    <meta http-equiv="Content-Type" content="<?php echo mb::get_content_type() ?>" />
    <title><?php echo $pageTitle ?></title>
    ...
  </head>
  <body>
    
    ...
    
    <div id="contents">
      <?php echo $contentForLayout ?>
    </div>
    
    ...
    
  </body>
</html>
これでクライアント(キャリア等)に合わせてDOCTYPEや文字セットが切り替わるようになります。

絵文字の出力

内部絵文字コードは {e:絵文字コード} という形式になります。絵文字コードは3桁の数字です。内部絵文字コードを含む文字列を下記のように出力すると、クライアントに合わせた絵文字が出力されます。
なお output()メソッド は内部絵文字コードを変換し、かつHTMLエスケープ処理も行います。
<?php echo mb::output("今日はいい天気ですね{e:239}") ?>
単純に絵文字を設置するだけなら、emoji()関数を使用してください。引数は3桁の絵文字コードです。
<?php echo emoji("239") ?>
内部絵文字コードと絵文字の対応表はこちらを参照してください。

絵文字の入力

モバイルアドオンではリクエストオブジェクトからリクエスト値を取得し、絵文字を内部絵文字コードに変換 & 文字コードを内部文字コードに変換し、リクエストオブジェクトに入れなおします。そのため開発者はその辺りを一切気にする必要はありません。
class MyController extends Sabel_Controller_Page
{
  public function myAction()
  {
    // 絵文字&文字コード処理がされている
    $inputValue = $this->request->fetchPostValue("input_name");
    
    echo $inputValue;  // "今日はいい天気ですね{e:239}"
  }
}

出力

各キャリア等に合わせて出力結果(HTML)の文字コード変換やレスポンスヘッダの出力を行う必要がありますが、それもモバイルアドオンが全てやってくれるため、開発者は気にする必要がありません。

キャリアによる条件分岐

細かい処理では、キャリアによって条件分岐する必要が出てくることもあるでしょう。その場合は下記メソッドが使用できます。フルブラウザはモバイルとして認識されません。
// DoCoMoなら
mb::is_docomo();

// EZwebなら
mb::is_ezweb();

// Softbank(J-PHONE)なら
mb::is_softbank();

// 上記のいずれかなら
mb::is_mobile();

端末IDの取得

モバイルの場合、端末IDを取得することができます。しかし端末の設定で「送出しない」設定の場合は端末IDが取得できず、IPアドレスを返します。戻り値がIPアドレスかどうかを判断し、適切な処理を行うことができます。
$mobileId = mb::get_mobile_id();

if (is_ipaddr($mobileId)) {
  // 所得できずIPアドレスが返された
} else {
  // 取得できた
}
なお、モバイルアドオンでの端末IDの定義は下記になります。
  • DoCoMo - iモードID(取得できない場合は製造番号)
    X_DCMGUID | HTTP_USER_AGENT内のicc*
  • EZweb - EZ番号
    X_UP_SUBNO
  • Softbank - ユーザID
    X_JPHONE_UID

インプットの設置

モバイルではインプットでの入力文字種の初期値を設定することができます。その設定の仕方(属性の書き方)がキャリアによって異りますが、下記インプットタグ出力メソッドを使用すると簡単に行うことが可能です。なお、インプットの初期値($value)は内部でHTMLエスケープ、内部絵文字コード->絵文字への変換処理が行われます。
// 特に文字種を指定しない
mb::input_normal($inputname, $value = "", $type = "text", $size = null)

// カタカナ
mb::input_kana($inputname, $value = "", $type = "text", $size = null)

// 英字
mb::input_alpha($inputname, $value = "", $type = "text", $size = null)

// 数字
mb::input_number($inputname, $value = "", $type = "text", $size = null)
文字種は関係ありませんが、textarea()メソッドもあります。同様に $value はHTMLエスケープ・絵文字処理が行われます。
mb::textarea($inputname, $value = "", $rows = 5)

水平線

モバイルでは1pxの水平線を描くのも多少面倒です。(hrタグだと太い)各キャリアによって描き方も違い面倒なので hr()メソッド を使用すると良いでしょう。
mb::hr($color = "#999999", $bgColor = "#ffffff", $size = "1")
$color は水平線の色、$size は太さです。$bgColor は背景色と合わせてください。