جلسه 22 ام از آموزش iOS:ساخت یک RSS Reader - با مثال

در این جلسه قصد داریم ، نحوه ساخت یک اپ ساده آیفون با کاربرد RSS feed را نشان دهیم . این اپ ، مبتنی بر طراحی master/detail  خواهد بود ؛ به طوری که ، master view ، لیستی از feed های (خوراک) در دسترس را نشان داده و detail view ، صفحات وب متناظر را نشان خواهد داد.

هسته اپلیکیشن ، کلاس NSXMLParser است. NSXMLParser یک XML parser است ، که به طور پیش فرض حاوی iPhone SDK است. NSXMLParser یک SAX parser است ؛ بدین معنی که ، با یک سبک رویداد محور (event driven) ، با فایل های parsing XML ، انطباق دارد. هر گاه که parser ، پردازش بخشی از فایل XML را به اتمام برساند ، یک متد از نماینده parser ، را فراخوانی می کند.

ساخت یک اپلیکیشن Master Detail

Xcode را باز کرده و یک پروژه جدید ، ایجاد می کنیم. تمپلت Master Detail Application ، را همان طور که در شکل زیر نشان داده شده است ، انتخاب می کنیم.

در صفحه بعد ، RSSreader را به عنوان product name وارد می کنیم و فیلد company identifier را نیز تکمیل می نماییم. فراموش نکنیم که گزینه های “User Storyboard” و “Use Automatic Reference Counting” را انتخاب نماییم. سپس ، کلید Next و Create را فشار می دهیم.

طراحی رابط کاربری

فایل MainStoryboard.storyboard را از  Xcode’s Navigator برای نمایش Storyboard در Editor pane ، انتخاب می نماییم.

همان طور که مشاهده می نمایید ، تقریباً تمام عناصری را که برای reader نیاز هست ، داریم:

• یک Navigation Bar برای به عقب و جلو رفتن از انباره ها (stories).
• یک Table View ، برای نمایش لیستی از انباره های موجود.
• یک Detailed View ، که حاوی یک Web View ، برای نمایش دادن محتویات انباره های (stories) انتخاب شده می باشد.

با این حال ، هنوز نیاز داریم که تغییرات اندکی را در Storyboard ایجاد کنیم ، تا یک رابط کاربری کاملاً کاربردی داشته باشیم.

ابتدا ، Master View Controller را انتخاب کرده و عنوان Navigation Bar را از “Master” به “Stories” ، یا هر عنوان دیگری که ترجیح می دهیم ، تغییر می دهیم. سپس ، روی کلید Assistant Editor ، کلیک می نماییم ، تا source code مرتبط با Master View Controller ، یعنی (APPMasterViewController.h) ، را باز نماییم و یک IBOutlet ، برای Table View ، ایجاد می کنیم (control drag  از UITableView به source code).

در فیلد Connection ، ما باید Outlet را انتخاب نماییم ، برای قسمت Name ، مقدار tableView  و برای Type ، مقدار UITableView را انتخاب می کنیم. در نهایت ، برای بخش Storage ، مقدار Strong ، را انتخاب می کنیم. این کار ، باید IBOutlet زیر را ایجاد نماید:

 @property (strong, nonatomic) IBOutlet UITableView *tableView; 

اکنون ، Detail View Controller را انتخاب کرده و دوباره عنوان Navigation Bar از “Detail” به “Content” تغییر می دهیم. سپس ، باید برچسب را از مرکز View به دلیل این که قصد نداریم از آن استفاده نماییم ، حذف می کنیم. فراموش نکنیم که خصیصه IBOutlet ، از فایل APPDetailViewController.h  و هم چنین خصیصه detailItem را حذف نماییم. در نهایت ، UIWebView را از Object Library ، درگ کرده و در Detail View Controller View رها می کنیم. باید مطمئن شویم که web view ، تمام فضای موجود را پر می کند.

دوباره ، باید یک IBOutlet از UIWebViwe ایجاد کنیم. از طریق روند مشابهی که در قسمت بالا ، شرح دادیم ، یک Outlet را به فایل APPDetailViewController.h ، درگ می کنیم و نام آن را webView ، قرار می دهیم. هم چنین @property دیگری از نوع NSString ، با copy modifier ، اضافه می کنیم. خصیصه string ، شامل آدرس URL مربوط به انباره فعلی انتخاب شده می باشد. اگر همه چیز را به درستی انجام دهیم ، فایل APPDetailViewController.h ، باید چیزی شبیه زیر باشد:

#import <UIKit/UIKit.h>
 
@interface APPDetailViewController : UIViewController
 
@property (copy, nonatomic) NSString *url;
@property (strong, nonatomic) IBOutlet UIWebView *webView;
 
@end

پیاده سازی Master View Controller

در فایل APPMasterViewController.m ، اعلام @interface را مطابق کد زیر تغییر می دهیم:

@interface APPMasterViewController () {
 
    NSXMLParser *parser;
    NSMutableArray *feeds;
    NSMutableDictionary *item;
    NSMutableString *title;
    NSMutableString *link;
    NSString *element;
 
}
@end

در کد بالا ، چندین متغیر کمکی را اعلام کردیم. parser ، شیئی است که فایل های XML را دانلود کرده و parse خواهد کرد. Feeds ، یک آرایه قابل تغییر است که شامل فهرستی از feeds دانلود شده خواهد بود. item ، یک dictionary قایل تغییر است که حاوی جزئیات feeds خواهد بود. در مثال ما ، title و link و در نهایت element ، به ما کمک می کنند تا عنصری که در حال حاضر ، در حال parsing شیء NSXMLParser است ، کنترل نماییم.

در تابع viewDidLoad  ، باید شیء NSXMLParser را مقداردهی اولیه کرده و آن را راه اندازی کنیم. برای سادگی ، در این مثال ، URL ، برای feed ، کد سختی است. برای سادگی کار ، ما از hot news feed مربوط به

Apple (http://images.apple.com/main/rss/hotnews/hotnews.rss)

استفاده می کنیم. در یک اپلیکیشن کاربردی ، ما باید به کاربر اجازه دهیم ، این آدرس ها را از رابط کاربری ، تغییر دهد.

- (void)viewDidLoad {
 
    [super viewDidLoad];
 
    feeds = [[NSMutableArray alloc] init];
    NSURL *url = [NSURL URLWithString:@"http://images.apple.com/main/rss/hotnews/hotnews.rss"];
    parser = [[NSXMLParser alloc] initWithContentsOfURL:url];
 
    [parser setDelegate:self];
    [parser setShouldResolveExternalEntities:NO];
    [parser parse];
 
}

از آن جایی که ما به کاربر ، اجازه نمی دهیم که به صورت دستی ، feeds اضافه نماید ، متد insertNewObject را حذف می نماییم و متدها را برای مدیریت جدول ، با کدهای زیر جایگزین می کنیم.

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 1;
}
 
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return feeds.count;
}
 
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];
    cell.textLabel.text = [[feeds objectAtIndex:indexPath.row] objectForKey: @"title"];
    return cell;
}

تنها عنصری که جدید است ، کد خط زیر می باشد که در آن ، ما عنوان سلول جاری را به عنوان feed تنظیم می نماییم:

cell.textLabel.text = [[feeds objectAtIndex:indexPath.row] objectForKey: @"title"];

هم چنین متدهای canEditRowAtIndexPath  و commitEditingStyle را نیز ، با توجه به این که به آنها نیازی نداریم ، حذف می کنیم.

پیاده سازی Parser Delegate

در ادامه ، باید متدهای نماینده parser را پیاده سازی کنیم. برای انجام این کار ، باید به کامپایلر بگوییم که کلاس ENTMasterViewController  ، از پروتکل NSXMLParserDelegate را اجرا کند. فایل  ENTMasterViewController.h را باز کرده و تعریف کلاس را تغییر می دهیم:

@interface ENTMasterViewController : UITableViewController

هنگامی که parser ، المان جدیدی می یابد ، متد didStartElement را از نماینده خود ، فراخوانی می کند. در آن متد ، باید بررسی کنیم که المان پیدا شده یک “item” است یا خیر. اگر چنین باشد ، متغیرها را برای ذخیره item  اختصاص می دهیم.

- (void)parser:(NSXMLParser *)parser didStartElement:(NSString *)elementName namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName attributes:(NSDictionary *)attributeDict {
    
 element = elementName;
    
 if ([element isEqualToString:@"item"]) {
        
 item    = [[NSMutableDictionary alloc] init];
 title   = [[NSMutableString alloc] init];
 link    = [[NSMutableString alloc] init];
        
    }
    
}

سپس ، parser ، نماینده خود را هر بار که کاراکترهای جدید پیدا می شوند ، فراخوانی می نماید. از آن جایی که ما باید کاراکترهای جدید پیدا شده را به موارد قبلی اضافه کنیم، از رشته های قابل تغییر استفاده می کنیم. در این مثال ، ما به عناصر “title” و “link” علاقمند هستیم ، اما می توانیم اطلاعات مربوط به “date” و “summery” را نیز ذخیره نماییم.

(void)parser:(NSXMLParser *)parser foundCharacters:(NSString *)string {
    
 if ([element isEqualToString:@"title"]) {
 [title appendString:string];
 } else if ([element isEqualToString:@"link"]) {
 [link appendString:string];
 }
 
}

هنگامی که parser ، به انتهای عنصر می رسد ، متد didEndElement را فراخوانی می  کند. در مثال ما ، به سادگی می توانیم شیء جدید را به آرایه اشیاء اضافه نماییم.

- (void)parser:(NSXMLParser *)parser didEndElement:(NSString *)elementName namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName {
    
 if ([elementName isEqualToString:@"item"]) {
        
 [item setObject:title forKey:@"title"];
 [item setObject:link forKey:@"link"];
 
 [feeds addObject:[item copy]];
 
 }
 
}

و هنگامی که parser به انتهای document می رسد ، متد parserDidEndDocument ، را فراخوانی می کند. در این مورد ، چیزی که باید انجام دهیم ، این است که UITableView را برای نمایش مجدد محتوای خود آگاه سازیم ، زیرا باید تمام داده ها نمایش داده شوند.

- (void)parserDidEndDocument:(NSXMLParser *)parser {
 
 [self.tableView reloadData];
    
}

پیاده سازی Detail View Controller

ما نیاز به روشی داریم که Detail View Controller را ، در مورد URL مربوط به feed ، که می خواهیم نمایش داده شود ، آگاه سازیم. بدین منظور ، از متد prepareForSegue  ، مربوط به Master View Controller ، استفاده می کنیم ، تا خصیصه destintionViewController را تنظیم نماییم:

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    if ([[segue identifier] isEqualToString:@"showDetail"]) {
        
        NSIndexPath *indexPath = [self.tableView indexPathForSelectedRow];
        NSString *string = [feeds[indexPath.row] objectForKey: @"link"];
        [[segue destinationViewController] setUrl:string];
     
    }
}

مرحله قبل ، برای تغییر فایل APPDetailViewController.m می باشد. در این مثال ، Detail View Controller بسیار ساده است ، فقط نیاز داریم که متد viewDidLoad را مطابق کد زیر ، فراهم نماییم و مابقی متدها را حذف نماییم.

- (void)viewDidLoad {
    [super viewDidLoad];    
    NSURL *myURL = [NSURL URLWithString: [self.url stringByAddingPercentEscapesUsingEncoding:
                                          NSUTF8StringEncoding]];
    NSURLRequest *request = [NSURLRequest requestWithURL:myURL];
    [self.webView loadRequest:request];
}

این متد ، فقط از webView می خواهد که محتوای feed انتخاب شده را نمایش دهد. برای این منظور ابتدا ، یک NSURL با رشته ایی که داریم ، ایجاد می کنیم ، اما کاراکترهایی را که می توانند در URK با استفاده از گزینه stringByAddingPercentEscapesUsingEncoding ، مشکل ایجاد کنند رد می کنیم. سپس ، یک درخواست NSURLRequest ، برای دانلود صفحه وب از انباره ، ایجاد می کنیم.

اگر تمام مراحل را به درستی پیش رفته باشیم ، اکنون باید بتوانیم اپ RSS reader را در شبیه ساز ، کامپایل و اجرا نماییم.

امیدواریم از آموزش امروز ، لذت برده باشید. شما اکنون باید درک خوبی از اصول RSS fees با استفاده از NSURLRequest و NSXMLParser ، کسب نموده باشید.

در آموزش های بعدی ، موارد جذاب دیگری را آموزش خواهیم داد.