Tutorialチュートリアル
リスト表示するには
applicanではiOS/Androidアプリケーションでリスト表示することが可能です。
リスト表示するにはJavascriptを記述します。
var list_data = [
{title:"item1", value:"value1"},
{title:"item2", value:"value2"},
{title:"item3", value:"value3"}];
applican.list.show(applican.list.ListType.TITLE, '選択してください', list_data, successCallback, errorCallback);
function successCallback (result){
alert(result);
}
function errorCallback(error){
alert(error.code);
}
解説
リスト表示させたい情報の連想配列を作成し、applican.list.showメソッドに指定します。
applican.list.showの第一引数は表示形式を指定します。
表示形式は以下の8つの種類がありますので、表示したい項目の組み合わせで選択してください。
| 主テキスト | サブテキスト | 右側に値 | 左側に画像 | |
|---|---|---|---|---|
| TITLE | 〇 | |||
| SUBTITLE | 〇 | 〇 | ||
| VALUE | 〇 | 〇 | ||
| SUBTITLE_VALUE | 〇 | 〇 | 〇 | |
| PICTURE | 〇 | 〇 | ||
| PICTURE_SUBTITLE | 〇 | 〇 | 〇 | |
| PICTURE_VALUE | 〇 | 〇 | 〇 | |
| PICTURE_SUBTITLE_VALUE | 〇 | 〇 | 〇 | 〇 |
第二引数の配列はリストのタイプに応じて以下の値を指定します。
| パラメータ名 | 説明 |
|---|---|
| title | 主テキスト。常に必須。 |
| subtitle | サブテキスト。主テキストの下に表示されます。 |
| valuetitle | 右側に表示される値。(「10件」など、短い文字列) |
| picture | 左側に表示される画像。httpまたはhttps から始まるURLか、ローカルコンテンツ内のファイルへのパスを指定できます。 例1) picture:"http://hostname/test1.jpg" 例2) picture:"test1.jpg" |
| value | リストを選択した際に戻り値として返す値。常に必須。 |
成功時のコールバックにはvalueで指定した値が引数として渡されます。
失敗時のコールバックにはエラーコードが渡されます。
ListError.CANCELED リストが選択されずキャンセルされた場合。
オプションで画像サイズを指定できます。
| パラメータ名 | 説明 |
|---|---|
| width | リストに表示する画像の幅。デフォルト50 |
| height | リストに表示する画像の高さ。デフォルト 50 |
var options = {width:160, height:100};