Tabbar & Flipside together?

Discussion in 'iOS Programming' started by Eagle101, Jan 15, 2010.

  1. Eagle101 macrumors newbie

    Joined:
    Nov 19, 2007
    #1
    Guys,

    in Xcode, when i create a new project, I can either choose Tabbar app or Utility bar...but how do I get both of them together in my app? I started with the utility app (flipside view) and then tried to add the tabbar manually, but no luck.

    Please someone help.

    Thanks
     
  2. iLoveDeveloping macrumors regular

    Joined:
    Sep 24, 2009
    Location:
    Ireland
    #2
    What hasn't worked exactly? Do you have code?? Hard to tell you what the problem is if we have no idea what your doing wrong........
     
  3. dejo Moderator

    dejo

    Staff Member

    Joined:
    Sep 2, 2004
    Location:
    The Centennial State
    #3
    That's probably a good start.

    You'll probably want to be adding a Tab Bar Controller as well. But first, we need more details on what you mean by "tried to add the tabbar manually". Are we talking Interface Builder or programmatically?
     
  4. Eagle101 thread starter macrumors newbie

    Joined:
    Nov 19, 2007
    #4
    Sorry for not explaining...

    I did add the Tab Bar Controller but I fail to link them correctly so it doesnt work. And I am doing all this using Interface Builder. All I want is a tab bar at the bottom and the flip side (the little i) thats it then I will take it from there...

    Any help is greatly appreciated...

    Thanks everyone
     
  5. johnnyjibbs macrumors 68030

    johnnyjibbs

    Joined:
    Sep 18, 2003
    Location:
    London, UK
    #5
    With iPhone OS 3+ it has become much easier to implement flipside views. You can now make any modal view a 'flipside' view.

    I would start the project as a tab controller project because it's quite fiddly to add them otherwise. Then, add and configure your info button and program it so that it adds a modal view controller to the current view when you tap it, that will display the contents of the flipside view.

    Make sure when adding the modal view you set the modalTransitionStyle to UIModalTransitionStyleFlipHorizontal (or something like that!). Then present the view as normal.

    e.g.

    Code:
    - (IBAction)infoButtonWasPressed:(id)sender {
        // Display modal info view as flipside view
        FlipsideViewController *fvc = [[FlipsideViewController alloc] initWithNibName:@"blah blah"];
        fvc.modalTransitionStyle = UIModalTransitionStyleFlipHorizontal;
        [self presentModalViewController:fvc animated:YES];
        [fvc release];
    }
    
    Voila.
     
  6. Eagle101 thread starter macrumors newbie

    Joined:
    Nov 19, 2007
    #6

    Mannn I am sooo lost. I have a sample tabbar app, can I send it to you and if you could add the flipside view to it which should be very simple so that I could study it on my own and learn from it. I would really really appreciate it.

    Thanks
     
  7. johnnyjibbs macrumors 68030

    johnnyjibbs

    Joined:
    Sep 18, 2003
    Location:
    London, UK
    #7
    Hi Eagle101,

    It's best that you do it yourself so that you learn what you are doing. It is very simple to attach the modal view but if you are struggling I suggest reading up on the Apple documentation, particularly around view controllers, which is an integral part of iPhone development. Or maybe start with a simpler project first.

    However, I can lead you through it in rough steps below.

    1) Set up your tab controller project (I think you've done this).

    2) Create a new file in Xcode that will be your flipside view controller. Ensure you create both .m and .h header files and you will probably want to have an interface builder nib file - tick the relevant option. Select the view controller template. You should call it InfoViewController or FlipsideViewController or something like that. This will act as the view or screen that the user sees when the info button is pressed and the view flips. You can leave it blank and implement the details on this screen later if you wish.

    3) Now you need to bring up that view when the info button is pressed. In the first view controller (probably called RootViewController or FirstViewController) you need to create an info button (or whatever control that will be used to access the flip view).

    You can add the info button as a button on the navigation bar or else anywhere you see fit on that view (screen). You can do it programmatically or drag a button or bar button item in Interface Builder. You will need to insert the method that I put in my previous post into this view controller.m file. This will be called when the user taps the button. (To implement in Interface Builder, control click the button and drag it to the File Owner, then release - then select the infoButtonWasPressed option to set up the link). To set up the link programmatically you need to put the following line of code after you have set up the button:
    Code:
    [infoButton addTarget:self action:@selector(infoButtonWasPressed:) forEvent:UIControlEventTouchUpInside];
    
    The above code tells the program to access the method infoButtonWasPressed in the current view controller (self) when the user touches and releases the button. infoButton is a pointer to the button object that you may have just initialised or stored as an instance variable from having set it up in Interface Builder.

    4) That's it. Now, when the user presses the info button, it should call the infoButtonWasPressed method in my previous post and display the flipside view (make sure the filename you call is the same as the file you created in step 2). Make sure you included the -(IBAction) part of the method if you configured it in Interface Builder - otherwise it will not have shown up as an option.

    Hope that helps! Post here again if you're having problems, but I suggest that if you are struggling you work through some of the examples and try something simpler first!!
     
  8. Eagle101 thread starter macrumors newbie

    Joined:
    Nov 19, 2007
    #8
    JohnnyJibs,

    First, I would like to say Thanks from the bottom of my heart. You have no idea how much I appreciate your help!

    Second, I am still unclear on few steps...The reason why I told you if I could send you the sample code so you could add the flipside view was not so it would be easy for me, but just so I could go back and study what you did (study it day and night)...

    Anyways, this is where I am not clear:::

    Step 1: is clear. I already have my tabbar app done.
    Step 2: Ok I went to new file and "UIViewController Subclass" which I also checked the "With .XIB interface" and now i have FlipsideController.m and FlipsideController.h and FlipsideController.xib
    Step 3: I dont understand where do I need to create this button. Whenever I launch my .xib file and want to create one, I do create it, but when I try to link the button with the File Owner it just wont link. It wont accept the link. Also there is nothing like "infoButtonWasPressed".

    So I did insert the old code that you provided into viewcontroller. But I am clueless on where do I need to insert that new code into?

    Anyways I am very confused and hopefully you can help me. I will really appreciate all your help. I promise.

    I have attached my XCode project.

    Thank You so much!!!
     

    Attached Files:

  9. johnnyjibbs macrumors 68030

    johnnyjibbs

    Joined:
    Sep 18, 2003
    Location:
    London, UK
    #9
    Eagle101:

    I'm not at my Mac right now so I can't look at your files - but I will explain things a little bit more below.

    The -(IBAction)infoButtonWasPressed code is a method. These are analogous to procedures and functions. i.e. it is a block of code that will be executed whenever that method is called.

    You need to insert the following code into FirstViewController.m. Put it anywhere after the @implementation where all the other methods are. The -(void)dealloc and -(void)viewDidLoad blocks are all methods so make sure you don't insert it in the middle of these. Each method code block sits between the two sets of {} brackets:
    Code:
    - (IBAction)infoButtonWasPressed:(id)sender {
        // Display modal info view as flipside view
        FlipsideViewController *fvc = [[FlipsideViewController alloc] initWithNibName:@"blah blah"];
        fvc.modalTransitionStyle = UIModalTransitionStyleFlipHorizontal;
        [self presentModalViewController:fvc animated:YES];
        [fvc release];
    }
    
    Now let's go through the above code. The -(IBAction) part of the method tells Xcode that the method should be seen by Interface Builder and as the name implies it is an Interface Builder 'action' (hence IBAction). The name of the method is infoButtonWasPressed and it takes one parameter: sender (of type object id). Now you don't strictly need the : (id)sender parameter but it gives us the option of finding out which button was pressed if we so wish - so it passes our method some extra info if we might need it (in this case we don't).

    Now the code that runs in that method is enclosed in the {} brackets, with the final } closing off the method. That means that when this method is called, the code inbetween the brackets will be run.

    Now let's see what that does. Firstly, we initialise our flipside view controller object (the one you created as a view controller file). We call our instance of that class by an alias name - fvc. The * before it tells Xcode we are dealing with a pointer to that object. Now, we can refer to that particular object by that name anywhere in this method only. Note the init statement also tells it to load your nib file for the flipside view controller (the nib is the Interface Builder file). Next, we set the flipside view controller's modalTransitionStyle property so that it flips into view rather than the default slide in from the bottom. Then the next line actually tells the current view controller to present this view (as a modal view) with animation. The self in this case refers to the current view controller object. Finally, for good memory management, and so we don't leak memory, we have to release the fvc object. We do this because we sent it an init/alloc statement. There's a good Apple guide on memory management if you don't understand this.

    Now, before we can use the method, we also need to declare it in the header file - i.e. FirstViewController.h. After the {} and before the @end, you need to insert the following line of code:
    Code:
    -(IBAction)infoButtonWasPressed:(id)sender;
    Note that the line exactly mirrors the name of the method in the .m implementation file (but without the {} brackets). It is a line of code so we need to put the ; at the end to signify it is the end of the line.

    You should save both files and then it should show up in Interface Builder in the FirstViewController.xib nib. This is the nib where you should put your info button. When you control drag from the button to the File Owner, the infoButtonWasPressed button pop-up should show up so that you can connect it.

    What this does is a shortcut for you that tells Xcode to run your method whenver that button is pressed. Now it should work.
     
  10. Eagle101 thread starter macrumors newbie

    Joined:
    Nov 19, 2007
    #10
    Again, Thank you so much for all your help man. I really appreciate it and I cannot thank you enough. Thanks!

    This time, It was more clearer and I almost got there...here are some questions:

    I attached a picture so you can see my working TabBar project and the files in it (its a zip file because macrumors wont let me attach .tiff pictures).

    I have also attached the project if you are close to a Mac to give it a try and see what I am talking about!

    1.) As you can see in my files, I have MainWindow.xib which shows how the main view will look like. Somehow I do not have an .m & .h file for it.
    2.) This time everything worked good, I even got the showinfobutton when I linked the button to the file owner, but when I run it, I do not see the button??? I think its because you told me to create the button in the FirstViewController but I think the button has to be created in the MainWindow.xib (which I tried but there is no showinfobutton when I try to link the button to the file owner).
    3. At the end it gives me an error "error: request for member 'modalTransitionStyle' in something not a structure or union - did not match any documents."
    4. I think instead of pasting those codes in the FirstViewController, I think I have to paste them in the TabFinalAppDelegate? I am just guessing!

    Like I said now I am very close getting it finished, just these things are confusing me alot. Thank alot for any help man. I really really appreciate all your help!
     

    Attached Files:

  11. ethical macrumors 68000

    Joined:
    Dec 22, 2007
    #11
    To be honest mate, I think you just need to go and read read read. It's all well and good being given step-by-step instructions, but it's not going to help you in the long run. You need to be understanding why you add particular lines of code, and to what files, instead of guessing, otherwise you'll never be able to write your own application on your own.

    Check out Steve Kochan's book on Objective-C, and Apple's documentation once you've grasped it a bit. That's what I'm doing and it's going pretty well. Good luck.
     
  12. Eagle101 thread starter macrumors newbie

    Joined:
    Nov 19, 2007
    #12
    You are so right! Thanks alot for all your recommendations. However, I did read alot of books and docs, but you really dont learn significant stuff until you do it yourself and learn as you go. And this is what I am doing. Probably, i have learned more from this project, than I learned from some bookd I read before!

    Thanks again
     
  13. johnnyjibbs macrumors 68030

    johnnyjibbs

    Joined:
    Sep 18, 2003
    Location:
    London, UK
    #13
    Eagle101: I was away for the weekend. Have you managed to fix it? I'll try to see where you're going wrong tonight but remember that patience and practice and lots of reading is key! It takes time to learn programming and to perfect app creation. And remember that most people don't make much money from the app store!
     
  14. Eagle101 thread starter macrumors newbie

    Joined:
    Nov 19, 2007
    #14
    Johnnyjibbs:

    I hope you had a great weekend. I have been working at it, but still I cannot fix it. I think there is something tricky that I am doing wrong that its keeping it from working. I have read so many documentations and books but I am truly stuck in this place. I hope you can take a look tonight and tell me where the problem is and what I was doing right. I would really appreciate it!

    Here is the updated code, so take a look at this attached code.

    Thanks
     

    Attached Files:

  15. johnnyjibbs macrumors 68030

    johnnyjibbs

    Joined:
    Sep 18, 2003
    Location:
    London, UK
    #15
    Eagle 101: I've reattached a modified version of your project! I tidied the folders a little and added the button to the first view controller.

    This is roughly what I did:

    1) Deleted the placeholder in the Main window nib file and told the tab controller to use the FirstView.xib as the first view controller nib.

    2) In the FirstView.xib where I created the button and label, hooked them up to the action method and told Interface Builder that the File's Owner was FirstViewController (to do this, click the File's Owner icon, then in the info pane of the info palette, type FirstViewController in the box. I also connected the FirstViewController's view property to the view by control clicking the File's Owner in Interface Builder and dropping it on the View icon. You have to do this with each xib nib file.

    3) Added the navigation bar and done button (BarButtonItem) in the FlipViewController nib file in Interface Builder. You can customise buttons and things using the info palette (for instance, changing its type to a Done button). Then I created the - (IBAction)doneButtonWasPressed method in the FlipsideViewController.m file and hooked them up to the button, as we did for the other button. In this method I tell the FlipsideViewController to dismiss itself so that when the user presses the Done button, it flips out of view and shows the FirstViewController again.

    That's it. It takes a bit of getting used to but you have to make sure that everything is named correctly and hooked up in Interface Builder for these things to work. I think you sort of got the idea with the third item that you added to the tab, although it's best to create a new file (with .h, .m and .xib files) for each new view controller, then hook them up. I noticed you didn't name your 3rd nib and it has no corresponding view controller file.

    Hope this helps. Keep reading the View Controllers documentation to get an idea of where to go from here and eventually all these things will become second nature!!!
     

    Attached Files:

  16. Eagle101 thread starter macrumors newbie

    Joined:
    Nov 19, 2007
    #16
    hello

    JohnnyJibbs,

    Thank you very much for all the help. I really appreciate all the effort and time that you have put on helping me. I know I was little confused and lost, but now I totally understand things more better than I did before - and all because of you - so thank you so much for everything.

    God Bless

    -Eagle101
     
  17. bhaveshpatel macrumors newbie

    Joined:
    Feb 10, 2010
    #17
    Please help

    here i found code for add utility view inside tabbar view. but i want to add tabbar view in flipview of utiltity view please give me a tips or sample code for that...thanks in advance..
     

Share This Page