如何使用Xamarin for iOS正确显示集合视图上的UIImage对象？

我正在研究一些我自己的Xamarin示例，并更好地理解制作iOS应用程序和C＃代码（我有更多的Android编程经验）。如何使用Xamarin for iOS正确显示集合视图上的UIImage对象？

我有一个视图，我正在显示一个集合视图和两个按钮，通过按任一我向Imgur HTTP请求并检索不同的图像集。这些图像我想在集合视图中显示。

我就与我的控制器以下方法请求：

public void makeRequest(string url){ 
     var request = (HttpWebRequest)WebRequest.Create(url); 
     request.Headers.Add ("Authorization", "Client-ID " + clientId); 
     request.Method = "GET"; 

     Task<WebResponse> task = Task.Factory.FromAsync (
            request.BeginGetResponse, 
            asyncResult => request.EndGetResponse (asyncResult), 
            (object)null); 
     task.ContinueWith (t => ReadStreamFromResponse (t.Result)); 

    }

为了解析我用这个方法的JSON响应（我只图像，不相册兴趣）：

private void ReadStreamFromResponse(WebResponse response){ 
     using (Stream responseStream = response.GetResponseStream()) { 
      using (StreamReader sr = new StreamReader (responseStream)) { 
       string content = sr.ReadToEnd(); 
       var json = JsonObject.Parse (content); 
       var array = json ["data"]; 
       foreach (JsonObject o in array) { 
         string url = o ["link"]; 
        bool isAlbum = o ["is_album"]; 
        if (!isAlbum) { 
        url = url.Insert (url.Length - 4, "s"); 
          AddElement (url); 
        } 
       } 
      } 
     } 
    } 
}

我用它来尝试将图像添加到源代码的方法如下：

public void AddElement(string url){ 
     using (var imgUrl = new NSUrl (url)) { 
      using (var data = NSData.FromUrl (imgUrl)) { 
       photoSource.photos.Add (UIImage.LoadFromData (data)); 
       InvokeOnMainThread (delegate { 
        PhotoCollection.ReloadData(); 
       }); 
      } 
     } 

    }

这是我的源类：

class CollectionSource : UICollectionViewSource 
{ 
    public List<UIImage> photos; 
    public CollectionSource(){ 
     photos = new List<UIImage>(); 
    } 
    public CollectionSource(List<UIImage> photos){ 
     this.photos = photos; 
    } 

    public override UICollectionViewCell GetCell(UICollectionView collectionView, NSIndexPath indexPath){ 
     var photoCell = (ImageCell)collectionView.DequeueReusableCell ((NSString) ImageCell.CELLID, indexPath); 
     var photo = photos [indexPath.Row]; 

     photoCell.ImageView.Image = photo; 

     return photoCell; 
    } 

    public override int GetItemsCount(UICollectionView collectionView, int section){ 
     return photos.Count; 
    } 

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

    public override void ItemHighlighted(UICollectionView collectionView, NSIndexPath indexPath){ 
     var cell = collectionView.CellForItem (indexPath); 
     cell.ContentView.BackgroundColor = UIColor.Yellow; 
    } 

    public override void ItemUnhighlighted(UICollectionView collectionView, NSIndexPath indexPath){ 
     var cell = collectionView.CellForItem (indexPath); 
     cell.ContentView.BackgroundColor = UIColor.White; 
    } 

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

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

    public override bool CanPerformAction(UICollectionView collectionView, MonoTouch.ObjCRuntime.Selector action, NSIndexPath indexPath, NSObject sender){ 
     return true; 
    } 

    public override void PerformAction(UICollectionView collectionView, MonoTouch.ObjCRuntime.Selector action, NSIndexPath indexPath, NSObject sender){ 
     Console.WriteLine ("Perform action"); 
    } 


}

我避免使用的CollectionView控制器的，因为我不喜欢离开多个操作只有一个班，我喜欢在课堂上分裂我的代码。

这是我的手机类：

public class ImageCell : UICollectionViewCell 
{ 
    public const string CELLID = "ImageCell"; 

    [Export ("initWithFrame:")] 
    public ImageCell (System.Drawing.RectangleF frame) : base(frame){ 
     this.Initialize(); 
    } 

    public UIImageView ImageView { 
     get; 
     set; 
    } 
    private void Initialize(){ 
     //   this.ImageView = new UIImageView (this.ContentView.Bounds); 
     this.ImageView = new UIImageView (UIImage.FromBundle("placeholder.png")); 
     this.ContentView.AddSubview (this.ImageView); 

    } 
}

最后，这是我的视图控制器类：

partial class ViewController3 : UIViewController 
{ 
    public CollectionSource photoSource; 

    public ViewController3 (IntPtr handle) : base (handle) 
    { 
    } 

    public override void ViewDidLoad() 
    { 
     base.ViewDidLoad(); 

     PhotoCollection.RegisterClassForCell (typeof(ImageCell), (NSString)ImageCell.CELLID); 
     photoSource = new CollectionSource(); 
     PhotoCollection.Source = photoSource; 

     makeRequest(); 
    } 
    // makeRequest, ReadStreamFromResponse and AddElement are located below this method, I won't place them again 
}

正如你可以看到我基于Xamarin指南中的Introduction to Collection Views文章我的代码。我现在成功地下载了远程图像，但它们没有正确显示在Collection视图中。

图像被下载，但因为它们是下载它们闪过集合视图，其结果最终是这样的：

Collection View after images finished downloading

出于某种原因，不是所有的细胞的渲染图像正确，也许我错误地刷新了我的CollectionView？

来源

2014-09-24 Uriel Arvizu

所以我找到了解决方案，但我不知道它为什么使它工作。

在我ImageCell类添加以下代码行初始化方法：

private void Initialize(){ 
     this.ImageView = new UIImageView(); 
     this.ImageView.AutoresizingMask = ~UIViewAutoresizing.None; 
     // if no image is assigned to the ImageView, then the cell won't be rendered correctly if later you add the image 
     // not familiar with iOS guidelines so I don't know if that is the real reason 
     this.ImageView = new UIImageView (UIImage.FromBundle("temp.png")); 

     this.ContentView.AddSubview (this.ImageView); 

    }

有了这个图像是在细胞中正确呈现，还必须提高我加载该远程图像的方式，但是这它，如果你注意到你的单元格没有正确渲染到位，那么也许你应该检查你的单元格中的任何组件是否需要占位符来避免将它留空。

来源

2014-10-01 15:51:03

如何使用Xamarin for iOS正确显示集合视图上的UIImage对象？

回答

相关问题