2

How to implement Grid layout for ios? There are similar layouts: <Grid> in windows xaml and <GridLayout> in android, but I failed to find any resource which covers how to implement similar thing in ios.

In brief: there are should be so called "Grid" in which I specify how many rows and cells are there and then I can specify that some particular control (for ex. TextView) should start at x column and span w columns, start at y row and span h rows.

Update: don't confuse GridControl with GridLayout, an example of GridLayout: enter image description here

Tiefan Ju
  • 510
  • 3
  • 14
Access Denied
  • 8,723
  • 4
  • 42
  • 72

5 Answers5

3

Use collectionviews to write grid layout

https://developer.apple.com/documentation/uikit/uicollectionview

Cintu
  • 913
  • 2
  • 16
  • 32
2

Use a UICollectionView for Grid Layout. Check this answer which shows the integration of UICollectionView in details

For such a layout also, you need to use collectionView itself, but use the sizeForItemAtIndexPath dataSource properly. Check this answer. Also try to customize UICollectionViewFlowLayout

Also this is an awesome library which also do the same thing for you

Amal T S
  • 3,327
  • 2
  • 24
  • 57
  • You are talking about GridView and this is a different control. I didn't find any sample which allows cell to span for several rows and columns. – Access Denied Jul 17 '17 at 10:48
  • @AccessDenied For that also, you need to use collectionView itself, but use the `sizeForItemAtIndexPath` dataSource properly. Check this answer : https://stackoverflow.com/a/25275878/7456236 Also this library also do the same thing for you : https://github.com/betzerra/MosaicLayout – Amal T S Jul 17 '17 at 11:59
  • Your answer was not 100% correct, mozaic view is a different thing. I've added link in the answer which does exactly what I needed. – Access Denied Jul 24 '17 at 09:28
  • 1
    Ok. Anyway Happy it helped you :) – Amal T S Jul 24 '17 at 09:29
2

I was able to implement GridLayout with help of the following blog article: https://web.archive.org/web/20170620013903/http://blog.stablekernel.com/creating-a-custom-uicollectionviewlayout

In brief I had to implement my own UICollectionViewLayout, but I didn't need the complexity as it was presented in the article.

The problem with this solution is cell reusing, which I don't need and there is no way to switch it off.

Access Denied
  • 8,723
  • 4
  • 42
  • 72
  • @OlivierMATROT I use C# and solution was not universal, but for specific task. This code I copied from an early prototype which later was improved, but the idea comes from it, You can take a look at it https://gist.github.com/Mogikan/b4bc79f1decf553f4e18c3a6ba387620#file-gridcontrol-cs – Access Denied Mar 16 '20 at 10:24
  • @OlivierMATROT gist from the article: https://gist.github.com/smswz/393b2d6237b7837234015805c600ada2 – Access Denied Mar 16 '20 at 10:45
0

Another option is to find out how xamarin implemented GridLayout and try to reproduce it. https://github.com/xamarin/Xamarin.Forms/blob/master/Xamarin.Forms.Core/GridCalc.cs

Access Denied
  • 8,723
  • 4
  • 42
  • 72
0

One more way to implement it is to inherit from UIView and override LayoutSubviews method and set children Frame manually.

Access Denied
  • 8,723
  • 4
  • 42
  • 72