Hi this is Marin - the author of Touch Code Magazine, I hope you are enjoying my tutorials and articles. Also if you need a bright iPhone developer overseas contact me - I do contract work. Here's my LinkedIn profile
Tutorial: Building advanced RSS reader
NOTE: I have posted a newer version of this same tutorial, which makes use of blocks, attributed strings, and other iOS5 and iOS6 features.

If you want a more flexible and modern code have a look at the more recent version, which you can find here: http://www.touch-code-magazine.com/tutorial-building-advanced-rss-reader-with-ios6/

After getting the basic functionality up, let’s have a look how to refine the UI. The user experience is really important – in the end that’s what is going to make a user choose in between two applications with pretty much the same functionality.

Let’s the give the table view a nice header where we will also show the feed’s title. For the header I created this image (you will find it inside the demo application archive):

The table view provides the developer the possibility to set table header. We will create a custom class (a subclass of UIImageView) which will give you space to do further customization at will. Create a new class called TableHeaderView (choose you want it to subclass UIView in the new file dialogue)

We need the table header to show an image for the header background and provides means to set up the header text; thus make the new class to actually subclass UIImageView. You will need also a custom init method and a method to set the title text. Have a look at the interface file and update your source accordingly:

We will have a custom init method just for sake of showing also how to do that. Let’s have a look at the very simple implementation file:

That’s all we need from the table header class, so just head back to the RootViewController and update the source accordingly :

Initialize the table header inside viewDidLoad :

And update the header text when the RSSLoader fetches the RSS inside the updatedFeedTitle:

OK! Let’s fire up the application again and have a look if this time it looks nicer:

Yes, the table looks nicer, the subtle gradient looks great and the big RSS icon already gives the user a clear impression what the app is all about.

Let’s continue with the full preview of the articles. We are going to make use of the link attribute of the RSS items and in the DetailsViewController we will load up the link URL in a UIWebView. First double click on DetailsViewController.xib in XCode and arrange the view as show below – UIWebView taking all the space at the back and an UIActivityIndicator on the front centered in the screen. Make the UIActivityIndicator hidden, you will show it when the loading of the web page starts and hide it again when loading is finished.

Update the interface of DetailsViewController so that it conforms to UIWebViewDelegate protocol and lay down the outlets for the UI:

Connect in XCode the UIWebView and the UIActivityIndicator to the view controller – that concludes the UI setup.

Now on to the implementation. You will need to pass the RSS item from the RootViewController to the DetailsViewController by setting the item property (that you’ll do in a moment). For the moment assume the RSS item is set and create the viewDidLoad method:

When the view loads it will also start loading the page of the selected rss article. Add the following code to show/hide the activity indicator:

The only part left is to open the details viewcontroller when an item is selected from the table view in the root viewcontroller. There’s a small detail to look after since we have 2 table cells for each item – add this code back to the root viewcontroller:

This code creates a new instance of the DetailsViewController and sets the item property to the selected rss item, then pushes it to the navigationController stack:

That’s about everything – you have a full RSS reader application. You can download the source code of the demo project here and don’t forget to leave me your comments.

NOTE: I have posted a newer version of this same tutorial, which makes use of blocks, attributed strings, and other iOS5 and iOS6 features. If you want a more flexible and modern code have a look at the more recent version, which you can find here: http://www.touch-code-magazine.com/tutorial-building-advanced-rss-reader-with-ios6/
The post was originally published on the following URL: http://www.touch-code-magazine.com/tutorial-building-advanced-rss-reader/

 

  ·

 

Previous page of "Tutorial: Building advanced RSS reader"


Marin Todorov

is an independent iOS developer and publisher. He's got more than 18 years of experience in a dozen of languages and platforms. This is his writing project.
» Contact    » Add Marin on Google+

  1. Chuck on Tuesday 21, 2010

    Great article!, I also like you used GData I find it easier to use than NSXML in iOS.

  2. Marin on Tuesday 21, 2010

    Thanks Chuck, yes I’ve been looking into different benchmarks of XML parsing libraries and GData is not the fastest, but it’s a fine mesh of performance, lightness and ease of use. Thanks a lot for the comment

  3. [...] Tutorial: Building advanced RSS reader RSS Reader (Part 1): Getting started with iPhone Development RSS Reader (Part 2): Creating a new iPhone Xcode project and setting up your environment RSS Reader (Part 3): What we’ll be building and which iPhone SDK features will be covered? RSS Reader (Part 4): Setting up the UITabBar and UITableView with delegates [...]

  4. Robert on Tuesday 21, 2010

    Great article, was wondering where does the fetchRSS method go and how it relates to muti threading

    Cheers

  5. Marin on Tuesday 21, 2010

    Hi Robert,

    have a look at the method called “dispatchLoadingOperation” it creates a new thread using the selector fetchRSS (in the web site you need to scroll a bit horizontally to see the code)

    [[NSInvocationOperation alloc] initWithTarget:self selector:@selector(fetchRss) object:nil]

    this basically creates a new thread which when started will execute the fetchRss selector – have a look at the code of dispatchLoadingOperation it’s everything you need to spawn a new thread

  6. bob on Tuesday 21, 2010

    [doc autorelease];

    Why are you autoreleasing this? Why not just release it outright?

  7. Marin on Tuesday 21, 2010

    Hi Bob,

    good question – I honestly don’t see why it is autoreleased, I might’ve had this code elsewhere, where it made sense, but the way it’s now definitely an immediate release is better.
    Thanks for noticing!

    Marin

  8. Dave on Tuesday 21, 2010

    Hi Martin,

    Thanks for sharing, i’ve learnt a lot regarding threading from this. I’m new to objective-c so excuse me if im asking a silly question. I’m making some changes to this so that the data is stored to the DB and only runs fetchRss providing db is empty or lastUpdateTime > n hours.

    Ive hit a brick wall and im not sure how to go about solving it. You’ve set RootViewController to comply RSSLoaderDelegate protocol. I want to change it so the appDelegate deals with the fetching of the rss and storing to the db and my viewcontroller to read from the DB only. Im running into a heap of problems. Could please advise how is a sensible thing to do? if not, could you please steer me in the right direction?

    Thanks,

    Dave

  9. Marin on Tuesday 21, 2010

    hi dave i’m glad the tutorial was oh help to u :)
    first of all have a look what libraries there are for communicating with a database – the native c functions are a nightmare – i think there is one called fdbm which is quite easy to use if you know some sql.

    i’d say when fetching rss items store them in the database and then store the current time (using nsdate) into the user defaults. when you finish fetching and saving the items call perforomSelector withObject withDelay to set a timeout for the next fetch.

    in general maintainig an rss feed stored in a database is much more complicated task than just fetching the feed as in the tutorial. have a look for another good tut on how to deal with the db

    when im back from the road would be a good idea to do a tut on database interaction from obj ckeep an eye on my rss;)

  10. Colin on Tuesday 21, 2010

    Hi,

    I’m a newbie to iPad development and would like to transform this using a uisplitviewcontroller. I’ve tried to make this work but can’t really get it to go. Do have an example of how to do this?

  11. Marin on Tuesday 21, 2010

    Hi Colin,

    don’t have an example straight away, but it should be pretty straight forward to turn the tableviewcontroller to a uisplitviewcontroller solution, maybe just google for “uisplitviewcontroller tutorial” …

    best of luck, marin

  12. James on Tuesday 21, 2010

    hi everybody

    i have a question that i hope one of you would be able to answer.
    my question is How would i be able to add a reload or refresh button to this application to fetch new information.

    thanks James

  13. mark12 on Tuesday 21, 2010

    Hello!
    Thanks for the tutorial, I liked it a lot.
    But I have some problems. First of all I’m using a tab bar application. When I ran the app in ismulator and tap on a feed, it doesn’t open the webview(detailsview). If you cant tell me your iChat(aim) or anything else so we can talk it would be nice :))
    Thanks for your time!

  14. Marin on Tuesday 21, 2010

    Hey, glad you liked the RSS tutorial! Now – if when you implement it inside your own app going between view controllers doesn’t work it means you probably didn’t copy over the code correctly – the scope of the tutorial is anyways to show you fetching RSS feeds, not insights of building iPhone apps :) For more details on using navigation controller there’s a ton of other tuts out there: http://www.google.com/search?client=safari&rls=en&q=uinavigationcontroller+tutorial&ie=UTF-8&oe=UTF-8

  15. Kapalla on Tuesday 21, 2010

    Very good article!

    best regards from germany!

  16. Marin on Tuesday 21, 2010

    Moin moin :)

  17. nolan on Tuesday 21, 2010

    Hi

    great tutorial and app, I changed the rss feed to pull in a youtube feed of funny videos feed://gdata.youtube.com/feeds/base/videos?q=funny&client=ytapi-youtube-search&alt=rss&v=2

    It works fine but I want to be able to show the thumbnails in the tableview, is this possible to do in your app. One more question to have you modified this app for xcode 4.2 in regards to ARC?

  18. Marin on Tuesday 21, 2010

    hey nolan! 1) you’ll have to show the thumbnails yourself, this tutorial shows only fetching the RSS feed 2) you can disable ARC per file, have a look here how to: http://maniacdev.com/2012/01/easily-get-non-arc-enabled-open-source-libraries-working-in-arc-enabled-projects/ … best, Marin

  19. Ganesh on Tuesday 21, 2010

    I have an RSS link in which there are rss links to pages such as AFL,Football, Basketball,Cricket etc. When I click that the RSS links are obtained. For example in case of AFL the rss link directs to the page

    http://www.sportal.com.au/rss/australia/afl.xml

    Here there are tags called “description” but there is only a part of description inside that tag. The full description is present inside the link present inside the tag “link”. Here for example the link is

    http://www.sportal.com.au/afl-news-display/pies-duo-set-to-feature-160240

    How can I get these full description from the above link? I’m in such a urgency. Any help is appreciated.

    I have used the MWFeedParser. But still the problem exists. The problem is about the contents of parsing my friend. Inside the description tag there is no full description. Only part of it is given. But i need the full description. The full description is present inside the weblink inside the “link” tag. I need to get that data. How can i do that?

  20. Marin on Tuesday 21, 2010

    Hi Ganesh, you correctly figured out this is not an RSS issue. You’ll need to fetch the web page HTML code and then strip out the content that is interesting for you. Unfortunately there’s no simple way to do that. The webpage will contain more information which is not related to the post at all – like sidebar, menus, navigation, adverts, etc.

  21. Damien on Tuesday 21, 2010

    Hi!
    Thank you for this great tutorial. It is simple and great. I was wondering how to implement a pull down method to refresh the view. I found a method on waterworld.com blog. Here is the code to reload the page:

    -(void) pullDownToReloadActionFinished {
    // add one data on top
    [rssItems insertObject:[NSNumber numberWithInt: rand()] atIndex:0];
    [self.tableView insertRowsAtIndexPaths:[NSArray arrayWithObject: [NSIndexPath indexPathForRow:0 inSection:0]]
    withRowAnimation:UITableViewRowAnimationTop];
    [self.pullToReloadHeaderView setLastUpdatedDate: [NSDate date]];
    [self.pullToReloadHeaderView finishReloading:self.tableView animated:YES];
    }

    -(void) pullDownToReloadAction {
    // finish reload after three seconds
    [self performSelector:@selector(pullDownToReloadActionFinished) withObject:nil afterDelay: 3.0f];
    }

    But I can’t figure out how to just reload the rss feed! Can someone help me, please?
    Thank you

  22. John on Tuesday 21, 2010

    Love your tutorial. Can you help me implement a search bar for information displayed in the tables? I’ve now used this for one app and 3 unique RSS feeds – If we can get the search to work, I would love to make a donation…

    John

  23. Oliver on Tuesday 21, 2010

    You write :

    GDataXMLNode* title = [[[doc rootElement] nodesForXPath:@”channel/title” error:&error] objectAtIndex:0];

    –> So here, nodesForXPath is asusmed to return an array of nodes.

    NSArray* items = [[doc rootElement] nodesForXPath:@”channel/item” error:&error];
    for (GDataXMLElement* xmlItem in items) {
    [rssItems addObject: [self getItemFromXmlElement:xmlItem] ];
    }

    –> So here, nodesForXPath is asusmed to return an array of elements.

    As GDataXMLElement inherits GDataXMLNode, and nodesForXPath returns an array of GDataXMLNode, how can you just write the last statement assuming it’s an array of GDataXMLElement ?

  24. albin on Tuesday 21, 2010

    Hello,

    I tried your tutorial and when I ran it after doing all the steps the Simulator crashed. I don’t know where is the problem.

    Thank you

  25. Charles on Tuesday 21, 2010

    Hi there,

    Great work on this! I was wondering if you had figured out how to deal with the special characters issue. For example, instead of displaying a parenthesis like this ( it displays (&8220; Any way to display them correctly? Thanks so much!!

  26. Marin on Tuesday 21, 2010

    hey Charles, I don’t think I know of an Objective-C class that converts html entities into characters but I imagine that it should be too hard to write one. Try googling for Objective-c and html entities, there might be something already out there to help you out

  27. Charles on Tuesday 21, 2010

    Thanks so much for the response, Marin. I found this: http://stackoverflow.com/questions/1105169/html-character-decoding-in-objective-c-cocoa-touch but I am not sure how that is supposed to interact with GDATAXMLNODE…Any suggestions?

  28. Marin on Tuesday 21, 2010

    Hey Charles, you are totally on the right track – I think this is the class you need (I followed a link from the page you posted) : https://github.com/mwaterfall/MWFeedParser/blob/master/Classes/GTMNSString%2BHTML.h

    I am preparing a new RSS reader tutorial – one that makes use of all the iOS6 goodness, I’ll make use of this class as well in it.

    Cheers

  29. Brian B on Tuesday 21, 2010

    Hi Marin-

    Great tutorial. You did a good job explaining things.
    I’m trying to learn how to do something very similar for my work.
    I can’t tell by the dates if this tutorial is really from 2010?

    Would it be possible to update this tutorial or do a part 2 explaining how you could add thumbnails (ones that are included in the post).

    If not, is there a good way to render the web view with larger text?
    or does that have to do with the way the web page presents itself?

  30. Marin on Tuesday 21, 2010

    Hey Brian, yeah this is a relatively old tutorial – new one is in the works to match the new stuff in iOS6, but it won’t be out before the official launch of iOS6 because of the NDA. The text size – you should use CSS in your web page to make it bigger, or anything else related to the HTML itself.

  31. Arno on Tuesday 21, 2010

    Great tutorial, thanks! There is however one thing I can’t seem to get done: Import multiple RSS feeds. I’ve got a table now and would love to get a unique RSS feed in each section of the table, but no matter what I try, each section seems to repeat the first RSS feed.. Any chance you could help? Thank you very much!

  32. Marin on Tuesday 21, 2010

    Hi Arno, as I already mentioned via email – the updated RSS Tutorial is coming out till the end of September, so you’ll have much better and flexible code to use. Cheers, Marin

  33. [...] of the most popular articles on Touch Code Magazine is the complete example how to create an RSS reader app for the [...]

  34. rahim qamar on Tuesday 21, 2010

    The way u explain and develop is pretty good

  35. Osvaldo on Tuesday 21, 2010

    Hi,
    Is there a way when we do not have internet that it shows an alarm instead of closing the app?

  36. Marin on Tuesday 21, 2010

    Check out the “Reachability” class from Apple to check whether there’s connection or not :]

  37. Marco on Tuesday 21, 2010

    Hi Marin,

    your post has been here for some time but I just used your code and I’m having a little problem with my feed. Hope you can help.

    Trying to get a feed gtom Google (Blogger) and when I read it, the parse comes “dirty”.

    Like this…

    Hello,<br /><br />this is just to test the formatting of the blog. I hope I don’t see any weird characters when I try to parse this into a view.<br /><br />Thanks<br /><br />Johnny Test

    Any idea where I’m messing up.

    Oh, I’m using your code BTW.

    Thanks in advance