WorkWithPlus instance from layout

WorkWithPlus added the possibility to create an instance from a layout. So, if you have Web Panels already created (for example because they were designed by your designer expert), you can create the associated instance and continue working with it using WorkWithPlus in order to take full advantage of all the features and maintain it in a much easier way.

The CustomPanel editor's Layout tab shows a MainTable control containing an image placeholder and stopwatch icon in one row and a Carousel_common row displaying an image placeholder with a "&Carousel_items.item(0).Title" variable. The right-side Properties panel lists Table properties for MainTable such as Columns Style, Rows Style, Width, Height, Class, Background, and Scroll Behavior settings.

 

This feature is also useful in the following scenarios:

Import from Sketch or Figma

If your company uses one of these tools in order to develop the design of your applications, you can import the layouts using the tool that GeneXus provides:

Design to GeneXus dialog with a Figma Path/URL and Access Token fields, Style set to 'Sample_TA_Mobile', an 'Import as Web Panels' checkbox, a checklist of Panels and Stencils on the left, and Composition/Code tabs showing a mobile screen preview alongside its component tree (ViewAttraction_About, WrapContainer_Header, Header, Top_Controls, Chatbot, Row_Title, etc.); OK and Cancel buttons at the bottom.  GeneXus KB Explorer tree for knowledge base 'TestDSOConvert', expanded under Root Module showing GeneXus > Stencils (Bars, CartLine, FeaturedFoodtrucks, FoodtruckItem, PillSmall, ProductItem, PromoCard, PromoCard2), TestData, Foodtrucks, FoodtrucksMenu, and View01Home through View05Order objects, plus Files, Images, References, Customization and Documentation nodes.

Then with our feature create the instances of the layouts in order to develop each of the Panels or Web Panels, using our real-time preview, hierarchical editor, and all the features that WorkWithPlus provides:

GeneXus IDE Patterns tab for FoodtruckMenu, Navigation View 'View04Product', showing the WWP node tree for a Product view (Wrap_Product_Header, Product_Info, Wrap_Button_Add with User Action Button_Add2, Grid_More_Products, PromoCard3 layout, etc.) alongside a mobile preview of a product detail screen with popsicle images, price fields, and an 'Add to cart' button; the Properties panel on the right shows Button_Add2 properties including Caption 'Add to cart', Confirm 'True', and Message 'Are you sure?'.

 

Migrate from other Patterns

If you have a KB with another Pattern or Designer applied to your Web Forms, with this feature you can migrate them maintaining the layout (variables on screen, actions, grids, tables, etc)

 

Ongoing Projects

If you didn't use WorkWithPlus in your project and want to start using it on your ongoing project, you can run the Design System Wizard select a Design System, and then as you need to make modifications in the Panels or Web Panels that were made without WorkWithPlus, you create the instance in order to continue working with it, and all the new Panels or Web Panels you create it with WorkWithPlus.