如何将多个 UIImageViews 添加到分页 UIScrollView? [英] How to add multiple UIImageViews to paging UIScrollView?
问题描述
我有一个启用分页的 UIScrollView，页面上有多个子视图:UIButton、UIwebview 和 UIImageView.webview 和图像在每个页面上都会发生变化.这工作正常.我使用 Apples 滚动图像分页示例让我开始了.
I have a UIScrollView with paging enabled with multiple subviews on the page: a UIButton, UIwebview and UIImageView. Both the webview and the image change on every page. This works fine. I used Apples scrolling image paging example to get me started.
但是当我添加第二个 UIImageView 时，我所拥有的图像位置已经获得了新值并且新图像不会显示.
But when I add a second UIImageView, the position of image I have in place already gets the new values and the new image doesn't display.
这是 viewdidload 中第一张图片的代码(工作正常):
This is the code inside viewdidload for the first image (works fine):
// load all the images from our bundle and add them to the scroll view
for (i = 1; i <= kNumImages; i++)
{
NSString *imageName = [NSString stringWithFormat:@"image%d.jpg", i];
UIImage *image2 = [UIImage imageNamed:imageName];
UIImageView *imageView2 = [[UIImageView alloc] initWithImage:image2];
// setup each frame to a default height and width, it will be properly placed when we call "updateScrollList"
CGRect rect = imageView2.frame;
rect.size.height = imageviewScrollObjHeight;
rect.size.width = imageviewScrollObjWidth;
// Get the Layer of any view
CALayer * imageLayer = [imageView2 layer];
[imageLayer setMasksToBounds:YES];
[imageLayer setCornerRadius:7.0];
// You can even add a border
[imageLayer setBorderWidth:1.0];
[imageLayer setBorderColor:[[UIColor lightGrayColor] CGColor]];
imageView2.frame = rect;
imageView2.tag = i; // tag our images for later use when we place them in serial fashion
[scrollView1 addSubview:imageView2];
}
[self layoutScrollImages]; // now place the photos in serial layout within the scrollview
这是在每个页面上布局第一张图像的代码，每页不同的图像(外部viewdidload)(工作正常):
This is the code to layout the first image on every page, different image per page(outside viewdidload)(works fine):
// layout images for imageview1
- (void)layoutScrollImages
{
UIImageView *imageView = nil;
NSArray *subviews = [scrollView1 subviews];
// reposition all image subviews in a horizontal serial fashion
CGFloat curXLoc = 10;
for (imageView in subviews)
{
if ([imageView isKindOfClass:[UIImageView class]] && imageView.tag > 0)
{
CGRect frame = imageView.frame;
frame.origin = CGPointMake(curXLoc, 50);
imageView.frame = frame;
curXLoc += (kScrollObjWidth);
}
}
// set the content size so it can be scrollable
[scrollView1 setContentSize:CGSizeMake((kNumImages * kScrollObjWidth), [scrollView1 bounds].size.height)];
}
这是第二张图片的代码(在viewdidload里面):(当我删除[self layoutNavScrollImages]时；图片只在第一页加载)
This is the code for the second image (inside viewdidload): (when i remove [self layoutNavScrollImages]; the image loads only on the first page)
for (i = 1; i <= kNumImages; i++)
{
UIImage *navBarImage = [UIImage imageNamed:@"navigationbar.png"];
UIImageView *imageViewNavBar = [[UIImageView alloc] initWithImage:navBarImage];
// setup each frame to a default height and width, it will be properly placed when we call "updateScrollList"
CGRect navBarRect = imageViewNavBar.frame;
navBarRect.size.height = 44;
navBarRect.size.width = 320;
navBarRect.origin.x = 0;
navBarRect.origin.y = 0;
/* Get the Layer of any view
CALayer * imageLayer = [imageView3 layer];
[imageLayer setMasksToBounds:YES];
[imageLayer setCornerRadius:7.0];
// You can even add a border
[imageLayer setBorderWidth:1.0];
[imageLayer setBorderColor:[[UIColor lightGrayColor] CGColor]];
*/
imageViewNavBar.frame = navBarRect;
imageViewNavBar.tag = i; // tag our images for later use when we place them in serial fashion
[scrollView1 addSubview:imageViewNavBar];
}
[self layoutNavScrollImages];
以及viewdidload之外的代码:(这个覆盖了第一张图片的位置)
And the code outside viewdidload:(this overwrites the position of the first image)
- (void)layoutNavScrollImages
{
UIImageView *view = nil;
NSArray *subviews = [scrollView1 subviews];
// reposition all image subviews in a horizontal serial fashion
CGFloat curXLoc = 0;
for (view in subviews)
{
if ([view isKindOfClass:[UIImageView class]] && view.tag > 0)
{
CGRect frame = view.frame;
frame.origin = CGPointMake(curXLoc, 0);
view.frame = frame;
curXLoc += (kScrollObjWidth);
}
}
// set the content size so it can be scrollable
[scrollView1 setContentSize:CGSizeMake((kNumImages * kScrollObjWidth), [scrollView1 bounds].size.height)];
}
推荐答案
这样做的方法是制作一个(大)UIView 并将每个 UIImageView 添加为该 UIView 的子视图.然后将 UIView 作为子视图添加到 UIScrollView.
The way to do this is to make one (big) UIView and add every UIImageView as a subview of that UIView. And then add the UIView as a subview to UIScrollView.
[totalView addSubview:imageView1];
[totalView addSubview:imageView2;
[totalView addSubview:buttonView1];
[totalView addSubview:buttonView2];
[totalView addSubview:webView];
[scrollView addSubview:totalView];
请务必设置正确的内容大小，否则滚动视图将不起作用:
Be sure to set the right content size or scrollview wont work:
[scrollView setContentSize:CGSizeMake((320*kNumImages), 411)];
设置视图并标记 UIView(在 viewdidload 中):
Setup views and tag the UIView (inside viewdidload):
NSUInteger i;
for (i = 1; i <= kNumImages; i++)
{
//... code to setup views
totalView.tag = i;
}
[self layoutViews]; // now place the views in serial layout within the scrollview
然后在每个页面上布局视图:
Then to layout the view on every page:
- (void)layoutViews
{
UIView *view = nil;
NSArray *subviews = [scrollView subviews];
// reposition all image subviews in a horizontal serial fashion
CGFloat curXLoc = 0;
for (view in subviews)
{
if ([view isKindOfClass:[UIView class]] && view.tag > 0)
{
CGRect frame = view.frame;
frame.origin = CGPointMake(curXLoc, 0);
view.frame = frame;
curXLoc += (kScrollObjWidth);
}
}
}
我希望这尽可能清楚.如果有人认为这不是正确的做法，请发表评论.
I hope this is as clear as possible. If anyone thinks this is not the right way to do it please comment.
这篇关于如何将多个 UIImageViews 添加到分页 UIScrollView?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
