0

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?

  • "Anyone has any idea what to look for to fix this" Use the View Debugger! – matt Jan 30 '18 at 19:23
  • Thanks matt, seems to be an issue with the layout inside the UIScrollView and how this view (UIView) has to be aligned to the borders to not cause errors, one related article: https://stackoverflow.com/questions/19036228/uiscrollview-scrollable-content-size-ambiguity – Eirik S. Jan 31 '18 at 16:34
  • I don't know whether I'd call it an "issue". Auto layout inside a scroll view works in a special way. Do you understand how it works? – matt Jan 31 '18 at 16:36
  • yes I believe I have a pretty good understanding of the scrollview. In this particular case it got a little challenging since I have multiple scrollviews inside a master view that are to work in both horizontal and vertical mode inside the safe area. I have not been able to solve the issue yet, however from the error messages I get in the View Debugger I believe I will be able to track down the root cause. I guess one of my major learnings is that it is more complex than necessary to do the complete view in VFL and that I might have been better off using a combination of VFL and storyboard. – Eirik S. Feb 02 '18 at 12:36

0 Answers0