MZ Platform開発チュートリアルL13(電卓の機能を拡張してみよう)

このチュートリアルは『開発チュートリアル(実践編)』を基に説明しています。
サンプルアプリケーションはLesson13(拡張版電卓)1.mzax, Lesson13(拡張版電卓)1a.mzaxです。

  1. 画面を作成する
  2. 完成画面確認

    ここでは Lesson.5 で作成 した電卓の機能を次のように拡張していきます。
    1.2桁以上の桁が扱える
    2.四則演算できる

    画面確認
    1. Lesson.5と比較して電卓の完成図を確認しましょう。

    任意桁の計算

    1桁同士の計算ではなく、任意桁同士の計算ができるようにします。
    通常の電卓では、任意桁の数値を入力するには数字ボタンを連続して押すと、後から押した数字が表示されている数字の右側に追加されて複数の桁 になっていきます。
    その後、演算子ボタン(+や-など)やイコールボタンを押すと表示されている数値を使って計算します。
     このような任意桁を利用するには以下のことが必要になります。
     1.[数字]ボタンからの一連の入力を文字列の連結として処理する
     2.連結された文字列を数値に変換する
    これらの処理を可能にするために『変数』コンポーネントを利用します。

    変数コンポーネント

    変数コンポーネントとは各種のデータを一時的に保持して(格納して)、保持したままそのデータに対する操作を行うコンポーネントの総 称です。
    文字データが格納 できる変数や、数値データが格納できる変数など多くの種類があります。  
    連結された文字列を数値に変換する処理も、変数コンポーネントで行います。
    1. [数字]ボタンから連続して入力された数字を文字列として連結する処理を変数コンポーネントで行います。
    2. また、連結された文字列を数値に変換する処理も変数コンポーネントで行います。

    1. Lesson.5とLesson.13の数値入力 フィールドへの数値の表示の違いを確認します。
      1. Lesson.5では[数字]ボタンを押したら、直接数値が[数値入力フィールド]に表示されました。
      2. Lesson.13では[数字]ボタンが押されたら、変数コンポーネントを用いて数字を文字列として連結して
        (1)複数の桁にして、
        (2)文字列から数値に変換して、その後、数値入力フィールドに表示します。
    コンポーネント追加
    1. 以下のコンポーネントを追加します。
    2. コンポーネント名 必要数 カテゴリー コンポーネントキー
      文字列格納変数 処理部品>変数 入力文字列格納変数
      任意精度実数(BigDecimal)格納変数 処理部品>変数 内部数値格納変数

    3. 2つの変数のコンポーネントキーを変更します。
    Lesson.5での数値の表示
    Lesson.13での数値の表示
    接続処理設定
    1. 起動時の変数の初期化
      1. アプリケーションを起動したときに「 文字列格納変数( 入力文字列格納変数) 」に 0 を設定して初期化しておく。
        アプリケーション開始イベントの接続先に「 文字列格納変数( 入力文字列格納変数) 」を設定します。
        メソッド「文字列を設定する(String)」を選択し、引数に固定値で「0」を設定します。

      [編集画面図1] 右 側接続先クリックすると起動メソッド図別窓表示 

    2. 数字ボタンの起動メソッドの変更
    3. [ 文字列格納変数(入力文字列格納変数) ]に格納してあるデータを数値データに変更するため[任意精度実数 (Big Decimal) 格納変数(内部数値格納変数)]にセットします。
      1. 【接続1-1】数字ボタンを押したら文字列格納変数に格納し、次に押された数字と連結します。
        Lesson5での【接続1-1】[ボタン(1)]の接続先を[文字列格納変数(入力文字列格納変数) ]に変更します。
        メソッド「指定した文字列と連結して置き換える(String)」を選択し、引数に固定値で「1」を設定します。
      2. 各[ボタン](2)~(9)【接続1-2】~【接続1-9】の接続先を削除し、【接続1-1】接続処理をコピーして貼り付け ます 。
        引数は各ボタン名に合わせて「2」~「9」に変更します。

      [編集画面図2] 右側接続先クリック すると起動メソッド図別窓表示 

    4. 文字列データを数値データに変換
    5. Lesson.5 では[数字]ボタンを押すと数字が直接[数値入力フィールド]に表示されていましたが、 [数字]ボタンを押すと[文字列格納変数( 入力文字列格納変数) ]に格納するように変更します。
      1. 【接続14-1】文字列格納変数に格納してあるデータを内部数値格納変数に格納する(数値に変換される)
        [文字列格納変数( 入力文字列格納変数) ]のデータ設定イベントの接続先に[文字列格納変数( 入力文字列格納変数) ]を設定します。
        メソッド「数値を文字列で設定する(String)」を選択します。
        引数:イベント内包、イベント対象データ
    6. 数値データを[数値入力フィールド]に表示
    7. [ 任意精度実数格納変数( 内部数値格納変数) ]にセットされているデータを[数値入力フィールド]に表示します。
      1. 【接続15-1】内部数値格納変数に値がセットされたら数値入力フィールドに表示する
        [ 任意精度実数格納変数( 内部数値格納変数)]のデータ設定イベントの接続先に[数値入力フィールド ]を選択します。
        メソッド「表示したい文字列を設定する(String)」を選択します。
        引数:イベント内包、イベント対象データ
        ※【接続12-1】をコピーして貼り付けて利用すると簡単です
    8. [加算]コンポーネントの処理の変更
    9. Lesson.5 では加算コンポーネントの処理結果が直接[数値入力フィールド]に設定されていましたが、[文字列格納変数( 入力文字列格納変数 ]と[ 任意精度実数 (BigDecimal) 格納変数(内部数値格納変数) ]を追加したので、以下のように修正を行います。
      1.[任意精度実数 (BigDecimal) 格納変数(内部数値格納変数)  ]の数値を処理結果に置き換える
      2.演算を行った後に[ 文字列格納変数( 入力文字列格納変数 ]の文字列を「0」に初期化する
      1. 【接続12-3】[任意精度実数 (BigDecimal) 格納変数]の数値を処理結果に置き換える
        [加算(+)]の処理完了イベントの接続先に[任意精度実数 (BigDecimal) 格納変数 ]を設定します。
        メソッド「表示したい文字列を設定する(String)」を選択します。
        引数:イベント内包、イベント対 象データ
      2. 【接続12-4】演算を行った後に[入力文字列格納変数]の文字列を「0」に初期化する
        [加算(+)]の処理完了イベントの接続先にに「文字列格納変数(String)]を設定します。
        メソッド「文字列を設定する(イベント発生無し) (String)」を選択します。
        引数:固定値、「0」
        ※メソッドに「イベント発生無し」を選択しないとエラーが発生します。

      [編集画面図3]  
      ※右側の接続先をクリックすると、起動メソッド情報の画像が表示されます。(【接続12-2】は省略)

  3. [0]ボタンと[.(小数点)]ボタンを追加
  4. 任意桁の表示が可能になったので[0]ボタンと[. (小数点)]ボタンを追加し ましょう。

    [0]と小数点ボタンの追加

    完成画面図[0]ボタンと [.(小数点)]ボタンを追 加します。

    コンポーネント追加
    1. 以下のコンポーネントを追加します。
    2. コンポーネント名 必要数 カテゴリー テキスト
      ボタン 画面構成部品>ボタン
      .(小数点)
    画面編集
    1. 画面編集画面で[ボタン(0)]と[ボタン(.)]を完成画面図を参考に適当な位置に配置します。
    接続処理の作成
    1. 【接続16-1】[ボタン(0)]のアクションイベントの接続先に[文字列格納変数( 入力文字列格納変数) ]を設定します。
      メソッド「指定した文字列と連結して置き換える(String)」を選択し、引数を固定値で「0」に設定します。
      【接続1-1】の接続先処理をコピーし、アクションイベントに貼り付けて引数だけを変更すると簡単です。
    2. 【接続17-1】[ボタン(.)]のアクションイベントの接続先も同様にし、引数は「.」とします。

    エラー処理

    [.(小数点)]ボタンが追加されたことで、この時点でアプリケーションはボタンの組み合わせでエラーが発生 するようになります。
    [.(小数点)]ボタンを2回押すとエラーになり、エラーダイアログが表示されます。
    文字列の数値への 変換が失敗するためです。
    この状態になった場合、そのまま続けて数字を入力しても[ 文字列格納変数( Key: 入力文字列格納変数) ]に保持されているデータは数値に変換できない状態になっているので、エラーが繰り 返し表示されます。
    このような場合には、[Cボタン]を押して文字列をクリアすることでその状態を抜けることができます。

    このようにエラーが発生した場合の処理をビルダー上で記述しておくことができます。
    エラー処理の方法としては、[ 文字列格納変数( Key: 入力文字列格納変数) ]から最後に入力された文字(2回目の小数点)を 1つ取り除く必要があります。
    (例: 0.2345. →0.2345)
    エラーが発生するのは文字列を数値に変換するときなのでそこにエラー処理を記述しておきます。
    [任意精度整数(BigInteger) 格納変数]を追加して、エラーが発生したら[ 文字列格納変数( Key: 入力文字列格納変数) ]の最後尾の文字を1文字削除するようにします。

    コンポーネント追加
    1. 以下のコンポーネントを追加します。
    2. コンポーネント名 必要数 カテゴリー
      任意精度整数(BigInteger)格納変数 1 処理部品>変数
    接続処理の作成
      [文字列格納変数(入力文字列格納変数)]のデータ設定イベントに以下の設定をします。
    1. 【接続14-2】エラーが発生したときの文字列の長さを取得する
      接続先に[任意精度整数(BigInteger)格納変数]とし、メソッド 「数値(BigInteger) を設定する (BigInteger)」を選択します。
      引数:メソッド戻り値、文字列格納変数(入力文字列格納変数)、文字列の長さを取得する
    2. 【接続14-3】エラーが発生したときに文字列の最後尾の1文字を削除する
      [任意精度整数(BigInteger)格納変数]を接続し、メソッド「数値を1減らす()」を選択します。
    3. 【接続14-4】一文字削除した文字列に置き換える
      [文字列格納変数(入力文字列格納変数)]内の値を、文字列長さを1つ減らした文字列に置き換えます。
      [文字列格納変数(入力文字列格 納変数)]を接続先とし、メソッド「指定インデックス間の部分文字列に置き換える(int,int)」を選択します。
      引数0:固定値、「0」
      引数1:メソッド戻り値、任意精度整数(BigInteger)格納変数、整数(BigInteger)を取得する
      ※置換えたい部分文字列の開始位置と終了位置を引数で指定します。
    1. 起動モード「エラー発生時起動」を設定します。
      1. 以上の【接続14-2】~【接続14-4】を[Shift]キーを押しながらまとめて選択します。
      2. 選択した接続先コンポーネント上で右クリック>[起動モード]>[エラー発生時起動]を選択します。
      3. 接続処理を示す線の左側に「ErrorOnly」と表示されます。
    Lesson.5での数値の表示

    [編集画面図4] 右 側接続先クリックすると起動メソッド図別窓表示