根据屏幕宽度和列数设置UICollectionViewCell的大小Xamarin.iOS

问题描述:

我正在使用Xamarin.iOS构建应用程序。我使用了UICollectionView来显示一些类别的应用程序的第一个屏幕。我希望分类显示在两列,但这里有一个问题。我在storyBoard.In小屏幕上手动设置了单元的大小,如iPhone 3.5英寸,只出现一列,与此同时在大屏幕iPhone 66Plus中出现两列,但列之间有很多空间。根据屏幕宽度和列数设置UICollectionViewCell的大小Xamarin.iOS

该表查看有一个方法,我们可以在TableViewSourceGetRowHeight覆盖。有没有办法根据屏幕宽度和列数来设置collectionViewCell的大小。

这是我在我的应用实施的CollectionView方式:

SectionViewSource.cs

public class SectionViewSource: UICollectionViewSource 
    { 
     public List<SectionCategory> rows { get; set; } 
     public ViewController owner { get; set;} 

     public SectionViewSource (List<SectionCategory> _rows, ViewController _owner) 
     { 
      rows = _rows; 
      owner = _owner; 

     } 

     public override nint NumberOfSections (UICollectionView collectionView) 
     { 
      return 1; 
     } 

     public override nint GetItemsCount (UICollectionView collectionView, nint section) 
     { 
      return rows.Count; 
     } 

     public override bool ShouldHighlightItem (UICollectionView collectionView, NSIndexPath indexPath) 
     { 
      return true; 
     } 

     public override void ItemHighlighted (UICollectionView collectionView, NSIndexPath indexPath) 
     { 
      var cell = (SectionViewCell)collectionView.CellForItem (indexPath); 
      cell.mainLabel.Alpha = 0.5f; 



     } 

     public override bool CanPerformAction (UICollectionView collectionView, Selector action, NSIndexPath indexPath, NSObject sender) 
     { 

       return true; 
     } 

     public override void PerformAction (UICollectionView collectionView, Selector action, NSIndexPath indexPath, NSObject sender) 
     { 
      System.Diagnostics.Debug.WriteLine ("code to perform action"); 

     } 

     public override void ItemUnhighlighted (UICollectionView collectionView, NSIndexPath indexPath) 
     { 

      var cell = (SectionViewCell)collectionView.CellForItem (indexPath); 
      cell.mainLabel.Alpha = 1.0f; 

     } 

     public override UICollectionViewCell GetCell (UICollectionView collectionView, NSIndexPath indexPath) 
     { 
      var cell = (SectionViewCell)collectionView.DequeueReusableCell (SectionViewCell.CellID, indexPath); 

      cell.UpdateCell (rows [indexPath.Row].sectionName,rows [indexPath.Row].sectionUrlImage); 

      return cell; 
     } 
    } 

SectionViewCell.cs

public class SectionViewCell: UICollectionViewCell 
    { 
     public UILabel mainLabel; 
     public UIImageView _imageView; 
     public static NSString CellID = new NSString("customCollectionCell"); 

     [Export ("initWithFrame:")] 
     public SectionViewCell (CGRect frame) : base(frame) 
     { 
      BackgroundView = new UIView { BackgroundColor = UIColor.Orange }; 

      ContentView.BackgroundColor = UIColor.LightGray; 

      _imageView = new UIImageView(); 
      mainLabel = new UILabel(); 

      mainLabel.TextColor = UIColor.White; 

      ContentView.AddSubviews (new UIView[] { _imageView, mainLabel }); 
     } 



     public void UpdateCell (string text, string url) { 

      mainLabel.Text = text; 
      mainLabel.LineBreakMode = UILineBreakMode.TailTruncation; 
      mainLabel.Lines = 2; 
      mainLabel.Font = UIFont.FromName("Optima-Bold", 18f); 

      ImageService.LoadUrl(url).Into(_imageView); 
      _imageView.Frame = new CGRect (0, 0, ContentView.Bounds.Width, ContentView.Bounds.Height); 
      mainLabel.Frame = new CGRect (10, 10, ContentView.Bounds.Width-20, 40); 

     } 

    } 

ViewController.cs

sectionGrid.RegisterClassForCell(typeof(SectionViewCell), SectionViewCell.CellID); 
sectionGrid.Source = new SectionViewSource (sectionCategories,this); 

尝试设置CollectionViewLayout像这样:

// Flow Layout 
var flowLayout = new UICollectionViewFlowLayout(){ 
    ItemSize = new CGSize ((float)UIScreen.MainScreen.Bounds.Size.Width/2.0f, (float)UIScreen.MainScreen.Bounds.Size.Width/2.0f), 
    HeaderReferenceSize = new CGSize (100, 100), 
    SectionInset = new UIEdgeInsets (0,0,0,0), 
    ScrollDirection = UICollectionViewScrollDirection.Vertical, 
    MinimumInteritemSpacing = 0, // minimum spacing between cells 
    MinimumLineSpacing = 0 // minimum spacing between rows if ScrollDirection is Vertical or between columns if Horizontal 
}; 

simpleCollectionViewController = new UICollectionViewController (flowLayout); 

产生了一些这样的事:

enter image description here


更新

你可以试试这个:

var flowLayout = new UICollectionViewFlowLayout(){ 
    ItemSize = new CGSize ((float)UIScreen.MainScreen.Bounds.Size.Width/2.0f, (float)UIScreen.MainScreen.Bounds.Size.Width/2.0f), 
    HeaderReferenceSize = new CGSize (100, 100), 
    SectionInset = new UIEdgeInsets (0,0,0,0), 
    ScrollDirection = UICollectionViewScrollDirection.Vertical, 
    MinimumInteritemSpacing = 0, // minimum spacing between cells 
    MinimumLineSpacing = 0 // minimum spacing between rows if ScrollDirection is Vertical or between columns if Horizontal 
}; 

sectionGrid.PerformBatchUpdates (() => { 
    sectionGrid.CollectionViewLayout.InvalidateLayout(); 
    sectionGrid.SetCollectionViewLayout (flowLayout, false); 
}); 
+0

我没有使用'UICollectionViewController'。我只是使用'UICollectionView',因为我在屏幕中有其他视图。 – Xhulio

+0

我已经更新了描述情况以及我所做的事情的问题。如果有可能,你能帮我指出我做错了什么,或者我应该在哪里使用我们的解决方案。 – Xhulio

+0

酷我会看看,看看我能做些什么 –