java - Xcode 图像链接 ImageView 到下一个 View Controller

Question

我为一个选项卡式应用程序制作了一个 Xcode 项目，该应用程序在 ScrollView 中显示色样图像。如何链接 ScrollView 中的其中一张图像以转到下一个 View Controller ？下面是我的代码和图片。因此，当您在 ScrollView 中单击其中一个图像或样本颜色时，它会链接到新 Controller 。

我有多个向下滚动 iPhone 页面的图像，我是否必须循环显示图像，因为有 24 个图像。我能够制作一个按钮并使用界面生成器将其链接到下一个场景，但我可以在屏幕上放置 5 张图像。

DecorsViewController_iPhone.h

 #import <UIKit/UIKit.h>

 @interface DecorsViewController_iPhone : UIViewController

 {
IBOutlet UIScrollView *scrollViewDecors;
 }

@property (nonatomic, retain) UIView *scrollViewDecors;

@end

DecorsViewController_iPhone.m

#import "DecorsViewController_iPhone.h"

@interface DecorsViewController_iPhone ()

@end

@implementation DecorsViewController_iPhone


@synthesize scrollViewDecors;


const CGFloat kScrollObjHeight  = 81.5;
const CGFloat kScrollObjWidth   = 320.0;
const NSUInteger kNumImages     = 24;


- (void)layoutScrollImages
{
UIImageView *view = nil;
NSArray *subviews = [scrollViewDecors subviews];

// reposition all image subviews in a horizontal serial fashion
CGFloat curXLoc = 0;
CGFloat curYLoc = 0;
CGFloat curYSpace = 1;

for (view in subviews)
{
    if ([view isKindOfClass:[UIImageView class]] && view.tag > 0)
    {
        CGRect frame = view.frame;
        frame.origin = CGPointMake(curXLoc, curYLoc);
        view.frame = frame;

        curYLoc += (curYSpace + kScrollObjHeight);
    }
}

// set the content size so it can be scrollable
    [scrollViewDecors setContentSize:CGSizeMake(([scrollViewDecors bounds].size.width), (kNumImages * kScrollObjHeight))]; // Vertical Option
 }

- (void)viewDidLoad
{
self.view.backgroundColor = [UIColor viewFlipsideBackgroundColor];

// 1. setup the scrollview for multiple images and add it to the view controller
//
// note: the following can be done in Interface Builder, but we show this in code for clarity
[scrollViewDecors setBackgroundColor:[UIColor blackColor]];
[scrollViewDecors setCanCancelContentTouches:NO];
scrollViewDecors.indicatorStyle = UIScrollViewIndicatorStyleWhite;
scrollViewDecors.clipsToBounds = YES;       // default is NO, we want to restrict drawing within our scrollview
scrollViewDecors.scrollEnabled = YES;

// pagingEnabled property default is NO, if set the scroller will stop or snap at each photo
// if you want free-flowing scroll, don't set this property.
// scrollView1.pagingEnabled = YES;

// load all the images from our bundle and add them to the scroll view
NSUInteger i;
for (i = 1; i <= kNumImages; i++)
{


    NSString *imageName = [NSString  stringWithFormat:@"Artwork_iPhone_Decors_Scrollview_%d.png", i];
    UIImage *image = [UIImage imageNamed:imageName];
    UIImageView *imageView = [[UIImageView alloc] initWithImage:image];

    // setup each frame to a default height and width, it will be properly placed when we call "updateScrollList"
    CGRect rect = imageView.frame;
    rect.size.height = kScrollObjHeight;
    rect.size.width = kScrollObjWidth;
    imageView.frame = rect;
    imageView.tag = i;  // tag our images for later use when we place them in serial fashion
    [scrollViewDecors addSubview:imageView];
    //[imageView release];
}

[self layoutScrollImages];  // now place the photos in serial layout within the scrollview

}

//- (void)dealloc
//{ 
//  [scrollViewDecors release];
//  
//  [super dealloc];
//}

//- (void)viewDidLoad
//{
// [super viewDidLoad];
//  // Do any additional setup after loading the view, typically from a nib.
//}

- (void)viewDidUnload
{
[super viewDidUnload];
// Release any retained subviews of the main view.
}

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
if ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPhone) {
    return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown);
} else {
    return YES;
}
}

@end

Answer 1

首先，您需要在 View 中添加一个手势识别器，例如:

UITapGestureRecognizer *singleTapGestureRecognizer = [[UITapGestureRecognizer alloc]
                                                          initWithTarget:self
                                                          action:@selector(flipView:)];
    [singleTapGestureRecognizer setNumberOfTapsRequired:1];
    [self.view addGestureRecognizer:singleTapGestureRecognizer];

然后您需要实现“flipView”方法:

- (void)flipView:(UIPanGestureRecognizer *)recognizer {
    [self performSegueWithIdentifier:@"textView" sender:self];
}

正如您在我的例子中所见，当方法被触发时，我执行一个 segue(见下文):

- (void) prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    if ([segue.identifier isEqualToString:@"textView"])
    {
        //---Pass text to view
        CGRect visibleRect;
        visibleRect.origin = scrollView.contentOffset;
        visibleRect.size = scrollView.bounds.size;

        int number;

        if ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPad) {
            number = visibleRect.origin.x / 768;
        }
        else {
            number = visibleRect.origin.x / 320;
        }

        TextViewController *textViewController = segue.destinationViewController;
        AppDelegate *appDelegate = [[UIApplication sharedApplication] delegate];
        textViewController.text = [appDelegate.textArray objectAtIndex:number];
    }
}

'number' 变量用于确定哪个图像被点击，我将可见矩形原点除以屏幕宽度(以像素为单位)以计算哪个图像被按下以及因此将哪些数据发送到我的新 View 。

在您的情况下，您将使用 Y 坐标执行计算以确定按下了哪种颜色，可能类似于:

int number;

            if ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPad) {
                number = visibleRect.origin.y / <height of each image on iPad in pixels>;
            }
            else {
                number = visibleRect.origin.y / <height of each image on iPhone in pixels>;
            }

或者，您可以使用 UITableView 并使用适当的颜色填充单元格，然后根据按下的单元格显示新 View 。

编辑 使用 UITableView，并使用自定义表格 View 单元格将图像填充到每个单元格。这比您建议的方法简单得多。

查看这些链接: adding images to UItableView

如果使用 iOS 5 - http://kurrytran.blogspot.co.uk/2011/10/ios-5-storyboard-uitableview-tutorial.html 如果不 - http://www.iosdevnotes.com/2011/10/uitableview-tutorial/

您正在使这项任务过于复杂，按照上面的教程进行操作，您很快就会完成。如果此回答对您有帮助，请标记为正确。