shivas
shivas

Reputation: 923

Set ItemSize of UICollectionViewFlowLayout to width of device

Using Xamarin, I am trying to create a UICollectionViewFlowLayout where my cells will be the width of the device and flow down vertically. Something like the Facebook news tab iOS app.

Currently to get the Cells in the layout, here is by code:

public override async void ViewWillAppear (bool animated)
        {
            try{
                base.ViewWillAppear (animated);

                var layout = new UICollectionViewFlowLayout ();
                layout.MinimumInteritemSpacing = 30;


                var collectionView = new NewsListView (UIScreen.MainScreen.ApplicationFrame, layout);
                collectionView.AutoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
                collectionView.BackgroundColor = UIColor.LightGray;
                collectionView.RegisterClassForCell (typeof(NewsListViewCell), cellId);
                collectionView.ReloadData ();



                CollectionView = collectionView;

                Logger.Log(""+CollectionView.Bounds.Width);



            }catch(Exception ex){
                Logger.Log (ex);
                ShowUserMessage ("Error",ex.Message);
            }
        }

I want to use this to set the size of the item: layout.ItemSize = new CGSize (CollectionView.Bounds.Width-20, 200.0f);

But CollectionView does not exist yet when i am creating the UICollectionViewFlowLayout,

Is there any other way i can set the size of UICollectionViewFlowLayout to the width of the device?

Upvotes: 1

Views: 894

Answers (1)

shivas
shivas

Reputation: 923

I found a solution to my problem. I created the layout as a global variable and then added it to the view in ViewDidLoad (), then in ViewWillAppear(..) i can set layout.ItemSize

So my code will as follows:

UICollectionViewFlowLayout layout;

public override async void ViewDidLoad ()
        {
            try{
                base.ViewDidLoad ();
                Title = "News";

                layout = new UICollectionViewFlowLayout ();
                layout.MinimumInteritemSpacing = 30;

                var collectionView = new NewsListView (UIScreen.MainScreen.ApplicationFrame, layout);
                collectionView.AutoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
                collectionView.BackgroundColor = UIColor.LightGray;
                collectionView.RegisterClassForCell (typeof(NewsListViewCell), cellId);
                collectionView.ReloadData ();
                CollectionView = collectionView;

            }catch(Exception ex){
                Logger.Log (ex);
                ShowUserMessage ("Error",ex.Message);
            }
        }


public override async void ViewWillAppear (bool animated)
        {
            try{
                base.ViewWillAppear (animated);

                Logger.Log(""+CollectionView.Bounds.Width);
                layout.ItemSize = new CGSize (CollectionView.Bounds.Width-20, 200.0f);

            }catch(Exception ex){
                Logger.Log (ex);
                ShowUserMessage ("Error",ex.Message);
            }
        }

This way the item width of the layout is always based on device width and not hardcoded

Upvotes: 3

Related Questions