900350_ja-JP

liliconcom

アプリケーションビルダーを使用してGUIを作成する

I'm looking for the most efficient workflow to create GUI windows in JSL. I know I can script them manually using New Window() with nested layout boxes (V List Box, H List Box, etc.), but this can be time-consuming and difficult to visualize for more complex dialogs.

アプリケーションビルダーを試してみたのですが、コントロールをドラッグ＆ドロップして視覚的にレイアウトをデザインできるのが素晴らしいです。しかし、アプリケーションを保存すると、名前空間を備えた完全なアプリケーションフレームワークが生成されます。

私の具体的な質問は次のとおりです。 Is it possible to use the Application Builder (or another tool) to create a window layout and then extract only the JSL code for the New Window object itself?

私は多くの場合、単一のモーダル ダイアログまたは設定ウィンドウを作成しようとしているだけであり、それに付属するアプリケーション構造全体は必要ありません。

自動化とスクリプトウィンドウズRe: アプリケーションビルダーを使用してGUIを作成する

これを実現するための既成の方法は存在しないと思いますので、独自の「パーサー」を作成する必要があります。少なくとも単純なケースであれば、LLMを適切にプロンプ​​トすれば実行できるかもしれません。

Re: アプリケーションビルダーを使用してGUIを作成する

こんにちは@shuey 、

@jthiのコメントに追加すると (現在これを行う方法はありません)、編集 > ツリー構造の取得と、LLM に配置できる構築したコンポーネントの「プロパティの取得」を使用すると役立つ場合があります。

これは便利な機能であることに同意します。JMPウィッシュ リストに追加することをお勧めします。

ありがとう、

ベン

Re: アプリケーションビルダーを使用してGUIを作成する

かなり基本的なJMPのようなプラットフォームランチャーを考えてみると

以下のJMPアプリスクリプトが生成されます

もっと見る...

JMP App(
	Set Name("Application"),
	Set Description(
		"An empty workspace for creating custom applications with one or more windows and scripts"
	),
	Auto Launch(1),
	Snap To Grid(1),
	Show Grid(1),
	Show Properties(1),
	Show Sources(1),
	Group By Category(1),
	Dashboard Mode(0),
	Parameters,
	Tables(
		DataTable1 = GuiTable(
			Set Path(""),
			Set Label("Untitled 2"),
			Location("Current Data Table"),
			Invisible(0)
		)
	),
	Script(JSL Quote(// This script is executed when the application is run.
// Named objects have been created for the application modules
// (for example, "Module1") and the pre-defined object
// "thisApplication" refers to the application object itself.
// Variables and functions declared here are scoped to the
// Application namespace.

)	),
	Allocate(
		Module1 = Plan(
			PreAllocate,
			Script(JSL Quote(// This script is executed when a new module instance is
// created.  The pre-defined object "thisModuleInstance" refers
// to the instance object, but other objects such as boxes and
// scripts have not yet been created.  Variables declared here are
// scoped to the ModuleInstance namespace.

// This special function will receive parameters passed to CreateInstance()
OnModuleLoad({},
);

thisModuleInstance << Create Objects;

// After this point your module instance objects have been created
// and can be referred to by name (for example, "Button1").

)			),
			Allocate(
				List1 = H List Box();
				Panel1 = Panel Box();
				FilterCol1 = Filter Col Selector(Data Table(DataTable1));
				Panel2 = Panel Box();
				Lineup2 = Lineup Box();
				Button3 = Button Box();
				ColList1 = Col List Box(Data Table(DataTable1));
				Text1 = Text Box();
				Combo1 = Combo Box();
				Text2 = Text Box();
				CheckBox1 = Check Box();
				Panel3 = Panel Box();
				Lineup1 = Lineup Box();
				Button1 = Button Box();
				Button2 = Button Box();
			),
			Organize(
				Reparent(Lineup1(Button2));
				Reparent(Lineup1(Button1));
				Reparent(Panel3(Lineup1));
				Reparent(List1(Panel3));
				Reparent(Lineup2(CheckBox1));
				Reparent(Lineup2(Text2));
				Reparent(Lineup2(Combo1));
				Reparent(Lineup2(Text1));
				Reparent(Lineup2(ColList1));
				Reparent(Lineup2(Button3));
				Reparent(Panel2(Lineup2));
				Reparent(List1(Panel2));
				Reparent(Panel1(FilterCol1));
				Reparent(List1(Panel1));
				Relocate(List1(200, 250));
			),
			Initialize(
				List1 << Background Color("None");
				List1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				List1 << Enabled(1);
				List1 << Horizontal Alignment("Default");
				List1 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				List1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				List1 << Text Color("None");
				List1 << UI Only(0);
				List1 << Vertical Alignment("Default");
				List1 << Visibility("Visible");
				List1 << Set Min Size(756, 403);
				List1 << Set Max Size(756, 403);
				List1 << Set Stretch({"Neutral", "Neutral"});
				List1 << set horizontal(1);
				Panel1 << Background Color("None");
				Panel1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Panel1 << Enabled(1);
				Panel1 << Horizontal Alignment("Default");
				Panel1 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				Panel1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Panel1 << Text Color("None");
				Panel1 << UI Only(0);
				Panel1 << Vertical Alignment("Default");
				Panel1 << Visibility("Visible");
				Panel1 << Set Min Size(234, 110);
				Panel1 << Set Max Size(234, 110);
				Panel1 << Set Stretch({"Neutral", "Neutral"});
				Panel1 << Set Title("Panel1");
				FilterCol1 << Background Color("None");
				FilterCol1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				FilterCol1 << Enabled(1);
				FilterCol1 << Horizontal Alignment("Default");
				FilterCol1 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				FilterCol1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				FilterCol1 << Text Color("None");
				FilterCol1 << UI Only(0);
				FilterCol1 << User Resizable({1, 1});
				FilterCol1 << Vertical Alignment("Default");
				FilterCol1 << Visibility("Visible");
				FilterCol1 << Set Min Size(194, 52);
				FilterCol1 << Set Max Size(194, 52);
				FilterCol1 << Set Stretch({"Neutral", "Neutral"});
				FilterCol1 << Set Base Font("Text");
				FilterCol1 << Set Font Name("Segoe UI");
				FilterCol1 << Set Font Style("Plain");
				FilterCol1 << Set Font Size(10);
				FilterCol1 << Set Font Scale(1);
				FilterCol1 << Set Max Selected(-1);
				FilterCol1 << Set Size(184, 23);
				FilterCol1 << Set N Lines(1);
				Panel2 << Background Color("None");
				Panel2 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Panel2 << Enabled(1);
				Panel2 << Horizontal Alignment("Default");
				Panel2 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				Panel2 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Panel2 << Text Color("None");
				Panel2 << UI Only(0);
				Panel2 << Vertical Alignment("Default");
				Panel2 << Visibility("Visible");
				Panel2 << Set Min Size(334, 383);
				Panel2 << Set Max Size(334, 383);
				Panel2 << Set Stretch({"Neutral", "Neutral"});
				Panel2 << Set Title("Panel2");
				Lineup2 << N Col(2);
				Lineup2 << Background Color("None");
				Lineup2 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Lineup2 << Enabled(1);
				Lineup2 << Horizontal Alignment("Default");
				Lineup2 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				Lineup2 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Lineup2 << Text Color("None");
				Lineup2 << UI Only(0);
				Lineup2 << Vertical Alignment("Default");
				Lineup2 << Visibility("Visible");
				Lineup2 << Set Min Size(294, 325);
				Lineup2 << Set Max Size(294, 325);
				Lineup2 << Set Stretch({"Neutral", "Neutral"});
				Lineup2 << Spacing(2);
				Button3 << Background Color("None");
				Button3 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Button3 << Enabled(1);
				Button3 << Horizontal Alignment("Default");
				Button3 << Margin({Left(2), Top(2), Right(2), Bottom(2)});
				Button3 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Button3 << Text Color("None");
				Button3 << UI Only(0);
				Button3 << Vertical Alignment("Default");
				Button3 << Visibility("Visible");
				Button3 << Set Min Size(60, 21);
				Button3 << Set Max Size(60, 21);
				Button3 << Set Stretch({"Neutral", "Neutral"});
				Button3 << Set Button Name("Button3");
				Button3 << Style("Normal");
				Button3 << Set(0);
				Button3 << Set Icon("");
				Button3 << Set Icon Location("Right");
				ColList1 << Background Color("None");
				ColList1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				ColList1 << Enabled(1);
				ColList1 << Horizontal Alignment("Default");
				ColList1 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				ColList1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				ColList1 << Text Color("None");
				ColList1 << UI Only(0);
				ColList1 << User Resizable({1, 1});
				ColList1 << Vertical Alignment("Default");
				ColList1 << Visibility("Visible");
				ColList1 << Set Min Size(184, 194);
				ColList1 << Set Max Size(184, 194);
				ColList1 << Set Stretch({"Neutral", "Neutral"});
				ColList1 << Modeling Type({"Continuous", "Ordinal", "Nominal"});
				ColList1 << Set Data Type("Any");
				ColList1 << Set Min Items(0);
				ColList1 << Set Max Items(-1);
				ColList1 << Set Max Selected(-1);
				ColList1 << Set Size(184, 194);
				ColList1 << Set N Lines(10);
				ColList1 << Set Base Font("Text");
				ColList1 << Set Font Scale(1);
				Text1 << Background Color("None");
				Text1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Text1 << Enabled(1);
				Text1 << Horizontal Alignment("Default");
				Text1 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				Text1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Text1 << Text Color("None");
				Text1 << UI Only(0);
				Text1 << Vertical Alignment("Default");
				Text1 << Visibility("Visible");
				Text1 << Set Min Size(64, 19);
				Text1 << Set Max Size(64, 19);
				Text1 << Set Stretch({"Neutral", "Neutral"});
				Text1 << Set Base Font("Text");
				Text1 << Set Font Scale(1);
				Text1 << Set Text("Text1");
				Text1 << Bullet point(0);
				Text1 << Justify Text("Left");
				Text1 << Rotate Text("Horizontal");
				Text1 << Set Width(-1);
				Text1 << Set Wrap(360);
				Text1 << Set Tip("");
				Combo1 << Background Color("None");
				Combo1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Combo1 << Enabled(1);
				Combo1 << Horizontal Alignment("Default");
				Combo1 << Margin({Left(2), Top(2), Right(2), Bottom(2)});
				Combo1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Combo1 << Text Color("None");
				Combo1 << UI Only(0);
				Combo1 << Vertical Alignment("Default");
				Combo1 << Visibility("Visible");
				Combo1 << Set Min Size(180, 23);
				Combo1 << Set Max Size(180, 23);
				Combo1 << Set Stretch({"Neutral", "Neutral"});
				Combo1 << Set Items({"Item1", "Item2"});
				Combo1 << Set(1);
				Text2 << Background Color("None");
				Text2 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Text2 << Enabled(1);
				Text2 << Horizontal Alignment("Default");
				Text2 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				Text2 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Text2 << Text Color("None");
				Text2 << UI Only(0);
				Text2 << Vertical Alignment("Default");
				Text2 << Visibility("Visible");
				Text2 << Set Min Size(64, 19);
				Text2 << Set Max Size(64, 19);
				Text2 << Set Stretch({"Neutral", "Neutral"});
				Text2 << Set Base Font("Text");
				Text2 << Set Font Scale(1);
				Text2 << Set Text("Text2");
				Text2 << Bullet point(0);
				Text2 << Justify Text("Left");
				Text2 << Rotate Text("Horizontal");
				Text2 << Set Width(-1);
				Text2 << Set Wrap(360);
				Text2 << Set Tip("");
				CheckBox1 << Background Color("None");
				CheckBox1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				CheckBox1 << Enabled(1);
				CheckBox1 << Horizontal Alignment("Default");
				CheckBox1 << Margin({Left(2), Top(2), Right(2), Bottom(2)});
				CheckBox1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				CheckBox1 << Text Color("None");
				CheckBox1 << UI Only(0);
				CheckBox1 << Vertical Alignment("Default");
				CheckBox1 << Visibility("Visible");
				CheckBox1 << Set Min Size(180, 32);
				CheckBox1 << Set Max Size(180, 32);
				CheckBox1 << Set Stretch({"Neutral", "Neutral"});
				CheckBox1 << Set Items({"Item1", "Item2"});
				Panel3 << Background Color("None");
				Panel3 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Panel3 << Enabled(1);
				Panel3 << Horizontal Alignment("Default");
				Panel3 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				Panel3 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Panel3 << Text Color("None");
				Panel3 << UI Only(0);
				Panel3 << Vertical Alignment("Default");
				Panel3 << Visibility("Visible");
				Panel3 << Set Min Size(128, 154);
				Panel3 << Set Max Size(128, 154);
				Panel3 << Set Stretch({"Neutral", "Neutral"});
				Panel3 << Set Title("Panel3");
				Lineup1 << N Col(1);
				Lineup1 << Background Color("None");
				Lineup1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Lineup1 << Enabled(1);
				Lineup1 << Horizontal Alignment("Default");
				Lineup1 << Margin({Left(0), Top(0), Right(0), Bottom(0)});
				Lineup1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Lineup1 << Text Color("None");
				Lineup1 << UI Only(0);
				Lineup1 << Vertical Alignment("Default");
				Lineup1 << Visibility("Visible");
				Lineup1 << Set Min Size(88, 96);
				Lineup1 << Set Max Size(88, 96);
				Lineup1 << Set Stretch({"Neutral", "Neutral"});
				Lineup1 << Spacing(2);
				Button1 << Background Color("None");
				Button1 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Button1 << Enabled(1);
				Button1 << Horizontal Alignment("Default");
				Button1 << Margin({Left(2), Top(2), Right(2), Bottom(2)});
				Button1 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Button1 << Text Color("None");
				Button1 << UI Only(0);
				Button1 << Vertical Alignment("Default");
				Button1 << Visibility("Visible");
				Button1 << Set Min Size(60, 21);
				Button1 << Set Max Size(60, 21);
				Button1 << Set Stretch({"Neutral", "Neutral"});
				Button1 << Set Button Name("OK");
				Button1 << Style("Normal");
				Button1 << Set(0);
				Button1 << Set Icon("");
				Button1 << Set Icon Location("Right");
				Button2 << Background Color("None");
				Button2 << Border({Left(0), Top(0), Right(0), Bottom(0)});
				Button2 << Enabled(1);
				Button2 << Horizontal Alignment("Default");
				Button2 << Margin({Left(2), Top(2), Right(2), Bottom(2)});
				Button2 << Padding({Left(0), Top(0), Right(0), Bottom(0)});
				Button2 << Text Color("None");
				Button2 << UI Only(0);
				Button2 << Vertical Alignment("Default");
				Button2 << Visibility("Visible");
				Button2 << Set Min Size(60, 21);
				Button2 << Set Max Size(60, 21);
				Button2 << Set Stretch({"Neutral", "Neutral"});
				Button2 << Set Button Name("Cancel");
				Button2 << Style("Normal");
				Button2 << Set(0);
				Button2 << Set Icon("");
				Button2 << Set Icon Location("Right");
			)
		)
	),
	Initialize(
		Module1 << Auto Launch(1);
		Module1 << Set Module Type("Report");
		Module1 << Set Window Title("^TABLENAME - ^APPNAME");
	)
);

このスクリプトをChatGPT（ログインしていないのでGPT-4oを使用していると思われます）に渡し、新しいウィンドウのようなスクリプトを作成するように指示したところ、以下のようなスクリプトが生成されました。私見では、十分に使えるレベルに近い結果になりました。

もっと見る...

New Window("Application",
	H List Box(
		Panel Box("Panel1",
			Filter Col Selector(
				Data Table("DataTable1")
			)
		),
		Panel Box("Panel2",
			Lineup Box(
				N Col(2),
				Text Box("Text1"),
				Text Box("Text2"),
				Combo Box({"Item1", "Item2"}),
				Check Box({"Item1", "Item2"}),
				Col List Box(
					Data Table("DataTable1"),
					Modeling Type({"Continuous", "Ordinal", "Nominal"})
				),
				Button Box("Button3")
			)
		),
		Panel Box("Panel3",
			Lineup Box(
				N Col(1),
				Button Box("OK"),
				Button Box("Cancel")
			)
		)
	)
);

しかし、アプリケーション ビルダーからこの機能を入手したり、UI デザインに使用できる新しい「デザイナー」プラットフォームを入手したりできれば便利です (私はすでに新しいウィンドウ スクリプトの作成に慣れているため、独自のスタイルでアプリケーション ビルダーを使用するよりもはるかに速くスクリプトを作成できます)。

Re: アプリケーションビルダーを使用してGUIを作成する

また、同じようなタイプの UI を「たくさん」作成する場合は、そのための独自のツールを作成することを検討してください。

たとえば、次のようなものがあります:

• ツールは FastAPI から openapi.json を取り込んで JMP UI を作成します ( JMP® 用の Pythonless Python 統合 (2023-EU-30MP-1265) )
• ツールは、特定の種類の Pydantic ベースモデル ( JMPyFacade: Bridging JMP and Python for Seamless Engaging AnalysisおよびScripters Club の録画: JMPyFacade: JMP と Python を連携させてシームレスで魅力的な分析を実現 ) を利用して、動的な UI を作成します。
• 1つのツールは特定の種類のSQLテンプレートを使用してUIを作成します
• 設定/構成ファイル用のよりシンプルなもの