900350_de-DE

liliconcom

GUI mit Application Builder erstellen

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.

Ich habe den Application Builder ausprobiert, da er mir die Möglichkeit bietet, Steuerelemente per Drag & Drop zu verschieben, um das Layout visuell zu gestalten. Das ist fantastisch. Wenn ich die Anwendung speichere, wird jedoch ein vollständiges Anwendungsframework mit Namespaces generiert.

Meine konkrete Frage ist: 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?

Ich versuche oft nur, einen einzelnen modalen Dialog oder ein Einstellungsfenster zu erstellen, und ich benötige nicht die gesamte damit verbundene Anwendungsstruktur.

Automatisierung und SkriptingWindowsBetreff: GUI mit Application Builder erstellen

Ich glaube nicht, dass es dafür eine vorgefertigte Methode gibt. Sie müssten Ihren eigenen „Parser“ schreiben. Dies könnte auch etwas sein, was ein ordnungsgemäß aufgefordertes LLM tun könnte, zumindest in einfachen Fällen.

Betreff: GUI mit Application Builder erstellen

Hallo @shuey ,

Um den Kommentar von @jthi noch zu ergänzen (da es derzeit keine Möglichkeit gibt, dies zu tun), kann es hilfreich sein, die Baumstruktur „Bearbeiten > Abrufen“ und möglicherweise „Eigenschaften abrufen“ für die von Ihnen erstellten Komponenten zu verwenden, die Sie in ein LLM einfügen könnten.

Ich stimme zu, dass es eine nette Funktion ist und würde empfehlen, sie der JMP-Wunschliste hinzuzufügen.

Danke,

Ben

Betreff: GUI mit Application Builder erstellen

Wenn wir einen ziemlich einfachen JMP-ähnlichen Plattform-Launcher betrachten

Es wird das folgende JMP-App-Skript generiert

Mehr anzeigen...

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");
	)
);

Wenn ich dieses Skript an ChatGPT weitergebe (ich bin nicht angemeldet, daher denke ich, dass es GPT-4o verwendet) und es auffordere, ein neues Fenster wie ein Skript zu erstellen, erhalte ich etwas wie unten. Es kommt meiner Meinung nach nah genug heran, um nützlich zu sein

Mehr anzeigen...

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")
			)
		)
	)
);

Es wäre jedoch nützlich, diese Funktion vom Anwendungsersteller zu erhalten oder vielleicht sogar eine neue „Designer“-Plattform zu haben, die für das UI-Design verwendet werden könnte (ich bin bereits so daran gewöhnt, neue Fensterskripte zu schreiben, dass ich sie viel schneller schreibe, als wenn ich den Anwendungsersteller mit meinem eigenen Stil verwende).

Betreff: GUI mit Application Builder erstellen

Wenn Sie „viele“ ähnliche Benutzeroberflächentypen erstellen, sollten Sie darüber nachdenken, dafür eigene Tools zu entwickeln.

Ich habe zum Beispiel:

• Das Tool verwendet openapi.json von FastAPI, um eine JMP-Benutzeroberfläche zu erstellen ( Pythonless Python Integration für JMP® (2023-EU-30MP-1265) ).
• Das Tool verwendet einen bestimmten Typ von Pydantic-Basismodellen ( JMPyFacade: Überbrückung von JMP und Python für eine nahtlose, ansprechende Analyse und Scripters Club-Aufzeichnung: JMPyFacade: Überbrückung von JMP und Python für eine nahtlose, ansprechende Analyse ), um eine dynamische Benutzeroberfläche zu erstellen
• Ein Tool verwendet einen bestimmten Typ von SQL-Vorlage, um die Benutzeroberfläche zu erstellen
• Einfachere Lösung für Einstellungs-/Konfigurationsdateien