2 実践編

2.1 ソースの作成

チャートのソースは,普段使い慣れているテキストエディタを使用するなどして作成してください.

保存するソースファイルの拡張子に制限はありませんが,「.hcp」などの分かりやすい名前にして保存(1)することをお勧めします.

  1. これは,第3章で紹介する,一括変換コマンドを利用する際に必要になる事柄です

2.1.1 インデント

項目の前にタブやスペースを挿入してソースをインデントすることで,チャートの階層構造を表現することができます. インデントしたソース(リスト[段下げを行ったソース])と,その表示結果(図[段下げを行ったソースの表示結果])を示します.

リスト 2.1.1.1 段下げを行ったソース
処理
	前処理
	本処理
	後処理
図 2.1.1.1 段下げを行ったソースの表示結果

2.1.2 コメント

コメントアウトしたいソースの一行目に「#」を挿入すると,その行全体がコメントとして扱われます.

リスト 2.1.2.1 コメントアウトを行ったソース
処理
	前処理
	本処理
#	後処理
図 2.1.2.1 コメントアウトを行ったソースの表示結果

2.1.3 コマンド

「○」で表現される項目以外を表現したり,モジュール分割を行う場合はソースにコマンドを記述します.

コマンドは半角の“¥”の後にコマンド名を記述し,半角のスペースを空けて,内容を記述するという書式(リスト[コマンドの書式]")です. ただし,内容の記述が不要なコマンドも存在します.

リスト 2.1.3.1 コマンドの書式
¥コマンド名 内容

コマンドは以下の3種類に大別することができます.次からそれぞれのコマンドの詳細を解説します.

(1) ヘッダーコマンド

ソースにチャートのタイトル,作成した人などのヘッダー情報を付けることができます.

チャートのソース本体の前に,表[ヘッダーコマンド一覧]に示すヘッダーコマンドを記述してください.記述する順番は問いません. コマンドを記述しない場合,内容が空のヘッダーが付与されます.

表 .1 ヘッダーコマンド一覧
コマンド 内容
¥title タイトル
¥author 作成者
¥date 作成日
¥version バージョン情報
リスト .1 ヘッダーコマンドを記述したソース
¥title はじめてのHCPチャート
¥author 杉浦 学
¥date 2004.04.12
¥version 1.0

処理
	前処理
	本処理
	後処理
図 .1 ヘッダーコマンドを記述したソースの表示結果

(2) モジュールコマンド

モジュールの開始位置に「¥module モジュール名」というコマンドを書くことで, 1つのファイルで複数のモジュールを表現し,各モジュールをタブで分割して閲覧することができます.

このモジュール名は自動的にヘッダーにも記述されます.

なお,他のモジュールを呼び出す二重丸の項目を記述する場合,「¥mod 呼び出しモジュール名」で記述します.

表 .1 モジュールコマンド一覧
コマンド 内容
¥module モジュール分割位置の指定
¥mod モジュール呼び出し項目

モジュールコマンドを使用したソースをリスト[モジュールコマンドを記述したソース]に,その表示結果を図[モジュールコマンドを記述したソースを表示結果(mainモジュール)]図[モジュールコマンドを記述したソースを表示結果(sellモジュール)]に示します.

リスト .1 モジュールコマンドを記述したソース
¥title 自動販売機アプリケーション
¥author 杉浦 学
¥date 2004.04.12
¥version 1.0

¥module main
商品(缶ジュース)の販売と管理を行う
	自動販売機アプリケーションの開始を知らせる
	¥mod 商品を販売する
	自動販売機アプリケーションの終了を知らせる

¥module sell
商品を販売する
	購入したい商品の入力を受け取る
	選択された商品を排出する
図 .1 モジュールコマンドを記述したソースを表示結果(mainモジュール)
図 .2 モジュールコマンドを記述したソースを表示結果(sellモジュール)

(3) 通常コマンド

チャート中の記号を表現するためのコマンドの一覧と,良く使用される組み合わせ例を示します.

表 .1 通常コマンド一覧
コマンド 内容 表示形態
¥repeat 繰り返し処理
¥fork 振り分け処理
¥branch 分岐条件
¥return 脱出
¥ec エラーチェック処理
¥ex エラー出口

        ※「¥return 数字」で脱出する階層数を指定することもできます.

(i) 振り分け処理と条件の記述例

振り分け処理と条件を記述したソース例とその表示結果を示します.

リスト .1 振り分け処理と条件を記述したソース
¥title 振り分け処理の記述例
¥author 杉浦 学
¥date 2004.04.12
¥version 1.0

¥module main
処理
	¥fork 振り分け処理
		¥branch 条件その1
			条件その1が真だったときの処理
		¥branch 条件その2
			条件その3が真だったときの処理
		¥branch 条件その3
			条件その2が真だったときの処理
図 .1 振り分け処理と条件を記述したソースの表示結果

(ii) 繰り返し処理と脱出の記述例

繰り返し処理と脱出を記述したソース例とその表示結果を示します.

リスト .1 繰り返し処理と脱出を記述したソース
¥title 繰り返し処理と脱出
¥author 杉浦 学
¥date 2004.04.12
¥version 1.0

¥module main
処理
	¥repeat 繰り返し処理
		¥fork 終了条件の確認
			¥branch 終了条件
				¥return
		処理
図 .1 繰り返し処理と脱出を記述したソースの表示結果

2.2 アプリケーションの概観と機能の概要

図[アプリケーションの概観]にアプリケーションの概観と,それぞれがどのような機能を果たすかを示します.

図 2.2.1 アプリケーションの概観

2.3 チャートの閲覧

作成したチャートのソースを清書した結果を閲覧するための方法を解説します.

2.3.1 ソースの読み込み

作成したチャートのソースを読み込むには,「File」→「Open」から表示したいソースファイルを選択するか, 起動しているアプリケーションにソースファイルをドラッグアンドドロップします.

2.3.2 再読み込み

チャートのソースを編集した場合,ソースファイルの再読み込みを行うことができます.

「File」→「Reload」を選択するか,ショートカットキーであるF5をタイプしてください.

2.3.3 表示するモジュールの切り替え

複数のモジュールからなるソースを読み込んだ場合,メニューバーの下方のタブをクリックすることで表示するモジュールを切り替えることができます.

2.3.4 デバッグコンソールの利用

表示するソースを読み込んだ際のコンパイルエラーを表示することができます.

「Option」→「Debug Console」にチェックを入れると,アプリケーションのウィンドウの下方にDebug Consoleを表示(デフォルトはOFF)することができます.チェックをはずすと非表示になります.

コンソールに表示されている内容をクリアーしたい場合は,右にある消しゴムのボタンを押してください.

図 2.3.4.1 デバッグコンソール

2.4 チャートの印刷

清書されたチャートの表示結果を印刷したい場合は,「File」→「Print」を選択してください. 印刷用のプリンタを選択するウィンドウが表示されます.

なお,印刷されるチャートは,タブで選択されて表示されているモジュールのみになります.

2.5 清書したチャートの保存

チャートの表示結果をSVG形式のイメージとして保存することができます.

「File」→「Print」→「Export」→「SVG」を選択すると,保存するファイル名を入力 するためのウィンドウが表示されます(デフォルトは「ファイル名_モジュール名.svg」になります).

なお,保存されるチャートは,タブで選択されて表示されているモジュールのみになります.