iOSContainerControl into ScrollableArea

Hello,
how can I place multiple instances of a iOSContainerControl (stack among each other) into a ScrollableArea at runtime?

normally, I would create a instance an embed them with “embedwithin” but this is not available in iOS…

Thanks,
Marco

This code will work in the iOScrollableArea open event: (me refers to the scrollableArea)

First define the initial content and setup the constraints

//Define the main content (just a blank container)
Dim ccContent As New iOSContainerControl
me.content = ccContent

//Setup the initial constraints
Dim cons As iOSLayoutConstraint

//Left
cons = New iOSLayoutConstraint(ccContent, _
iOSLayoutConstraint.AttributeTypes.Left, _
iOSLayoutConstraint.RelationTypes.Equal, _
me, _
iOSLayoutConstraint.AttributeTypes.Left, _
1.0, 0)
me.AddConstraint(cons)

//Top
cons = New iOSLayoutConstraint(ccContent, _
iOSLayoutConstraint.AttributeTypes.Top, _
iOSLayoutConstraint.RelationTypes.Equal, _
me, _
iOSLayoutConstraint.AttributeTypes.Top, _
1.0, 0)
me.AddConstraint(cons)


//Width
cons = New iOSLayoutConstraint(ccContent, _
iOSLayoutConstraint.AttributeTypes.Width, _
iOSLayoutConstraint.RelationTypes.Equal, _
me, _
iOSLayoutConstraint.AttributeTypes.Width, _
1.0, 0)
me.AddConstraint(cons)

Then add all stacked containers

Dim posY As Integer
Dim height As Integer = 100 //Setting a height of 100 points for each stacked container
Dim vPadding as Integer = 0 //define whatever padding you need

//Adding 5 stacked containers
For i as Integer = 1 to 5
Dim cc as New YourContainerControlInstance

me.Content.AddControl(cc) //This is the equivalent to embedwithin on Desktop

//Setting the constraints

//Left
cons = New iOSLayoutConstraint(cc, _
iOSLayoutConstraint.AttributeTypes.Left, _
iOSLayoutConstraint.RelationTypes.Equal, _
ccContent, _
iOSLayoutConstraint.AttributeTypes.Left, _
1.0, 0)
ccContent.AddConstraint(cons)

//Top
cons = New iOSLayoutConstraint(cc, _
iOSLayoutConstraint.AttributeTypes.Top, _
iOSLayoutConstraint.RelationTypes.Equal, _
ccContent, _
iOSLayoutConstraint.AttributeTypes.Top, _
1.0, posY)
ccContent.AddConstraint(cons)

//Width
cons = New iOSLayoutConstraint(cc, _
iOSLayoutConstraint.AttributeTypes.Width, _
iOSLayoutConstraint.RelationTypes.Equal, _
ccContent, _
iOSLayoutConstraint.AttributeTypes.Width, _
1.0, 0)
ccContent.AddConstraint(cons)

//Height
cons = New iOSLayoutConstraint(cc, _
iOSLayoutConstraint.AttributeTypes.Height, _
iOSLayoutConstraint.RelationTypes.Equal, _
Nil, _
iOSLayoutConstraint.AttributeTypes.none, _
1.0, height)
ccContent.AddConstraint(cons)

posY = posY + height + vPadding

Next

//Finally, set the main content height so the ScrollableArea will correctly scroll

//Total Height
cons = New iOSLayoutConstraint(ccContent, _
iOSLayoutConstraint.AttributeTypes.Height, _
iOSLayoutConstraint.RelationTypes.Equal, _
Nil, _
iOSLayoutConstraint.AttributeTypes.none, _
1.0, posY)
me.AddConstraint(cons)

Note This code was written here, it might not run as I didn’t test it directly. It is based on code from my iOS projects

1 Like

Thank you!! This worked right away. I will take a deeper look now at the code for learning…

Thanks again!

Keep in mind that this works great for containers with no images, or small images.

But if you have many stacked containers that each show a high-res picture, the app might be terminated by the system because it uses too much memory.

   //Height
    cons = New iOSLayoutConstraint(cc, _
    iOSLayoutConstraint.AttributeTypes.Height, _
    iOSLayoutConstraint.RelationTypes.Equal, _
    Nil, _
    iOSLayoutConstraint.AttributeTypes.none, _
    1.0, height)
    ccContent.AddConstraint(cons)

how can I change the height of the containercontrol (cc) at runtime?

if I name the height constraint e.g “conheigth” and want it to change later with:
self.Constraint(“conheight”).offset = 10
it’s always NIL?

Marco

When you add constraints by code, you need to keep a reference to the constraint in the iOSView / iOSContainerControl.

You can then change it with savedConstraint.offset = NewValue