Fusion 360 API:カスタム ダイアログ

カスタム コマンドから独自に作成したダイアログ ボックスを作って、その後の処理に必要な入力値をユーザに入力させたい場合があります。もちろん、API を使ってカスタム ダイアログ表示させることは可能です。まず、カスタム コマンドを定義する手順をおさらいしておきます。 

  1. コマンド定義を作成
         - CommandDefinition オブジェクト
  2. ユーザ インタフェース上にカスタム コマンドをどう表示するか、コントロール定義を追加 
        - CommandDefinitions.addButtonDefinition メソッド
  3. コマンド定義をコマンド作成イベントを接続
        - CommandDefinition.commandCreated.add メソッド
  4. コマンド作成イベント内でコマンド実行イベントを接続
        - CommandEvent.add メソッド

この手順に沿って、[モデル ワークスペース] の [アドイン] パネルに [マイコマンド] の名前のついたコマンドを配置することを考えてみます。 

Autodesk Fusion 360の画面を示す画像。ツールバーに「アドイン」メニューと「マイコマンド」と名付けられたカスタムコマンドが表示されている。

この状態は、次のアドイン コードで実現するこが出来ます。ここでは、JavaScript で例を示します。 

function run(context) {
    "use strict";
    if (adsk.debug === true) {
        /*jslint debug: true*/
        debugger;
        /*jslint debug: false*/
    }
    var app;
    var ui;
    try
    {
        app = adsk.core.Application.get();
        ui = app.userInterface;
        // CommandExecuted event handler.
        var onCommandExecuted = function(args)
        {
            try
            {
                args.isValidResult = true;
                ui.messageBox('CommandExecuted');
            }
            catch (e)
            {
                ui.messageBox('CommandExecuted Failed : ' + (e.description ? e.description : e));
            }
        };
        // CommandCreated event handler.
        var onCommandCreated = function(args)
        {
            try
            {
                var cmd = args.command;
                cmd .execute .add(onCommandExecuted);
            }
            catch (e)
            {
                ui.messageBox('CommandCreated Failed : ' + (e.description ? e.description : e));
            }
        };
        var onInputChanged = function(args)
        {
            try
            {
                var command = adsk.core.Command(args.firingEvent.sender);
                ui.messageBox('Input: ' + command.parentCommandDefinition.id + ' changed event triggered');
            }
            catch (e)
            {
                ui.messageBox('Input changed event failed: ' + errorDescription(e));
            }
        };
        var cdfs = ui.commandDefinitions;
        var cdf = ui.commandDefinitions.itemById('adnjapan-ui-test1');
        if (!cdf)
        {
            var myCommand = cdfs.addButtonDefinition('adnjapan-ui-test1', 'マイコマンド', 'カスタム ダイアログを表示', './Resources');
            var ws = ui.workspaces.itemById('FusionSolidEnvironment');
            var tps = ws.toolbarPanels;
            var tp = tps.itemById('SolidScriptsAddinsPanel');
            tp.controls.addCommand(myCommand);
            var commandCreatedEvent = myCommand.commandCreated;
            commandCreatedEvent.add(onCommandCreated);
        }
    }
    catch (e)
    {
        if (ui)
        {
            ui.messageBox('Failed : ' + (e.description ? e.description : e));
        }
    }
}
function stop(context) {
    var ui;
    try
    {
        var app = adsk.core.Application.get();
        ui = app.userInterface;
        var cdf = ui.commandDefinitions.itemById('adnjapan-ui-test1');
        if (cdf)
        {
            var ws = ui.workspaces.itemById('FusionSolidEnvironment');
            var tps = ws.toolbarPanels;
            var tp = tps.itemById('SolidScriptsAddinsPanel');
            var mycommand = tp.controls.itemById('adnjapan-ui-test1');
            mycommand.deleteMe();
            cdf.deleteMe();
        }
    }
    catch (e)
    {
        if (ui)
        {
            ui.messageBox('Failed : ' + (e.description ? e.description : e));
        }
    }
}

ここで作成したカスタム コマンド [マイコマンド] には、一意な ID として ‘adnjapan-ui-test1’ を与えています。この ID は、Fusion 360 のセッション中存続し続けるので、カスタム コマンドと関連付けられたボタン コントロールの有無を識別に利用することが出来ます。このコードでは、アドインが停止する際にコマンド定義とボタン コントロールを削除しています。

カスタム コマンドが実行された際にカスタム ダイアログを表示させるには、コマンド作成イベント中で オブジェクト モデル のブログ記事でご紹介したインプット オブジェクトを利用します。最も一般的なのは、ValueInput オブジェクトです。

ここでは、下記のようなカスタム ダイアログを表示させる場合を考えてみます。 

カスタムダイアログボックス「マイコマンド」、文字列、実数、角度の入力フィールドとOK・キャンセルボタンを含む

このカスタム ダイアログは、前述のコードにあるコマンド作成イベント内で、下記の青字部分を追加します。コマンド作成イベントのパラメータから Command オブジェクトを取得することが出来るので、CommandInputs.addValueInput メソッドを呼び出して、 adsk.core.ValueInput.createByString(‘2’); のように静的な呼び出しで作成した ValueInput オブジェクトを追加します。ValueInput オブジェクトには、文字列を入力させるための createByString メソッドと、実数を入力させるための createByReal メソッドがあり、それぞれのパラメータにダイアログ上に表示される際の初期値、単位表記を指定することが出来ます。

// CommandCreated event handler.
var onCommandCreated = function(args)
{
    try
    {
        var cmd = args.command;
        cmd. execute. add(onCommandExecuted);
        cmd.inputChanged.add(onInputChanged);
        var uom = app.activeProduct.unitsManager;
        var inputs = cmd.commandInputs;
        var value = adsk.core.ValueInput.createByString('2');
        var val1 = inputs.addValueInput('val1', '文字列', uom.defaultLengthUnits, value);
        value = adsk.core.ValueInput.createByReal(5);
        var val2 = inputs.addValueInput('val2', '実数', uom.defaultLengthUnits, value);
        value = adsk.core.ValueInput.createByReal(3.14159);
        var val3 = inputs.addValueInput('val3', '角度', 'deg', value);
    }
    catch (e)
    {
        ui.messageBox('CommandCreated Failed : ' + (e.description ? e.description : e));
    }
};

Fusion 360 API では、上記のような処理で自動的に [OK] ボタンと [キャンセル] ボタンを持つダイアログ ボックスが表示されるようになります。この部分は、他のオブジェクト指向 API とは大分異なります。ただ、設定した各入力項目は、自動的に桁数や数値の判断が実施されます。例えば、createByReal メソッドで作成した項目にアルファベットを入力すると、 [OK] ボタンがマスクされてクリック出来なくなるばかりか、入力値が不正であることを知らせるために、値が赤く表示されます。

カスタムダイアログボックス 'マイコマンド' の入力欄に、文字列、実数、角度の値を入力するためのフィールドが表示されている。

もし、独自のチェックが必要な場合には、赤字で指定した InputChanged イベントハンドラで実装が可能です。

なお、上記コード内で UnitsManager オブジェクトの defaultLengthUnits プロパティを参照していますが、これは、[基本設定] ダイアログの設定値を参照しています。このコード例の場合には、[モデル] ワークスペースでの使用を想定しているので、「デザイン」の単位が採用されることになります。指定した値が指定した単位で変換されている点にもご注意ください。

Fusion 360の基本設定画面が表示され、'設計'と'CAM'のオプションが選択されています。デフォルトの単位設定を' mm'に変更できるドロップダウンがあります。

カスタム ダイアログ上の項目が正しく入力されて [OK] ボタンがクリックされた場合のみ、コマンド実行イベントが発生します。実際の処理は、このコマンド実行イベントで処理しますが、[キャンセル] ボタンがクリックされた際には、このイベントは発生しません。なお、ダイアログ上の各値は、コマンド実行イベント内で args.command.commandInputs.itemById(‘val1’).value のように取得することが可能です。

// CommandExecuted event handler.
var onCommandExecuted = function(args)
{
    try
    {
        args.isValidResult = true;
        ui.messageBox(args.command.commandInputs.itemById('val1').value + '\n' +
                      args.command.commandInputs.itemById('val2').value + '\n' +
                      args.command.commandInputs.itemById('val3').value);
    }
    catch (e)
    {
        ui.messageBox('CommandExecuted Failed : ' + (e.description ? e.description : e));
    }
};

ここまでの説明を実装したコマンドの動作をまとめましたので、下記の動画でご確認ください。なお、カスタム コマンドのボタン定義で使用するリソース ファイルも含め、完全なアドインのソースコード一式は、こちら からダウンロードすることが出来ます。

なお、カスタム ダイアログには、ValueInput オブジェクトで指定可能な文字列と実数のほかにも、多彩なコントロールを表示することが出来ます。 詳細は、オンラインヘルプを参照してみてください。

By Toshiaki Isezaki

Discover more from Autodesk Developer Blog

Subscribe now to keep reading and get access to the full archive.

Continue reading