AndroidをDisplay化
指定命令文
表示領域の指定や使用するフォントの指定を行います。
指定命令文では描画は行われません。
領域指定
Android端末の画面での表示領域を指定します。
書式
SetArea width, height, backcolor
| width | 表示領域の幅 | 表示領域の縦横比の横の値として使用されます。また領域内の位置指定時の横座標の最大値として使用されます。 |
| height | 表示領域の高さ | 表示領域の縦横比の縦の値として使用されます。また領域内の位置指定時の縦座標の最大値として使用されます。 |
| backcolor | 背景色 | 表示領域の背景色をRGBの#16進表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF |
表示領域
widthとheightの値は実際のAndroid端末の画面解像度と関係ありません。widthとheightは表示領域の横縦比を表わします。
android端末の画面ではこの横縦比で確保される最大領域が表示領域となります。
例えばwidthが100でheightが75の場合、1080*1920のスマートフォンを横向きに使う場合は、1440*1080の領域に表示されます。
またスマートフォンを縦向きにした場合は、1080*810の領域に表示されます。
座標指定と大きさ指定
画面上の座標位置を指定する場合は、表示領域の左上の点がが(0, 0)、表示領域の右下の点が(width - 1, heigh - 1)となります。
また領域の大きさや線の太さ、フォントサイズなどは表示領域の横幅をwidth、高さをheightとし、それをスケールとして値を設定して下さい。
これらの値には小数も使用できます。
フォント指定
フォント番号を指定して使用するフォントを設定します。
テキストを描画する場合にフォント番号を指定してフォントを選択します。
書式
setfont fontNum, fontFamily, textStyle, fontSize, textColor
| fontNum | フォント番号 | 1～20までが指定できます。 |
| fontFamily | フォントファミリー | (1)SERIF (2).SANS_SERIF (3)MONOSPACE または1,2,3の数字で指定します。 |
| textStyle | スタイル | (0)DEFAULT (1)BOLD (2)ITALIC (3)BOLD_ITALIC または0,1,2,3の数字で指定します。 |
| fontSize | フォントサイズ | 領域指定のwidthを基準にフォントの大きさを指定します。 widthが100の場合フォントサイズを5とした場合は、フォントサイズは表示領域の幅の1/20となります。 |
| textColor | 文字の色 | 文字色をRGBの#16進表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF |
イメージリスト指定
１つのファイルの中に複数のイメージを格納することができます。
複数のイメージは同じ大きさで、縦横の配列状に並べてに一つの画像として保存します。これをイメージリストといいます。
イメージリストの各イメージは指標によって特定します。
指標は右上を0とし、同じ行で右方向に1,2,3...と数えます。右端に達したら次の行の左端に戻り、同じように数えます。
書式
setImageList fileName, listID, width, height
| fileName | イメージリストファイル名を指定します。 フォルダは指定しません。 拡張子はjpg, pngに対応しています。 pngを使用するし背景を透明にすることができます。 |
|
| listID | イメージリストを呼び出すときのIDを指定します。 | |
| width | スタイル | (0)DEFAULT (1)BOLD (2)ITALIC (3)BOLD_ITALIC または0,1,2,3の数字で指定します。 |
| height | フォントサイズ | 領域指定のwidthを基準にフォントの大きさを指定します。 widthが100の場合フォントサイズを5とした場合は、フォントサイズは表示領域の幅の1/20となります。 |
描画命令文
画面に文字や図形を描画するための命令文です。
描画命令文の前にはIDを設定することができます。
IDについては後述します。
IDとは
描画命令の先頭にはIDを付けることができます。
IDと描画命令の間はコロン(:)で区切ります。
(例)BOLL: drawCircle 50, 50, 30, #FF0000, FILL
IDは描画命令を削除したり、非表示にしたり、表示順を変更するときの目印となります。
また、同じIDの描画命令を発行すると前の命令は削除されます。
同じIDの描画命令で位置を変えて表示すると動いたように見えます。
テキスト描画
書式
drawText text, x, y, align, fontNum[, length]
| text | テキスト | 表示するテキスト文字列を指定します。ダブルクォーテーションは不要です。カンマを含む場合は\でエスケープします。 |
| x | 横座標 | 表示位置の横座標を領域指定のwidthを最大値として指定します。小数も使用できます。 |
| y | 縦座標 | 表示位置の縦座標を領域指定のheightを最大値として指定します。小数も使用できます。 |
| align | アライメント | 座標の位置を文字列のどこに合わせるかを数字または文字で指定します。 0:left_top 1:center_top 2:right_top 3:left_middle 4:center_middle 5:right_middle 6:left_bottom 7:centrt_bottom 8:roght_bottom |
| fontNum | フォント番号 | SetFontで設定したフォント番号を設定します。 |
| length | 均等割り長さ | オプションです。均等割り長さを指定すると文字列を指定長さで均等割りします。 |
線の描画
書式
drawLine startX, startY, stopX, stopY, color, strokeWidth
| startX | 開始横座標 | 描画する線の開始横座標を指定します。 |
| startY | 開始縦座標 | 描画する線の開始縦座標を指定します。 |
| stopX | 終了横座標 | 描画する線の終了横座標を指定します。 |
| stopY | 終了縦座標 | 描画する線の終了縦座標を指定します。 |
| color | 描画色 | 線の描画色をRGBの#16進数表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF |
| lineWidth | 線幅 | 描画する線の線幅を指定します。 |
多角形描画
書式
drawPath x1, y1, x2, y2, x3, y3, [x4, y4, ....,] [close,] color, strokeWidth
| x1 | y1 | 開始座標を | 描画する多角形の開始座標を指定します。 | |
| x2 | y2 | 第2座標 | 描画する多角形の第2座標を指定します。 | |
| x3 | y3 | 第3座標 | 描画する多角形の第3座標を指定します。 | |
| x4 | y4 | .... | 第4座標 | 必要であれば描画する矩形の第4座標以降を指定します。 |
| close | 閉鎖指定 | 最初の点に戻り、多角形を閉鎖する場合はcloseを記載します。閉じない場合は不要(カンマも)です。 | ||
| color | 描画色 | 描画色をRGBの#16進数表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF | ||
| lineWidth | 線幅 | 多角形を線で描画する場合は線幅を指定します。 多角形を塗りつぶす場合はFILLを指定します。 |
矩形描画
書式
drawRect left, top, right, bottom, color, strokeWidth
| left | 左座標 | 描画する矩形の左座標を指定します。 |
| top | 上座標 | 描画する矩形の上座標を指定します。 |
| right | 右座標 | 描画する矩形の右座標を指定します。 |
| bottom | 下座標 | 描画する矩形の下座標を指定します。 |
| color | 描画色 | 描画色をRGBの#16進数表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF |
| lineWidth | 線幅 | 矩形を線で描画する場合は線幅を指定します。 矩形を塗りつぶす場合はFILLを指定します。 |
角丸矩形描画
書式
drawRoundRect left, top, right, bottom, rx, ry, color, strokeWidth
| left | 左座標 | 描画する矩形の左座標を指定します。 |
| top | 上座標 | 描画する矩形の上座標を指定します。 |
| right | 右座標 | 描画する矩形の右座標を指定します。 |
| bottom | 下座標 | 描画する矩形の下座標を指定します。 |
| rx | 角丸の横半径 | 角丸矩形の丸みの横方向の半径を指定します。 |
| ry | 角丸の縦半径 | 角丸矩形の丸みの縦方向の半径を指定します。 |
| color | 描画色 | 描画色をRGBの#16進数表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF |
| lineWidth | 線幅 | 角丸矩形を線で描画する場合は線幅を指定します。 角丸矩形を塗りつぶす場合はFILLを指定します。 |
円描画
書式
drawCircle cx, cy, radius, color, strokeWidth
| cx | 中心の横座標 | 描画する円の中心の横座標を指定します。 |
| cy | 中心の縦座標 | 描画する円の中心の縦座標を指定します。 |
| radius | 円の半径 | 円の半径を指定します。 |
| color | 描画色 | 描画色をRGBの#16進数表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF |
| lineWidth | 線幅 | 円を線で描画する場合は線幅を指定します。 円を塗りつぶす場合はFILLを指定します。 |
楕円描画
書式
drawOval left, top, right, bottom, color, strokeWidth
| left | 左座標 | 描画する楕円の左座標を指定します。 |
| top | 上座標 | 描画する楕円の上座標を指定します。 |
| right | 右座標 | 描画する楕円の右座標を指定します。 |
| bottom | 下座標 | 描画する楕円の下座標を指定します。 |
| color | 描画色 | 描画色をRGBの#16進数表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF |
| lineWidth | 線幅 | 楕円を線で描画する場合は線幅を指定します。 楕円を塗りつぶす場合はFILLを指定します。 |
円弧描画
書式
drawArc left, top, right, bottom, startAngle, sweepAngle, useCenter, color, strokeWidth
| left | 左座標 | 描画する円弧を含む楕円の左座標を指定します。 |
| top | 上座標 | 描画する円弧を含む楕円の上座標を指定します。 |
| right | 右座標 | 描画する円弧を含む楕円の右座標を指定します。 |
| bottom | 下座標 | 描画する円弧を含む楕円の下座標を指定します。 |
| startAngle | 開始角 | x 軸から円弧の開始点まで、時計回りに測定した角度 (度単位) |
| sweepAngle | 描画各 | startAngleから円弧の終了点まで、時計回りに測定した角度 (度単位) |
| useCenter | 中心点の使用 | TRUEの場合は中心点を通る直線を引いて円弧をとじます。FALSEの場合は開いた円弧になります。 |
| color | 描画色 | 描画色をRGBの#16進数表記で指定します。(例)赤 #FF0000 緑 #00FF00 青 #0000FF |
| lineWidth | 線幅 | 円弧を線で描画する場合は線幅を指定します。 円弧を塗りつぶす場合はFILLを指定します。 |
画像描画(1)
書式
drawImage fileName, left, top, width, height
| fileName | ファイル名 | 描画する画像のファイル名を指定します。 フォルダは指定しません。 拡張子はjpg, pngに対応しています。 pngを使用するし背景を透明にすることができます。 |
| left | 左座標 | 描画領域の左座標を指定します。 |
| top | 上座標 | 描画領域の上座標を指定します。 |
| width | 幅 | 描画領域の幅を指定します。０とした場合幅は高さより縦横比を固定して自動計算されます。 |
| height | 高さ | 描画領域の高さを指定します。０とした場合高さは幅より縦横比を固定して自動計算されます。 |
画像描画(2)
書式
drawImage fileName, srcLeft, srcTop, srcWidth, srcHeight, dstLeft, dstTop, dstWidth, dstHeight
| fileName | ファイル名 | 描画する画像のファイル名を指定します。 フォルダは指定しません。 拡張子はjpg, pngに対応しています。 pngを使用するし背景を透明にすることができます。 |
| srcLeft | 画像上の左座標 | 画像上の左座標を指定します。 |
| srcTop | 画像上の上座標 | 画像上の上座標を指定します。 |
| srcWidth | 画像上の幅 | 画像上幅を指定します。 |
| srcHeight | 高さ画像上の高さ | 画像上高さを指定します。 |
| dstLeft | 描画領域の左座標 | 描画領域の左座標を指定します。 |
| dstTop | 描画領域の上座標 | 描画領域の上座標を指定します。 |
| dstWidth | 描画領域の幅 | 描画領域の幅を指定します。０とした場合幅は高さより縦横比を固定して自動計算されます。 |
| dstHeight | 描画領域の高さ | 描画領域の高さを指定します。０とした場合高さは幅より縦横比を固定して自動計算されます。 |
画像描画(3)
書式
drawImage imageListID, index, left, top, width, height
| imageListID | イメージリストID | 使用するイメージリストのIDを指定します。 |
| index | イメージ指標 | 使用するイメージリストのイメージの指標を指定します。 |
| left | 左座標 | 描画領域の左座標を指定します。 |
| top | 上座標 | 描画領域の上座標を指定します。 |
| width | 幅 | 描画領域の幅を指定します。０とした場合幅は高さより縦横比を固定して自動計算されます。 |
| height | 高さ | 描画領域の高さを指定します。０とした場合高さは幅より縦横比を固定して自動計算されます。 |
表示命令文
表示の順序を変えたり、一時的に特定の描画を行わない、描画命令を削除するなどが行えます。
表示命令の指定にはIDを使用します。
表示順序設定
通常は画面には最初の指令された描画命令により図形(文字)が描かれ、その上に順次、次の描画命令により図形が描がかれていきます。
従って最初に書いた図形の上に次の図形が描かれて前の図形の一部は隠れるようになります。
このように描画命令には実行順序がありますが、最初が最下層(BOTTOM)に最後が最上層(TOP)になります。
この表示順は次の命令により変えることができます。
書式
setOrder id position[, destid]
| id | ID | 移動する命令に付けられたIDを指定します。 |
| position | 移動位置 | TOP:最上層に移動します。 BOTTON:最下層に移動します。 ABOVE:次に指定する移動先IDの上(TOP側)に移動します。 UNDER:次に指定する移動先IDの下(BOTTOM側)に移動します。 |
| destid | 移動先ID | positiontがABOVEまたはUNDERのときに、基準となる移動先の命令に付けられたIDを指定します。 |
この設定を利用すれば、動く図形が他の図形の前に移動したり、後ろに移動したりすることができます。
表示非表示設定
描画命令を一時的に非表示にしたり、元に戻したりできます。
書式
setVisible id sw
| id | ID | 設定する命令に付けられたIDを指定します。 |
| sw | 表示スイッチ | TRUE:表示します。 FALSE:非表示にします。 |
描画命令削除
発行した描画命令を削除します。
書式
remove id
| id | ID | 削除する描画命令に付けられたIDを指定します。 |