Implement Each Tabbar With Webview Videoplay And Soundplay In iPhone

In this application we will see how to to create a tab bar application with webview,Videoplay and soundplay  in each of the tab bar.

Step 1: Create a TabBar Application using template. Give the application name “TabBarWebView”.

Step 2: Xcode automatically creates the directory structure and adds essential frameworks to it. You can explore the directory structure to check out the content of the directory.

Step 3: We’ll add UIViewController class to the project.Choose New file -> Select cocoa touch classes group and then select UIViewController subclass. Give the name “VideoPlayViewController”, do it once more time, save it into “AudioPlayViewController” and make the corresponding .xib file.

Step 4: First tab of the tabbar we will display webview so let see how to do this, in the FirstViewController.h we have added UIWebView for displaying the webview, make the following changes in the header file.

 

 

 

Step 5: Now double click your MainWindow.xib file open it to the Interface Builder. Open the Tab Bar Controller view, you will see there are two tabs, now drag the Tab Bar Item from the library and place it below of the Tab Bar Controller. Change the each of the TabBar name to the WebPage, VideoPlay and AudioPlay(See the figure below). Select the WebPage from the tab bar  and bring up Attributes Inspector and change the class name into FirstViewController then drag the web view from the library and place it to the view window. Now select the WebPage from the tab bar and bring up connection inspector drag webDisplay to the Web View.

Step 6: Make the changes in the FirstViewController.m file.

 

 

 

Step 7: We implemented in the VideoPlayViewController.h file MPMoviePlayerController for the video playing, and NSURL for loaded the video for the second tab bar (Videoplay) .make the following changes in the VideoPlayViewController.h file.

 

 

 

Step 8: Double click your MainWindow.xib file and open it to the Interface Builder. Select the VideoPlay from the tab bar and bring up Identity Inspector change the class name into the VideoPlayViewController. Save the MainWindow.xib file and go back to the Xcode.

Step 9: For the videoplay we need to add framework, select frameworks -> Add -> Existing framework -> Framework -> MediaPlayer.framework. Add the video file in the Resource folder.

Step 10: Make the following changes in the VideoPlayViewController.m file.

 

 

 

Step 11: In the AudioPlayViewController.h file we have added AVAudioPlayer class is used  for play sound in any audio format in available iPhone OS .Use a delegate to handle interruptions and to update the user interface when a sound has finished playing. So make the following changes in the file.

 

 

 

Step 12: For the AudioPlay we need to add frameworks. Select Framework -> Add -> Existing folder -> framework -> select AudioToolBox.framework and AVFoundation.framework. And add the the sound file in the Resource folder.

Step 13: Double click your AudioPlayViewController.xib file and open it to the Interface Builder. Open the View window, drag the Round Rect from the library and place it to the view window. Double click the Round Rect and give the name “PlayMusic”. Select File’s Owner icon and bring up Identity Inspector , change the class name into the AudioPlayViewController.Now select the Round Rect and bring up Connection Inspector drag from the TouchUp Inside to the File’s Owner icon and select playSound method. Save the AudioPlayViewController.xib file and go back to the Xcode.

Step 14: Make the following changes in the AudioPlayViewController.m file for the playing the audio file.

 

 

 

Step 15: Now compile and run the application.

You can downloaded SourceCode from here TabBar WebView