Swift and Visual Format Language (VFL) not happy with vertical and horizontal layout

179 Views Asked by At

I am trying to make a UIView that consist of 4 element:

  • 1 x UIView
  • 3 x UIScrollView

Layout setup

The 4 subviews works perfectly individually, however the VFL for this view has turned out to be difficult. The views are configured like this:

    let frame0View = UIView() 
    frame0View.translatesAutoresizingMaskIntoConstraints = false
    frame0View.backgroundColor = .yellow
    frame0View.frame = CGRect(x: 0, y: 0, width: 80, height: 100)

    let frame1ScrollView = UIScrollView()
    frame1ScrollView.backgroundColor = .cyan
    frame1ScrollView.translatesAutoresizingMaskIntoConstraints = false
    frame1ScrollView.contentSize = frame1View.bounds.size

and the same for frame2ScrollView and 3

My expectation is the a VFL setup like this for the “superview” should work:

    let mainHorizontalVFL1 = "H:|[FRAME0(80)]-[FRAME1SCROLL(>=200)]-(>=0@500)-|"
    let mainHorizontalVFL2 = "H:|[FRAME2SCROLL(80)]-[FRAME3SCROLL(>=200)]-(>=0@500)-|"
    let mainVerticalVFL = "V:|[FRAME0(60)]-[FRAME2SCROLL(\(numberOfPlayers*90))]-(>=1@500)-|"

However this does not work (both FRAME1SCROLL and FRAME3SCROLL is not visible at all). By accident I got the below setup to work (with the auto layout complaining about "Unable to simultaneously satisfy constraints” as expected)

    let mainHorizontalVFL1 = "H:|[FRAME0(80)]-[FRAME1SCROLL(>=200)]-(>=0@500)-|"
    let mainHorizontalVFL2 = "H:|[FRAME2SCROLL(80)]-[FRAME3SCROLL(>=200)]-(>=0@500)-|"
    let mainVerticalVFL = "V:|[FRAME0(60)]-[FRAME1SCROLL(60)]-[FRAME2SCROLL(\(numberOfPlayers*90))]-[FRAME3SCROLL(\(numberOfPlayers*90))]-(>=0@500)-|" 

This setup works for now, but it is kind of annoying that I am not able to use the expected setup. Anyone has any idea what to look for to fix this?

0

There are 0 best solutions below