Greetings All! I am trying to convert the igGridPhotoViewer sample from objective-c to C# (Monotouch), but am stuck on what do to after ViewDidLoad ... I don't really have a need to edit/add filter or re-size the selected image. Below is what I have so far, but I'm at a loss as to what to do next! As always, I sure do appreciate your help!!!
[Register("igGridPhotoViewer")] public class IgGridPhotoViewer : UIViewController { private UIView _resizeThumb; private Point _originPoint; private int _numberOfColumns, _maxNumberOfColumns, _portraitColumnCount; private float _columnSize, _resizeThumbSize, _resizeThumbOffset; private IGCellPath _editPath; private Size _landscapeSize, _portraitSize; private NSObject[] _photos;
private IGGridView _photoGridView, _thumbsGridView;
private IGGridViewColumnDefinition _col, _thumbCol; private IGGridViewSingleRowSingleFieldDataSourceHelper _photoDs, _singleRowThumbDs; private IGGridViewSingleFieldMultiColumnDataSourceHelper _thumbsDs;
bool IsPhone { get { return UIDevice.CurrentDevice.UserInterfaceIdiom == UIUserInterfaceIdiom.Phone; } }
bool IsIphone5 { get { return UIDevice.CurrentDevice.UserInterfaceIdiom == UIUserInterfaceIdiom.Phone && UIScreen.MainScreen.Bounds.Size.Height * UIScreen.MainScreen.Scale >= 1136; } }
public IgGridPhotoViewer() { }
public override void ViewDidLoad() { _columnSize = IsPhone ? 75 : 100; _resizeThumbSize = IsPhone ? 30 : 50; _maxNumberOfColumns = IsPhone && !IsIphone5 ? 2 : 3; _portraitColumnCount = IsPhone ? 3 : 6; _resizeThumbOffset = IsPhone ? 10 : 20; _landscapeSize = IsPhone ? (!IsIphone5 ? new Size(480, 256) : new Size(568, 256)) : new Size(1024, 680); _portraitSize = IsPhone ? (!IsIphone5 ? new Size(320, 392) : new Size(320, 480)) : new Size(768, 935);
base.ViewDidLoad();
View.BackgroundColor = UIColor.White; View.Alpha = 1;
_photoGridView = new IGGridView(View.Frame, IGGridViewStyle.IGGridViewStyleSingleCellPaging);
_photoGridView.SelectionType = IGGridViewSelectionType.IGGridViewSelectionTypeNone; _photoGridView.AlwaysBounceVertical = false; _photoGridView.AlwaysBounceHorizontal = true; View.AddSubview(_photoGridView);
_thumbsGridView = new IGGridView(); _thumbsGridView.RowSeparatorHeight = 0; _thumbsGridView.SelectionType = IGGridViewSelectionType.IGGridViewSelectionTypeCell; _thumbsGridView.HeaderHeight = 0; _thumbsGridView.RowHeight = _columnSize; View.AddSubview(_thumbsGridView);
_photos = GetAnimals().ToArray();
_col = new IGGridViewImageColumnDefinition(@"Image", IGGridViewImageColumnDefinitionPropertyType .IGGridViewImageColumnDefinitionPropertyTypeStringUrl);
_photoDs = new IGGridViewSingleRowSingleFieldDataSourceHelper(_col); _photoDs.Data = _photos;
_thumbCol = new IGGridViewImageColumnDefinition(@"thumb", IGGridViewImageColumnDefinitionPropertyType .IGGridViewImageColumnDefinitionPropertyTypeStringUrl);
_thumbsDs = new IGGridViewSingleFieldMultiColumnDataSourceHelper(_thumbCol); _thumbsDs.NumberOfColumns = 1; _thumbsDs.Data = _photos;
_singleRowThumbDs = new IGGridViewSingleRowSingleFieldDataSourceHelper(_thumbCol); _singleRowThumbDs.Data = _photos;
_thumbsGridView.DataSource = _thumbsDs;
_photoGridView.ScrollEnabled = true;
_thumbsGridView.ReloadData();
_thumbsGridView.PagingEnabled = true;
/* var selectPath = [ds deNormalizePath:selectPath]; [_thumbsGridView selectCellAtPath:selectPath animated:NO scrollPosition:IGGridViewScrollPositionNone]; [_thumbsGridView scrollToCellAtCellPath:selectPath atScrollPosition:IGGridViewScrollPositionNone animated:NO];*/
}
public List<PhotoData> GetAnimals() { var animals = new List<PhotoData>(); for (int i = 0; i < 100; i++) { animals.Add(new PhotoData(string.Format("http://placekitten.com/{0}/{0}", Random(20) + 300))); }
return animals; }
private readonly System.Random _random = new System.Random(); protected int Random(int count) { return _random.Next(count); }
[Register("PhotoData")] public class PhotoData : NSObject {
public PhotoData(string image) { Image = image; }
[Export("Image")] public string Image { get; set; } }
Hi Blake!
I'd be happy to create a C# version of the sample for you.
Which part of the sample are you looking for? Do you want the thumbnails portion, the large viewer, or both. The only reason i ask is so that you don't get any extraneous code that you don't need.
Let me know and i'll put something together for you today.
-SteveZ
Howdy Steve,
I sure would appreciate the C# example! I'm trying to create both the thumbnails portion and the large viewer. I really don't have a need for the editing or resizing pieces though. I eventually plan show the picture in the larger viewer full screen when the user taps it. You're awesome!
-Blake
Hi Blake,
That all comes down to this code located in ViewDidLoad:
_landscapeSize = new SizeF(UIScreen.MainScreen.Bounds.Height, UIScreen.MainScreen.Bounds.Width); _portraitSize = new SizeF(UIScreen.MainScreen.Bounds.Width, UIScreen.MainScreen.Bounds.Height);
Basically, these are the sizes that we're accounting for when we do our calculations throughout this application.
In the project i sent you, I kept it simple, and just assumed the MainScreen size. However, you can change this code to account for your actual available size. Note, the navigation bar actually changes size when you rotate it, so it's not a fixed size, and that size is different for the iPhone and iPad.
I believe the sizes are:
44 on iPad Landscape and Portrait
44 on iPhone Portrait
32 on iPhone Landscape
So you could do something like:
float landscape = (UIDevice.CurrentDevice.UserInterfaceIdiom == UIUserInterfaceIdiom.Phone) ? 32 : 44; _landscapeSize = new SizeF(UIScreen.MainScreen.Bounds.Height, UIScreen.MainScreen.Bounds.Width - landscape); _portraitSize = new SizeF(UIScreen.MainScreen.Bounds.Width, UIScreen.MainScreen.Bounds.Height - 44);
Hope this helps,
Steve,
Once again I sincerely appreciate all of your help on this one. One thing I seem to be stuck on is compensating for a navigation bar at the top. I can't quite seem to figure out what all I need to change. The large photo grid at the top seems to 'jump' one the animation starts, and then the small thumb grid either overlaps the large top grid or has a large space between the two. As always I sincerely appreciate your help!!
Hey Blake,
No problem.
The project i gave you was built for the iPad only. Just open the Info.plist file and set the Devices drop down to Universal instead of iPad. That should do the trick.
Once again, thanks for all of your help! I can't seem to get the sample working on iPhone. I created a new iPhone project, it crashes on window.MakeKeyAndVisible(). Any ideas what might be going on?
Blake
Here is the full sample.
Enjoy!