|
17 February 2010
Posted in
Homegrown -
Philip Roy
Creating the "NZiPhone.com and NZMac.com News" app - Time to get started on what is probably the most enjoyable and productive part of the development process (other than the "wow" moment when I see my app in iTunes), the creation of the tabs and feeds within Xcode and within the TapLynx framework. This might look a little daunting, but the good news is that the TapLynx site and the TapLynx Google group has a lot of useful information and support....so let's get started!
Put it on my tab
Sorry, I couldn't resist that one. Tabs are the buttons that appear at the bottom of your iPhone application. You can have up to 5 on screen...or, if you have more than 5, the fifth button on the screen becomes "More..." and gives users access to the other options located in a new separate screen. This is what will happen with my app, which will have 8 tabs (see below why it is now 8 and not 9).
Some useful info on the TapLynx site related to this subject....
- Types of feeds or tabs you can have - http://developer.newsgator.com/wiki/index.php?title=Supported_content_types
- Some of the places you can get your feeds from - http://developer.newsgator.com/wiki/index.php?title=Where_to_get_RSS_content_from_your_favorite_sources
But perhaps the most important page for this first part of the process is...
- Beginning customisation - http://developer.newsgator.com/wiki/index.php?title=Beginning_Customization
Let's look at this page and start adding my very first tab...which is going to be a "News" tab that will have 2 sub-sections (I've learnt these are called "folders" for some reason) that will be the news feeds for NZMac.com and NZiPhone.com. So open up the Xcode project and look at the files. The really crucial one is the file "NGConfig.plist", which is really a preference file that contains a lot of information about the settings for the application. It appears that this file can actually be located on a server (meaning you wouldn't have to publish a new version of your app to iTunes every time you wanted to update things) which is very, very cool...but I'll look at doing this in a future version. In the meantime, double-click on the file as highlighted in the image below...

When the window loads with the information contained in that file, you'll see a huge list of things that can be altered. It's beyond the scope of this article (and indeed my intelligence) to explain what they all mean. In the meantime, the most crucial section is right at the bottom. Labelled "tabs", it has a wealth of information within it, so click the triangle next to it...

Again, it's going to take a lot of explaining about what you are seeing, and some of it I'm not too sure about (for example, I'm not sure why the term "Dictionary" is used)...but I have highlighted 3 things I want to look at.
(1) Item 0, 1 and 2 are in fact the sub sections that equate to the 3 tabs currently in this iPhone app. You can see the names that each tab has been assigned (2) and some other information, such as the image to be used with each tab. Then, quietly tucked away within a sub-section of these sub-sections (yes it does get a bit confusing) is a "Feeds" section (3). Here you will find the information about the feeds for that tab...

So below, you can see the information related to the first tab (Item 0, labelled "Brent") and I have now expanded the "Feeds" in the subsection here so you can see them. So we have a tab called "Brent" that uses a "tab_placeholder.png" file and pulls information from two feeds...

Start up the simulator and we can see how this looks in the app. See the first tab at the bottom called "Brent"? Click on it and it loads a page called "Brent" and the content from the two feeds...

So it's time to start changing things. In the image below, I have change the tab to be called "News". I have also told it to use one of the graphics that I added in to the project "tab-twg-news.png" and have replaced the two feeds with the NZMac.com and NZiPhone.com news feeds respectively...

Start the simulator up and look what has happened!! Now we have a cool tab icon, it's named "News" and the content you see is straight off my two sites...woohoo!

Tabs and folders
I've discovered that version 1.2 of TapLynx (the version I'm using as I write this) has the ability to display folders. Think of these as sub-sections of a tab. When I was previously going to have one "News" tab that first showed Mac news and then iPhone news (which was a bit messy) I can now have them as sub-sections of the news tab. This means I have decided to rearrange my tabs a little to put app reviews and listings into one tab...
- News
- NZMac.com - http://feeds.nzmac.com/nzmac-news/
- NZiPhone.com - http://feeds.nziphone.com/nziphone-news/
- Forum
- NZMac.com - http://feeds.nzmac.com/nzmac-forum/
- NZiPhone.com - http://feeds.nziphone.com/nziphone-forum/
- Apps
- NZiPhone.com Reviews - http://feeds.nziphone.com/nziphone-reviews
- NZiPhone.com listings - http://feeds.nziphone.com/nziphone-listings
- Podcast - http://feeds.nzmac.com/nzmac-podcast
- NZMac.com Blog - http://feeds.nzmac.com/nzmac-blog
- Video - The NZMac YouTube account - http://gdata.youtube.com/feeds/api/videos?author=nzmac
- Twitter
- NZMac.com twitter feed - http://search.twitter.com/search.atom?q=from%3Anzmac
- NZiPhone.com twitter feed - http://search.twitter.com/search.atom?q=from%3Anziphone
- About - This will be a static HTML page contained within the app
Back to the image above. There are things I need to look at later and fix...First, the colour...don't like that green. Next, feeds are being listed as posted in 1970 and I'm not sure why. One thing you can't really see is that the news is being listed as all NZMac.com news and then all NZiPhone.com. It's a bit cluttered, so I am going to separate the NZMac.com and NZiPhone.com news using the folders technique.
Take a look at the following image. It looks complicated and it is at first. I think I have done this the correct way, but basically I've created further depth to separate the two feeds into different folders. It kinda reads like this...(1) This is the first tab of my iPhone app and it is called (2) "News". Within that tab are two sub-sections (3) with one being called "NZMac.com" and one "NZiPhone.com". Within each of these sections is another (4) sub-section, and within those, separate feeds for a (5) NZMac.com news feed and (6) an NZiPhone.com news feed...

It is still pretty confusing and I hope that the video I make explains it better. In the meantime, how does what you see above work when you launch the app? Take a look at the image below...now when the app loads, the "News" section doesn't feature any news, but options to sub-sections (not sure I like the word "Folders" and I'm not sure I want that text visible) that you can select....

Select the "NZiPhone.com" option (for example) and it loads all the NZiPhone.com news!! Simple as that!

I'm not completely convinced at the time of writing that this is the approach that I want to take, but will stick with it at this stage. What I may decide to do later is blend the news feeds of the 2 sites into one feed and just list the latest news from both sites. Sadly Feedburner can't do this, so I have found that I would need to use Yahoo Pipes to merge two RSS feeds into one...but it is doable.
Time for a video
This section might seem really complex, but once you get into it, I find that it is quite easy. In the second and last video for these articles, I have completed the first part above and I am going to start work on the other tabs that you will see in my iPhone app...

| < Prev | Next > |
|---|




