id | title | brief | sdk | ||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
2D35598D-04B2-BE01-C1A0-5C17810C77E0 |
Use a ScrollView |
This recipe shows how to load a large image into a scroll view. |
|
To display an image inside a scroll view:
-
Add the image to your Xamarin.iOS project and ensure the Build Action is set to BundleResource. The example code loads the image “halloween.jpg”
-
Declare class level fields for a
UIScrollView
andUIImageVIew
.
UIScrollView scrollView;
UIImageView imageView;
- Create a
UIScrollView
and it to the View Controller:
scrollView = new UIScrollView (
new CGRect (0, 0, View.Frame.Width, View.Frame.Height));
View.AddSubview (scrollView);
- Create a
UIImageView
with the image halloween.jpg. and add it to the Scroll View:
imageView = new UIImageView (UIImage.FromFile ("halloween.jpg"));
scrollView.ContentSize = imageView.Image.Size;
scrollView.AddSubview (imageView);
Only a portion of the image will appear on the iPhone screen, as we set the ContentSize
of the Scroll View to the full size of the image, which is large than the size of the display. The user can
pan around the image by dragging. By default, the image cannot be zoomed (see
the Zoom a Scroll View recipe).
This screenshot shows how the remainder of the image is outside the viewable area on the device.