iOS Programming 101: Simple Animation Using UIImageView

March 31, 2013 By 8 Comments

As you may know, we have released our first iOS game on App Store. Honestly, we do not have any game development experience. As we always said, “getting your hands dirty is the best way to learn programming”.

We started out by developing a simple memory game. We’re sure that it won’t be a big hit. However, it’s a great learning experience even the game do not generate good money. In coming tutorials, we’ll share with you some of the implementation techniques such as game center integration, in-app purchase implementation, Nextpeer integration for multiplayer support, etc. To start off, let’s see how you can use UIImageView to implement simple animation.

simple animation
[Read more...]

Filed Under: iOS Programming 101, Tutorials Tagged With: , ,

Create Static Table View Using Storyboard

March 20, 2013 By 8 Comments

After we published the iCloud programming tutorial, the first question from our readers is not about iCloud but related to the static table view. If you’ve followed our tutorials, you should have a basic understanding about table view. However, the table views that we’ve covered are of dynamic content. The “Add Note” controller that we built in the previous tutorial, on the other hand, makes use of the static table view. If you have problem with static table view, this tutorial is for you. We’ll show you how to create static table view using Storyboard.

To illustrate how easy you can use Storyboard to implement static table view, we’ll build a simple Setting screen. Static table views are ideal in situations where a pre-defined number of data items to be displayed. A setting screen is an obvious use of static table view.

Static Table View Demo App
[Read more...]

Filed Under: Course, Tutorials Tagged With: , , ,

iOS Programming 101: Record and Play Audio using AVFoundation Framework

February 27, 2013 By 9 Comments

Editor’s note: Some of you asked us to write a tutorial about audio recording. This week, we work with Yiqi Shi and Raymond from Purple Development to give you an introduction of AVFoundation framework. Yiqi and Raymond are independent iOS developers and have recently released Voice Memo Wifi that allows users to record voice memo and share it over WiFi.

iOS provides various framework to let you work with sound in your app. One of the frameworks that you can use to play and record audio file is the AV Foundation Framework. In this tutorial, I’ll walk you through the basics of the framework and show you how to manage audio playback, as well as, recording.

To provide you with a working example, I’ll build a simple audio app that allows users to record and play audio. Our primary focus is to demonstrate the AV Foundation framework so the user interface of the app is very simple.

The AV Foundation provides easy ways to deal with audio. In this tutorial, we mainly deal with these two classes:

  • AVAudioPlayer – think of it as an audio player for playing sound files. By using the player, you can play sounds of any duration and in any audio format available in iOS.
  • AVAudioRecorder – an audio recorder for recording audio

[Read more...]

Filed Under: iOS Programming 101 Tagged With: , , ,

Handling Single and Multiple Selection in Collection View

February 18, 2013 By 9 Comments

In the past two tutorials, we covered the basics of UICollectionView and header/footer customization. You should already know how to display items using UICollectionView. However, we haven’t covered how to interact with the collection view cell.

As mentioned before, the Collection View works in a way pretty much like Table View. But to give you a better idea, we’ll show how to interact with the collection items such as the ways to handle single and multiple item selection. To provide you with a working example of how the item selection works, we’ll continue to improve the Recipe app. Here are what we’re going to implement:

  1. To demonstrate how you can handle single selection, we’ll improve the Recipe app. When user taps a recipe photo, the app will bring up a modal view and display the photo in larger size.
  2. We’ll also implement Facebook sharing in the app in order to show you multiple item selection. Users are allowed to select multiple photos and share them on Facebook.

Recipe App Multiple Selection

The interface of the app is very simple and will not win any design award. However, it’ll give you an idea of how to interact with collection view. To spare you from setting up the Xcode project, you can download this Xcode template. Please note that the Xcode project is created using Xcode 4.6 and tested on iOS 6. If you find any problem opening/compiling the project, please upgrade your Xcode to the latest version.
[Read more...]

Filed Under: Course, Tutorials Tagged With: , , , ,

How to Add Header and Footer View in UICollectionView

January 24, 2013 By 8 Comments

Previously, we covered the basics of UICollectionView and showed you how to present items in grid layout. It’ll be interesting to spilt recipes into different sections. Let’s say, the first section contains recipes for lunch/dinner, while the other section contains recipes for drinks and desserts.

As you’ve learnt, every collection view must have a data source object providing it with content to display. Its responsibility is to provide the collection views with the following:

  • The number of sections in the collection view
  • The number of items in each section
  • The cell view for a particular data item

Obviously, the simple Recipe app we developed in the previous tutorial contains one section only. In this tutorial, we’ll continue to explore collection view and show you how to group the items into different sections. You’ll also learn how to add header or footer view to the collection view.
[Read more...]

Filed Under: Course, Tutorials Tagged With: , , ,

Create Grid Layout Using UICollectionView in iOS 6

January 12, 2013 By 26 Comments

Do you still remember the Recipe app that we have worked on several months ago? At that time, we showed you how to display a list of recipes using UITableView. Wouldn’t be great if it can display the recipe in a nice grid view?

The iOS 6 SDK introduces a new class called UICollectionView that allows developers to create grid-like layout out of the box.

If you have no idea about grid-like layout, just take a look at the built-in Photos app. The app presents your photos in grid format. In the pre-iOS 6 world, you have to write lots of code or make use of other libraries in order to build a similar layout. The UICollectionView, in my opinion, is the most spectacular API in iOS 6. Not only it simplifies the way to arrange visual elements in grid layout, it even lets developers customize the layout (e.g. circular, cover flow style layout) without changing the data.

Grid based Photo App

In this tutorial, we will build a simple app to display a collection of recipe photos in grid layout. Here are what you’re going to learn:

  1. Introduction to UICollectionView
  2. How to Use UICollectionView to build a simple Grid-based layout
  3. Customizing the Collection Cell Background

[Read more...]

Filed Under: Course, Tutorials Tagged With: , , , ,

iOS Programming 101: Customize UITableView and UITableViewCell Background using Storyboard

January 6, 2013 By 25 Comments

In the last tutorial of our iOS Programming 101 series, we showed you how to customize the navigation bar and buttons with your own background image. This time, we’ll look into the customization and styling of UITableView and UITableViewCell.

If you’ve followed our iOS tutorials from the very beginning, you know we’ve written a tutorial about customizing table view cell using Interface Builder. In this tutorial, we’ll do something different. Instead of using Interface Builder to tweak the UITableViewCell, we’ll show you how to use Storyboards to style the cell. Storyboards make customizing table cells much easier with the introduction of prototype cell. In brief, you’ll learn the following stuffs in this tutorial:

  1. Customizing UITableViewCell using Storyboard
  2. Style UITableViewCell and UITableView with your own background images

[Read more...]

Filed Under: iOS Programming 101, Tutorials Tagged With: , , ,

iOS Programming 101: How to Customize Navigation Bar and Back Button

December 29, 2012 By 15 Comments

Previously, in our iOS Programming 101 series, we showed you how to customize the appearance of the Tab Bar. In this tutorial, we’ll continue to talk about UI customization and cover how to use Appearance API to make the Navigation Bar more beautiful.

Here are what you’ll learn in this tutorial:

  1. Customizing the View with background image
  2. Customizing UINavigationBar including background image and text style of title
  3. Customizing the appearance of UIBarButtonItem

As usual, we’re going to illustrate the concept by converting a plain navigation bar to one with customized graphics. However, to help you focus on learning the customization, we’ve prepared the Xcode project for you to start with. Before proceeding, first download the Xcode project here (note: the project is created using Xcode 4.5).

If you build and run the project, you’ll get an app with simple navigation UI. Now we’ll work together to style the navigation bar, customize the bar buttons and assign our own background image for the view.
[Read more...]

Filed Under: iOS Programming 101 Tagged With: , , , ,

Core Data Part 2: Update, Delete Managed Objects and View Raw SQL Statement

December 23, 2012 By 26 Comments

This is the second article for our Core Data series. Previously, we gave you a brief introduction of Core Data and created a simple app to store all your device information. However, we only showed you how to insert records into data store through Core Data API and left out the update & delete operations.

In this tutorial, we’ll continue to work on the app and focus on the following areas of Core Data:

  • Updating or deleting an object using Core Data API
  • Viewing the raw SQL statement for debugging purpose

[Read more...]

Filed Under: Course Tagged With: , , ,

iOS Programming 101: How To Customize Tab Bar Background and Appearance

December 2, 2012 By 11 Comments

With over 700,000 apps in App Store, your app must have a great design to stand out from others. If your app is still using the default design, you better give it a tweak and make it look better. I’m sure it’ll improve your app sales and attract more downloads.

When you check out any popular app, you’ll notice a custom design tab bar. Some readers asked how we can change the appearance of the tab bar. In this tutorial, we’ll show you how to do that. With the introduction of Appearance API in iOS 5, it’s much easier to custom the UI controls that gives your app a unique look and feel.

[Read more...]

Filed Under: iOS Programming 101 Tagged With: , , , , , ,
« Older Posts