iPhone如何展示滑动照片/图片（例如照片库和Facebook应用程序）？

Question

我几天前开始开发iOS应用，所以对一切都很陌生！ 我需要在一个应用程序中展示一个“照片滑块”，就像iPhone库或Facebook应用程序中的那样。 经过一些研究，我走到了死胡同。我的目标是逐个显示一组照片，并让用户从右到左或从左到右滑动手指 :-) 有人有例子或知道一个吗？ 谢谢大家。

- Hugo

Answer 1

虽然Three20非常出名，但我不建议你使用它。如果你只需要一个图片滑动器，那么将整个Three20框架放入你的项目中，并尝试弄清楚基于URL的导航方式可能会非常麻烦。

这里有一个更好的替代方案，https://github.com/enormego/PhotoViewer。它是一个独立的图片滑动器实现，以及相应的图像缓存。你可以在作者的博客http://developers.enormego.com/上了解更多关于代码如何工作的信息。

- Di Wu

---

是的，我也想说Three20的问题。基于URL的导航真的很麻烦。 - timothy5216

这些都是很棒的应用示例，但如果能够提供一些逐步解释如何实现的说明，那就更有用了。也许可以提供视频或文本教程？不过还是感谢您提供这些优秀的资源。 - user751829

Answer 2

您可以使用以下示例代码来创建图像幻灯片。这里的“scr”是滚动视图对象。

NSMutableArray *imgs=[[NSMutableArray  alloc]init]; 
                         // arrayWithObjects:[UIImage @"abc1.jpg"],[UIImage @"abc2.jpg"],[UIImage @"abc3.jpg"], [UIImage@"abc4.jpg"],
//                [ UIImage @"abc5.jpg"],nil];

                      [imgs addObject:[UIImage imageNamed:@"abc1.jpg"]];
                      [imgs addObject:[UIImage imageNamed:@"abc2.jpg"]];
                       [imgs addObject:[UIImage imageNamed:@"abc3.jpg"]];
                        [imgs addObject:[UIImage imageNamed:@"abc4.jpg"]];
                         [imgs addObject:[UIImage imageNamed:@"abc5.jpg"]];
for(int i=0;i<imgs.count;i++)
{
    CGRect frame;
    frame.origin.x=self.scr.frame.size.width *i;
    frame.origin.y=0;
    frame.size=self.scr.frame.size;
    UIImageView *subimg=[[UIImageView alloc]initWithFrame:frame];
    subimg.image=[imgs objectAtIndex:i];
    [self.scr  addSubview:subimg];
    [subimg release];
    self.scr.contentSize=CGSizeMake(self.scr.frame.size.width*imgs.count, self.scr.frame.size.height);

}

- yhpets

---

这很棒，新手可能想在Storyboard View Controller中关闭“使用自动布局”，并打开“分页启用”。此外，由于您只需要一次，因此应将设置contentSize的最后一行放在for循环之外。 self.scr.contentSize = CGSizeMake(self.scr.frame.size.width * imgs.count，self.scr.frame.size.height);我喜欢这个答案，但希望扩展它以允许方向更改，请参阅我的答案以获取更多信息。（很难在这里放置代码）。 - Jim True

这很棒。但是你如何添加弹性，使其在滚动时停止图片？就像应用商店一样。 - Viper

Answer 3

在yhpets的回答基础上，通过对每个ImageView应用标签并使用它们来引用每个ImageView，在设备旋转时调整大小，也支持方向更改...

在您的ViewController.h文件中，您需要设置Array和ScrollView...

@interface ViewController : UIViewController{
    NSMutableArray *imgs;
    IBOutlet UIScrollView *scr;
}
@property (strong, nonatomic) IBOutlet UIScrollView *scr;

在您的ViewController.m中，您需要监听didRotateFromInterfaceOrientation事件，并调整ImageViews以适应新屏幕。我们需要根据横向或纵向设置screenWidth和screenHeight变量，并使用它们来调整每个imageview和scrollview的大小。

@implementation ViewController
@synthesize scr;

- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation{
        CGRect screenRect = [[UIScreen mainScreen] bounds];
        CGFloat screenWidth = screenRect.size.width;
        CGFloat screenHeight = screenRect.size.height;
    if ((self.interfaceOrientation == UIInterfaceOrientationPortraitUpsideDown)||(self.interfaceOrientation == UIInterfaceOrientationPortrait)){
//screenWidth and screenHeight are correctly assigned to the actual width and height
    }else{
        screenHeight = screenRect.size.width;
        screenWidth = screenRect.size.height;
        screenRect.size.width = screenWidth;
        screenRect.size.height = screenHeight;
    }
    NSLog(@"see it's right now= (%f,%f)",screenWidth,screenHeight);
    self.scr.contentSize=CGSizeMake(screenWidth*imgs.count, screenHeight);
    for(int i=0;i<imgs.count;i++){
        UIImageView *targetIV = (UIImageView*)[self.view viewWithTag:(i+1)];
        CGRect frame;
        frame.origin.x=screenWidth *i;
        frame.origin.y=0;
        frame.size=CGSizeMake(screenWidth, screenHeight);
        targetIV.frame = frame;
    }
}///////////////////////////////////////////////////////////////////////////
- (void)viewDidLoad{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    imgs=[[NSMutableArray  alloc]init];
    [imgs addObject:[UIImage imageNamed:@"1001.png"]];
    [imgs addObject:[UIImage imageNamed:@"1002.png"]];
    [imgs addObject:[UIImage imageNamed:@"1003.png"]];
    [imgs addObject:[UIImage imageNamed:@"1004.png"]];
    for(int i=0;i<imgs.count;i++){
        CGRect frame;
        frame.origin.x=self.scr.frame.size.width *i;
        frame.origin.y=0;
        frame.size=self.scr.frame.size;
        UIImageView *subimg=[[UIImageView alloc]initWithFrame:frame];
        subimg.image=[imgs objectAtIndex:i];
        subimg.tag = (i+1);
        subimg.contentMode = UIViewContentModeScaleAspectFit;
        [self.scr  addSubview:subimg];
    }
    self.scr.contentSize=CGSizeMake(self.scr.frame.size.width*imgs.count, self.scr.frame.size.height);
}

- Jim True

Answer 4

如果你想查看的话，Three20中有一个名为“photo slider”的功能 - https://github.com/facebook/three20/tree/master/samples/TTCatalog - 只需下载源代码并构建TTCatalog即可。

- timothy5216

---

该项目不再得到支持，因此不要尝试浪费时间。 - PAC