Split list into 3 columns by applying size limit to each column

Question

Scenario: Trying to split a approx 200 records into 3 columns with checkboxes in ascending order and by limiting size of each column up to 70. Like first column will have first 70 items of list and the next 70 items follow in 2nd column layout and next 70 columns follow 3rd column layout. 
 Is there a way to set the limit of values in each column and route the list to subsequent columns?, instead of stacking up all 210 records in single column for a better user experience?

PhilB · Accepted Answer

This is complicated, but achievable. You might want to be a bit careful with putting huge numbers of components on a screen like this, but it does work - try the code below in an interface. 
 load(
 local!data: a!forEach(
 items: enumerate(
 220
 ) + 1,
 expression: {
 id: fv!item,
 text: concat(
 "Item",
 fv!item
 ),
 boolean: false
 }
 ),
 local!maxItemsPerColumn: 70,
 a!formLayout(
 label: "Dynamic columns",
 contents: {
 a!dropdownField(
 label: "Maximum items per column",
 choiceLabels: {
 10,
 20,
 35,
 50,
 70,
 100
 },
 choiceValues: {
 10,
 20,
 35,
 50,
 70,
 100
 },
 value: local!maxItemsPerColumn,
 saveInto: local!maxItemsPerColumn
 ),
 a!columnsLayout(
 columns: a!forEach(
 items: enumerate(
 if(
 mod(
 length(
 local!data
 ),
 local!maxItemsPerColumn
 ) = 0,
 length(
 local!data
 ) / local!maxItemsPerColumn,
 floor(
 length(
 local!data
 ) / local!maxItemsPerColumn
 ) + 1
 )
 ) + 1,
 expression: with(
 local!indices: enumerate(
 if(
 (
 fv!item * local!maxItemsPerColumn
 ) > length(
 local!data
 ),
 length(
 local!data
 ) - (
 (
 fv!item - 1
 ) * local!maxItemsPerColumn
 ),
 local!maxItemsPerColumn
 )
 ) + (
 if(
 fv!isFirst,
 0,
 (
 fv!item - 1
 ) * local!maxItemsPerColumn
 ) + 1
 ),
 a!columnLayout(
 width: "AUTO",
 contents: {
 a!forEach(
 items: local!indices,
 expression: a!checkboxField(
 labelPosition: "COLLAPSED",
 choicelabels: local!data[fv!item].text,
 choiceValues: {
 true
 },
 value: if(
 local!data[fv!item].boolean,
 local!data[fv!item].boolean,
 null
 ),
 saveInto: {
 a!save(
 target: local!data[fv!item].boolean,
 value: not(
 local!data[fv!item].boolean
 )
 )
 }
 )
 )
 }
 )
 )
 )
 )
 }
 )
)