ランチャーとタグ

MobiControl v14 Manual

1. アプリやリンクを、タグで代替

(図1)は、「ランチャーの登録」ページの(図2)に、アイテムを挿入した例です。

(図1)ランチャーのアイテム一覧 

 
(図1)の「名前」列には、端末画面のアイコンに付随する文字列が表示されます。 
プログラム」列には、アイコンのリンク(プログラムへのパスまたはファイルへのURL)が 表示されます。 
これらは、タグに代替されてランチャーのテンプレートで記述されます。  
アイコン画像のファイル名も、MobiControlのランチャーのテンプレートでは、タグで代替されて記述されます。  
ここでいうタグとは、次表で、< と > で挟まれた文字列を指します。
(図1)での列の名前 
-->
名前プログラム
 
アイコン画像
のファイル名
アイコンに
付随する文字列
アイコンのリンク 
(プログラムへのパス
またはファイルへのURL)
1番目<MCExeIcon0> <MCDisp0> <MCLink0>
2番目<MCExeIcon1> <MCDisp1> <MCLink1>
3番目<MCExeIcon2> <MCDisp2> <MCLink2>
 
画像ファイル名は、(図1)には表示されていませんが、文字列やリンクと紐づけられています。 文字列やリンクを入力した(図2)で、画像ファイル名も一緒に指定したからです、

(図2)アイテムの入力画面 

 
(図3)は、ランチャーのテンプレートの例です。

(図3)テンプレート(例) 

(図3)には、<MCExeIconN>、<MCLinkN>、 <MCDispN>の文字列が含まれています。  
Nは、0から始まる整数
これらがタグで、(図1)での、文字列やリンクを代替しています。更には、関連するアイコン画像ファイル名を代替しています。 
下表の右欄のように記述すれば、それは、左欄のように記述したのと同じ効果となります。
タグを使わない構文例タグを使った構文例
<a href=Launch://jp.kyocera.camera> 
<img src="Camera.png"><br> カメラ</a> 
<a href="<MCLink0>"> 
<img src="<MCExeIcon0>"><br> 
<MCDisp0></a> 
 
但し、(図1)で、「上へ」「下へ」ボタンを使うと、<MCDispN>などのタグが代表する アイテムは入れ替わります。

2. 画面でアイテムを横に並べる

通常の<ul> <li>の構文では、アイテムは縦に並びます。  
例えば、 下記のような構文は、右のように表示されます。 
<ul style="list-style-type: none;"> 
<li>最初 
<li>2番目 
<li>3番目 
</ul>
  • 最初
  • 2番目
  • 3番目
 
ところが、<li>に、下記のようなスタイルシート(赤文字)をつけると、アイテムは横に並びます。  
<ul style="list-style-type: none;"> 
<li style="float:left;">最初 
<li style="float:left;">2番目 
<li style="float:left;">3番目 
</ul>
  • 最初
  • 2番目
  • 3番目
 
端末画面のアイコンなどの表示順序は、各段に横に並べます。そのためには、<li>に、 style="float:left;"のスタイルシートを付けることで実現します。  
実際のテンプレートでは、スタイルシートは一括定義します。  
下記のサンプルが、<li> のスタイルシートの一括定義の例です。
(サンプル) 
<style type="text/css"> 
ul {list-style-type: none; 

li {float: left; 

</style>

 

<ul> 
<li>
<a href="<MCLink0>"> 
<img src="<MCExeIcon0>"><br> 
<MCDisp0></a> 
</li> 
<li>
<a href="<MCLink1>"> 
<img src="<MCExeIcon1>"><br> 
<MCDisp1></a>  
</li></ul>

 

左で 
<MCDisp0> は MobiControlを 
<MCDisp1> は MyWebを 
を代替しているとします。

 

また、画像は
<MCExeIcon0>がを代替しているとします。
<MCExeIcon1>がを代替してい るとします。
 

左サンプルのHTML構文だと、端末画面には次のようにアイコンが横に並びます。
 
MobiControl
 
MyWeb

3. 画像をバックグラウンドに

<MCExeIconN>は、アイコン画像を代替するタグですが、 <MCDispImgN>という、タグもあります。 
<MCExeIconN>は、HTML記述オブジェクトと同じレイヤーに画像を置きます。  
<MCDispImgN>は、HTML記述オブジェクトの背景レイヤーに画像を置きます。
(例)ここで<MCDisp0>は、 
mobicontrolという文字列の代替
画像は 

を参照
構文例ランチャでの表示例
<a href="<MCLink0>"> 
<img src="<MCExeIcon0>"><br> 
<MCDisp0></a>
<br>を使って、 
改行してから文字列表示
<a href="<MCLink0>"> 
<img src="<MCExeIcon0>"> 
<MCDisp0></a>
改行しないので 
右横に文字列
<a href="<MCLink0>"> 
<img src="<MCDispImg0>"> 
<MCDisp0></a>
画像が背景に表示される

4. テンプレートの活用

HTML文書には、「文字のサイズ、フォント、色」、バナーや背景色など、様々な要素を記述します。 
これらを配慮して、MobiControlは、幾つかのHTML文書をテンプレートとして用意してあります。 
これには、前述した、タグが挿入されています。 
これらを活用して、ランチャー用のHTML文書を作成します。  
ランチャーのテンプレート」を参照してください。