使用 XML 文件从 URL 获取 iPhone 图片

引言

本文介绍如何使用 XML 文件作为媒介，在 iPhone 上显示来自网络的图像。在本文中，我们将学习两件事。因此，让我们分两个阶段来处理这篇文章

1. 在 iPhone 中解析 XML 文件
2. 从 Web URL 显示图像

在 iPhone 中解析 XML 文件 (NSXML 库)

Apple 提供了 NSXMLParser 用于在 iPhone 项目中解析 XML 文件。此解析器将 Web URL 作为输入路径（文件应位于 Web 中），并解析文档。NSXMLParser 的委托方法会为您完成剩下的工作。

NSXMLParser 类的以下三个委托方法用于解析 XML 文件。

• didStartElement
• didEndElement
• foundCharacters

didStartElement

当解析器对象看到给定元素的起始标签时，此方法由解析器对象发送给其委托。语法如下

- (void)parser:(NSXMLParser*)parser didStartElement:(NSString *)
	elementName namespaceURI:(NSString  *)namespaceURI qualifiedName:
	(NSString *)qName attributes:(NSDictionary  *)attributeDict

didEndElement

当解析器对象看到给定元素的结束标签时，此方法由解析器对象发送给其委托。语法如下

-(void)parser:(NSXMLParser*)parser didEndElement:(NSString *)elementName 
	namespaceURI:(NSString*)
namespaceURI qualifiedName:(NSString *)qName

foundCharacters

当解析器对象找到给定元素的开始标签和结束标签之间的字符时，此方法由解析器对象发送给其委托。语法如下

- (void)parser:(NSXMLParser *)parser foundCharacters:(NSString *)string

来自 URL 的 UIImage

从 URL 显示图像是一个 3 步流程

1. 从 Web URL 创建一个 NSURL 对象
2. 使用 NSData 对象中的图像数据加载 NSURL 对象
3. 将图像数据 NSData 分配给 UIImage

NSURL *url = [NSURL 
URLWithString:@”www.ArticleDean.com\images\sample.jpg”];
NSData *data = [NSData dataWithContentsOfURL:url];
UIImage *image = [[UIImage alloc] intiWithData:data]; 

这是我们开始进行原始应用程序之前需要的最基本的知识。让我们开始编写我们的应用程序。

步骤 1：创建一个基于视图的应用程序，并将项目命名为 XMLWebImages。

步骤 2：打开 XMLWebImagesViewController.h，添加 IBOutlet 类型的 UIScrollView 的对象 scrollView。在 XMLWebImagesViewController.m 中合成视图对象 scrollView。

步骤 3：创建一个从 UIViewSubclass 继承的新类，并将其命名为 XMLWebView，并添加一个 UIImageView 对象作为 IBOutlet，并将其称为 imageView。调用 getter 和 setter，并合成 imageView 对象。

#import <UIKit/UIKit.h> 
@interface XMLWebImageViewController : UIViewController 
{
    IBOutlet UIScrollView *webScrollView;        
}
@property (nonatomic, retain) IBOutlet UIScrollView * webScrollView;
@synthesize scrollView;

步骤 3：创建一个从 UIViewSubclass 继承的新类，并将其命名为 XMLWebView，并添加一个 UIImageView 对象作为 IBOutlet，并将其称为 imageView。调用 getter 和 setter，并合成 imageView 对象。

@interface XMLWebView : UIView 
{ 
    IBOutlet UIImageView *imageView;
}
@property (nonatomic, retain) IBOutlet UIImageView *imageView;
@synthesize imageView; 

步骤 4：创建一个 .XIB 接口构建器文件，并将 imageView 对象连接到文档窗口中的 XMLWebView，以显示我们的图像。

步骤 5：创建一个从 NSObject 继承的 XMLWebElement 类，以保存 UIImage 对象，用于保存 Web 图像。

@interface XMLWebElement: NSObject 
{
 UIImage *imgXML;
}
@property (nonatomic, retain) UIImage * imgXML;
@end
@synthesize image;

步骤 6：现在是时候开始解析并从 articledean.com 获取图像了。打开 XMLWebImagesViewController.h 文件并创建一个 NSXMLParser 对象，并将 XML 项集合放入一个 XMLWebElements 数组和一个临时 XMLWebElement 对象中。

@interface XMLWebImagesViewController: UIViewController 
{ 
    IBOutlet UIScrollView *scrollview;
    NSXMLParser *xmlParser;
    NSMutableString *currentNode;
    NSMutableArray *xmlElements;
    XMLWebElement *tempElement;
} 

为此编写 getter 和 setter，并在 XMLWebImagesViewController.m 文件中合成这些对象。

现在，在 viewDidLoad 方法中，为 xmlElements 分配内存，并将解析器与 Web XML 文件关联。

- (void)viewDidLoad
{ 
    [super viewDidLoad];
    xmlElements = [[NSMutableArray alloc] init];
    xmlParser = [[NSXMLParser alloc] initWithContentsOfURL:
	[NSURL URLWithString:@"http://www.articledean.com/images.xml"]];
    [xmlParser setDelegate:self]; 
    [xmlParser parse];
}

现在是时候添加 NSXMLParser 的委托方法，并且我在这里介绍一个示例 XML 文件结构。

<WebImages> 
   <image> 
        <URL>http://www.articledean.com/testimage1.jpg</URL>
   </image>
   <images> 
        <URL>http://www.articledean.com/testimage2.jpg</URL>
   </images>
</WebImages>

现在填写委托方法以从 Web 获取图像 URL 并加载 XMLWebElements 数组。

- (void)xmlParser:(NSXMLParser *)xmlParser didStartElement:
	(NSString *)elementName namespaceURI:(NSString *)namespaceURI 
	qualifiedName:(NSString *)qName attributes:(NSDictionary *)attributeDict
{
    if(![elementName compare:@"PictureInfo"])
    {
        tempElement = [[iCodeBlogXMLElement alloc] init];
    }

    else if(![elementName compare:@"imageURL"])
    {
        currentAttribute = [NSMutableString string];
    }

    else if(![elementName compare:@"imageTitle"])
    {
        currentAttribute = [NSMutableString string];
    }
}

- (void)parser:(NSXMLParser *)parser didEndElement:(NSString *)
    elementName namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName
{
    if(![elementName compare:@"PictureInfo"])
    {
        [xmlElementObjects addObject:tempElement];
    }
    else if(![elementName compare:@"imageURL"])
    {
        NSURL *imageURL = [NSURL URLWithString:currentAttribute];
        NSData *data =  [NSData dataWithContentsOfURL:imageURL];
        UIImage *image = [[UIImage alloc] initWithData:data];
        [tempElement setImage:image];
    }
    else if(![elementName compare:@"imageTitle"])
    {
        NSLog(@"The image title is %@", currentAttribute);
        [tempElement setImageTitle:currentAttribute];
    }
    else if(![elementName compare:@"Pictures"])
    {
        [self layoutSubview];
    }
}

- (void)parser:(NSXMLParser *)parser foundCharacters:(NSString *)string
{
    if(self.currentAttribute)
    {
        [self.currentAttribute appendString:string];
    }
} 

我们几乎完成了代码。剩余部分很容易。现在数组已填充图像 URL。遍历数组并将图像分配给 UIView 并在滚动视图中显示它们。

参考文献

• http://www.ArticleDean.com
• http://icodeblog.com

历史

• 2010 年 5 月 8 日：初始发布