Question


Global Alliant Inc
US
Last activity: 29 Dec 2020 14:25 EST
Section template supporting 2 columns with resizable widths
Pega doesn’t provide an OOTB section template supporting 2 columns with resizable widths. Has anyone built such a template or received one from the Pega’s UX team. I looked at using screen layouts and this type of rule (Harness) won’t meet the requirement .
Here is section template mock up, where the blue bar indicates the resizable control.
-
Likes (1)
Dhaval Shah -
Share this page Facebook Twitter LinkedIn Email Copying... Copied!
Updated: 11 Feb 2020 15:55 EST


Pegasystems Inc.
US
Here is section template mock up from JoeK4628, where the blue bar indicates the resizable control.


Government of Canada
CA
Any idea how you folks implemented? possible to share the idea.
Thanks
Anand
Updated: 18 Feb 2020 14:03 EST


Pegasystems Inc.
US
Hi, Can you tell us more about the use case? Meaning, where does this UI appear? In the main work area or in a modal from a local action or in a case utility? What is it displaying?
Also, what happens as you keep shrinking one column? Is there a min-width to keep the column from being shrunk too small where fields no longer look good?
Is app built with the UI-Kit theme or Cosmos UI theme?
The reason I'm asking is because it seems like you're trying to solve a problem with having enough room for content. Sometimes there's an alternative design to solve that without building a shrinkable column.
Generally, certainly this UI can be built by creating a custom design template (saved in application ruleset) with a bit of CSS.
Sam


Pegasystems Inc.
US
there is no such template available OTB in the end user portal but it is possible to build one relatively easily - it would require a few lines of JS to make it work. I would not recommend to use a screenlayout - the screenlayout is intend to be used for the whole portal layout and can only be dropped inside a harness.


Bank Of America
IN
Hi Richard,
I have same requirement , can you please share how we can do it via JS or by any other method.


Government of Canada
CA
Hi,
Did you receive any reply on how to implement the JS if so please share.
Thanks
Anand


Pegasystems Inc.
US
I wrote a post that detail how to implement such layout - there is also a demo ruleset that you can install - https://collaborate.pega.com/discussion/how-build-2-columns-resizable-widths
-
David Elvar Calamonte Vincenzo Civitelli


Government of Canada
CA
appreciate the help, Thank you for sharing
Thanks
Anand