BASIC RSS READER IPHONE SDK TUTORIAL WITH DAPP

I’m going to show you how to quickly build a basic RSS Reader using Dapp. We will use Dapp to create and export the visual side of our code, after which we will be linking up our code with a custom RSS Reader class.

An RSS Feed is really just an XML Document. Apple provide us with an object called NSXMLParser that will fetch and handle the parsing for us. An XML document is a text document that encloses different types of data using tags. A quick example can be seen below:

<?xml version=”1.0″ encoding=”UTF-8″?>
<item>
<link>http://website.com</link>
<title>Post title</title>
<content>This is the content from a post</content>
</item>

Please follow the following video tutorial on how to build the UI in Dapp and then write the code for our basic RSS Reader.  To speed things up, we have included a reusable RSS Reader class for you to learn from and create additional RSS Feeds. A copy of this class is here – KFRSSFeed.

I recommend that you play the following video at full-screen, native resolution is 1024*768.  Also, please download a copy of the KFRSSFeed zip provided as this forms part of the tutorial.  The complete project is included at the end of this post.

<embed type=”application/x-shockwave-flash” width=”560″ height=”340″ src=”http://www.youtube.com/v/3yFf7odzQ4w&amp;hl=en_US&amp;fs=1&amp;rel=0″ allowscriptaccess=”always” allowfullscreen=”allowfullscreen”>

Project Files: Basic RSS Reader project files

16 thoughts on “BASIC RSS READER IPHONE SDK TUTORIAL WITH DAPP”

    • We are hard at work on improvements to Dapp and new products, and where we have time, we will continue to write tutorials.

  • Ok disregard all that. The problem was with my RSS feed. I changed the formatting and the problem went away.

    However, I have another question. Since the description under the DetailTetxt field can be somewhat long, how can I make it wrap around at the end of the first line like wordwrap?

    I’ve tried adding

    // Custom Feed Cell Code
    cell.textLabel.text = [[rssFeed.feedItems objectAtIndex:indexPath.row] title];
    cell.detailTextLabel.text = [[rssFeed.feedItems objectAtIndex:indexPath.row] description];
    cell.detailTextLabel.lineBreakMode = UILineBreakModeWordWrap;

    return cell;

    But that didn’t help. Is it because of the height of the rows? If so, is there a way to modify the height of the rows statically or dynamically when the rows get populated?

    Cheers!

    • Yes, and yes. 😉

      It is because of the height of the row and there is a way to dynamically change the height of rows.

      The standard way of doing this is by using the UITableViewDelegate method: tableView:heightForRowAtIndexPath:

      Here is something you could do to change the height of the cell when the detailTextLabel height is larger than the standard cell height (44), or whatever you may have set this to. Please note I haven’t tested this code, so you might need to correct bits and pieces, but the gist of it is here ;).

      – (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
      CGFloat cellHeight = 44;
      UITableViewCell *cell = [tableview cellForRowAtIndexPath:indexPath];
      CGSize boundingSize = CGSizeMake(cell.detailTextLabel.size.width, MAX_HEIGHT);
      CGSize requiredSize = [cell.detailTextLabel.text sizeWithFont:myFont
      constrainedToSize:boundingSize
      lineBreakMode:UILineBreakModeWordWrap];
      if (requiredSize.height > cellHeight) {
      cellHeight = requiredSize.height;
      }
      return cellHeight;
      }

  • Hi Cliff,

    Thank you very much for taking the time to respond.

    I’ve made the following modifications to the code you provided

    – (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    CGFloat cellHeight = 44;
    UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
    CGSize boundingSize = CGSizeMake(cell.detailTextLabel.frame.size.width, 44);
    CGSize requiredSize = [cell.detailTextLabel.text sizeWithFont:[UIFont fontWithName:@”Helvetica” size:17.0f]
    constrainedToSize:boundingSize
    lineBreakMode:UILineBreakModeWordWrap];
    if (requiredSize.height > cellHeight) {
    cellHeight = requiredSize.height;
    }
    return cellHeight;

    No errors in the Xcode and I was able to launch the Simulator on iOS 4.3 platform just fine. However when I tap the cell from the previous table to launch the table the populates the content of the RSS I get the error “Error parsing feed. Error code: 5″

    This error appears in the simulator and for whatever reason the Xcode.app crashes right after that so I can’t see the debug.

    I’ve done some googlefu but no success. Some people had similar errors but with different error codes for which their solutions didn’t apply to my mine.

    It seems that the error is related to the parser and from what I’ve read it could be related to the RSS encoding. My feed is using UTF-8 encoding per the XML/RSS standard so I don’t know what’s wrong or how to troubleshoot it.

    Have you come across this issue before? Any help is greatly appreciated.

    Cheers!

  • Hmm… tricky. Difficult to say without more information, error code 5 doesn’t tell much :(. All i was able to find online was that error code 5 might have something to do without contacting website.

    But, the first step would be to find out where and why Xcode is crashing. You’ll just have to place breakpoints and step through the code.

    By the way, do you have the latest version of Xcode?

  • Yup. I’m using Xcode 4.1.1 both at home and at work (I do some programming during my lunch break or downtime)

    It is really strange, at work I ran the same code and even thoug Xcode didn’t crash this time the app did but there was no debug output which left me puzzled. If I remove that piece of code everything works fine but then the cells won’t be the way I want.

    So I decided to simplify things and set the row height manually by using

    – (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath

    {

    return 55;

    }

    It’s not ideal but it will have to do for now.

    Since I’m still a n00b at Obj-C, your help (and app) were fundamental for me to advance in my project and to learn a lot about how apps get built.

    I really appreciate it.

    Cheers mate!

  • Really enjoyed the last few hours, created my first app in a few days after spending about 3 months trying on just xcode, i am having a few issues which I think many other will too.

    I am still unable to get the Cell Description to load onto multiple lines, multiline, cell height , is this even possible?

    1. How can we add an the Description from the XML – Just done this. Needed to use stripping to remove lots of crappy html from the description, but it works great.

    2. How can you Pass the Information to another Detail View instead of sending to broswer.

    3. My main question which would improve this quality tutorial is how do you add an image to each cell when the image link is loaded in already from the RSS XML?

    thanks.

  • Slight update to the last post, i got the multiline working and here is how.

    cell.detailTextLabel.lineBreakMode = UILineBreakModeWordWrap;
    cell.detailTextLabel.numberOfLines = 3;
    cell.detailTextLabel.font = [UIFont fontWithName:@”Helvetica” size:10.5];

    It seems you may need to tell it how many lines to draw.

    • 1. Great :).
      2. Lots of ways. Two ways are either creating a ‘method’ within the Detail View and passing the information across, or just use a property. Give us some more detail and I’ll help further.
      3. Not the simplest of operations.
      You can do it easily by:
      cell.imageView.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL URLWithString:MyURL]]];
      However… this is a big usability no no… as the user will just see a screen that seems to be ‘frozen’, until the image loads. You actually have to do it in a separate thread, so it can load the image in the background :S…
      Good little post that goes over the why and gives a link to a reference on how to do this:
      http://stackoverflow.com/questions/1760857/iphone-how-to-get-a-uiimage-from-a-url

  • I absolutely love this tutorial! Thanks!!!

    Is there anyway that after the user selects the item in the feed that they want to look at to have the website load in a UIWebView in the app instead of going to the iPhone’s browser?

    Thanks again

    • Yep.

      Create a new page with a UIWebView object. When the cell is ‘tapped’, call the new page (UIViewController) and pass over the website. Once the view is loaded, you can load up the address, for example:

      – (void)viewDidLoad {
      NSString *urlAddress = @”http://www.kerofrog.com.au”;

      //Create a URL object.
      NSURL *url = [NSURL URLWithString:urlAddress];

      //URL Requst Object
      NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];

      //Load the request in the UIWebView.
      [webView loadRequest:requestObj];
      }

  • Hi Cliff,

    It’s me again. 🙂

    I’m re-writing some parts of my app and I was wondering, is it possible to load this Table populated by an RSS Feed on a Utility app (aka Flipside view) ?

    How would you do load such table (with the RSS feed) using the Flipside view?

    I’ve tried it myself and all I get is a blank screen with or without a xib with a TableView once I click the button.

    Cheers

  • The core concept remains the same, a Flipside View is just a UIView and a UIView supports subviews, like a TableView which is just another form of UIView.

    Most likely the problem is in retrieving the RSS feed data. What is being returned when the Flipside view tries to fetch the RSS Feed?

  • Hi Cliff,

    I think this is an amazing app and it has really helped me with my programming. I watched your video and did everything you said (I did it with SDK iOS 5) and I am trying to have a Youtube RSS feed in my app and whenever I put in the RSS Feed URL and my Channel Page I am getting “Parsing Error : Error 5″ and “Parsing Error : Error 23″ Do you know what this means and how I can fix it?

    Thanks,

    James.

    • :(! Oops, sorry James. Missed this comment.

      Send us through a copy of your code at cliff@kerofrog.com.au and I’ll have a look at this.

      Unfortunately its not something I can fix for you without looking at code :).

Leave a Reply

Your email address will not be published. Required fields are marked *