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

Posted 2023-03-04

【中文标题】Xcode 图像将 ImageView 链接到下一个 View Controller

【英文标题】：Xcode image link ImageView into next View Controller

【发布时间】：2012-09-12 10:55:55

【问题描述】：

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

我有多个图像可以向下滚动 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

【参考方案1】：

首先，您需要在视图中添加手势识别器，例如：

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];
    

“数字”变量用于决定单击了哪个图像，我将可见矩形原点除以屏幕宽度（以像素为单位），以计算出哪个图像已被按下，因此将哪些数据发送到我的新视图。

在您的情况下，您将使用 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 并使用适当的颜色填充单元格，然后根据按下的单元格显示新视图。

编辑 使用 UITableView，并使用自定义表格视图单元格用您的图像填充每个单元格。这比您建议的方法要容易得多。

查看这些链接： 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/

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

【讨论】：

如何在每个图像上制作一个透明按钮以转到新的视图控制器，我有 24 个可滚动的图像。我可以使用界面生成器制作一个按钮并将其链接到翻转模式并且它可以工作，但我只能对屏幕高度的 5 个图像执行此操作，我有 24 个图像，这就是我需要它滚动的原因。我是 Xcode 的新手。

我不明白你为什么不直接使用 UITableView？它似乎非常适合您想要实现的目标？只需使用 cellForRowAtIndexPath 用数组填充它，然后使用 didSelectRowAtIndexPath 来确定选择了哪种颜色/单元格，从而确定要显示的视图。

我是 Xcode 新手，不知道如何填充表格视图以反映我自己的自定义图像以及如何将表格链接到新视图。我能够轻松地制作一个选项卡式应用程序，但是在不得不使用滚动视图时我被卡住了。我拥有的图像数量的原因。

【参考方案2】：

您可以自定义您的 UIImageView。例如，MyImageView。将其委托设置为您的主 ScrollView 并添加 UITapGestureRecognizer 和 TapDetecting 委托方法。 您可以在 MyImageView 中实现：

- (void)handleSingleTap:(UIGestureRecognizer *)gestureRecognizer 
// single tap 
if ([_delegate respondsToSelector:@selector(myImageViewWasSingleTapped:)])
    [_delegate myImageViewWasSingleTapped:self];

然后在您的主 ScrollView（MyImageView 的代表）中：

- (void)myImageViewWasSingleTapped:(MyImageView *)miv 
    AnotherViewController *asv = [[AnotherViewController alloc] initWithImage: miv];
    [self.navigationController pushViewController: asv animated:YES];
    [asv release];

【参考方案3】：

您可以使用按钮而不是 UIImageView，并将按钮的图像设置为您的图像。你在 viewDidLoad 中的循环是这样的：

// 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];
    UIButton *imageButton = [[UIButton alloc] init];
    [imageButton setImage:image forState:UIControlStateNormal];
    [imageButton addTarget:self action:@selector(pushNextViewController:) forControlEvents:UIControlEventTouchUpInside];

    // setup each frame to a default height and width, it will be properly placed when we call "updateScrollList"
    CGRect rect = CGRectMake(0, 0, kScrollObjWidth, kScrollObjHeight);
    imageButton.frame = rect;
    imageButton.tag = i;  // tag our images for later use when we place them in serial fashion
    [scrollViewDecors addSubview:imageButton];
    // Release imageButton unless you're using ARC

然后你需要为 imageButton 定义一个动作，在这种情况下我称之为 pushNextViewController：

- (void)pushNextViewController:(id)sender

    UIViewController *yourNextViewController = // initialise your next view controller here
    [self.navigationController pushViewController:yourNextViewController animated:YES];

【讨论】：

我用上面的代码更新了我的代码，它只在我的滚动视图中显示了一个图像，并且你给我的代码的第二部分出现了错误。 （使用不兼容类型“void”的表达式初始化 UIViewController _strong

我所做的最远的事情是能够使图像像上图那样滚动。因为有 22 张图像。我可以将一个图像变成一个按钮并链接到我的下一个场景没问题。我在滚动视图中放置多个按钮时遇到了困难？