iPhone transition effect to reveal an updated version of the same view - iphone

So I have an app on the main page is details of the current date.
The page has left and right buttons to move to previous and next dates and a table of info below. This all works.
However I want to add a swipe between the days, now doing the swipe control is easy and I have done that.
However I want to give the visual indication of a swipe.
I am not changes views , I am simply refreshing the current view.
If you look at myfitnesspal (free app) , that swipes between dates in the same way I am after.
It scrolls off (a copy?) of the screen to one side , slides in the latest version to replace it.
I am at a loss on how to achieve such a simple effect without going for multiple views which unless I am misunderstanding would be over complex.

Use a UIPageControl, here is a tutorial of how to implement one using only two views: Cocoa with Love UIPageControl sample
Both views can be identical, (instances of the same Class, created programmatically or 2 CustomView outlets on IB)
This way you only need to update the view that's going to slide in the screen.

Related

Is Selecting Multiple Items with a Two-Finger Pan Gesture only possible with UITableViewController?

I tried implementing the selecting multiple items with a two-finger pan gesture. However, the checkmarks didn't always appear and disappear when tapping edit to start the process, or tapping done when finished.
I later discovered that it works fine when using a UITableViewController after choosing the different controller from cocoa touch menu, instead of the UIViewController and UITableView I was using before.
So my question is: is it correct for me to now assume that these gestures when used in a table are really meant for a dedicated table view controller (with all the extra functionality you only get from it)?
Without any example code, I can't really see what might be going wrong. Have a look at the documentation to see if you are implementing it correctly.
https://developer.apple.com/documentation/uikit/uitableviewdelegate/selecting_multiple_items_with_a_two-finger_pan_gesture

How to build this screen in iOS?

I'm new to iOS development and am trying to build something like the screen below:
If I was doing it in Android, I can easily build the above UI in a few minutes. However, I don't know how to go about it with iOS.
I understand that the whole ViewController can be embedded in a navigation controller, which produces the title bar above. What about the bottom part though? I'm thinking of using something like a grouped UITableView but I'm not sure, since every cell will have very different contents:
A search bar, perhaps a subclassed UISearchBar, which I also don't know how to customize--the Search button at the right is required but isn't in the default UISearchBar. When the user taps on it, the UISearchBar must be translated to the navigation bar, no need to display a UITableView of suggested results. I don't know how to do that, too.
A button that, when tapped, flies in a modal from the bottom (I imagine it to be another ViewController with a grouped UITableView), to allow the user to choose from defined locations. Once selected, the modal closes and the button text is replaced with the selected location. This sounds much easier to do.
A header ("Item categories") and the list of categories, which may change in number. If the parent isn't a grouped UITableView, I think this part can be a UILabel and a non-scrolling UITableView with a height that changes depending on how many cells it has. If there are plenty table cells that don't fit given the screen's height, everything below the navigation bar can be scrolled vertically. That, I also don't know how to do.
If anyone can just guide me to what native iOS components I can use to build the above screen, and maybe a couple of tutorials to the things I just said I don't know how to do, I'd appreciate it.
You said it right .All the basic info you need is with you.
To build a searchbar like that i dont think you have to subclass it.
Bottom comprises of tableview.
Actually these Questions are seperately available in SO itself.So search seperately for your needs and you can achieve whatever you want
One basic principle : You cant achive anything by just thinking.Trying and get to it and if you have any issues look forward at it.All the issues will have an answer on the way.
Lots of components you need there.. Search Bar, UIPickerView and UITableView. I would like to give you some pointers.
1) You can refer http://www.appcoda.com/how-to-add-search-bar-uitableview/ for Search bar
2) When clicking on the Button, you can bring up a UIPickerView instead of another controller. For that you can refer http://www.techotopia.com/index.php/An_iOS_5_iPhone_UIPickerView_Example
3) You can use a normal Tableview with a single section, configure the section header to display Item categories.
You are asking too much to ask how to do every component of your UI. I will just answer a little.
Yes, a grouped table view is a good design. I am using a grouped table view for varying types of input. I have an actual table, with rows that can be added, and deleted, and contain an editable text area. Then I have three groups that only really show one piece of content each: two are sliders and one is a switch.
For choosing the location, pushing another view controller on your navigation stack would be the more typical way to handle it. You will save some effort that way, with some buttons and behaviors built in, but a modal view controller is not much harder. I'm not sure if you can make a navigation view fly in vertically, but does your app have to be frame-for-frame identical to the android version?

UITableview with UIPageControl?

I am in the making of a restaurant "step by step" ordering app, where I want to list the menu (appetizers, main course etc) in a tableview with the ability to organize the menu contents with a UIPagecontrol. Something similar to the eat24 app way of doing it or how the weather forecast app is constructed.
I already have the tableview set up, now I just need to implement this, which I hope you will help me with or guide me in the right direction, for me to accomplish this :). Would I need to setup a tableview for each of the categories or would it be possible to just update one tableview with the needed information, by swiping to the left or use arrows in a toolbar in the picture? What would the best way to add a toolbar like the one picture (white ring), using the storyboard -> resize tableview and drag the image in or to set it up programmatically?
Option 1 - Updating your tableView
You may update your dataSource so it reflects the state of the "new" tableView. Than you call reloadSections:withRowAnimation: by using UITableViewRowAnimationRight or UITableViewRowAnimationLeft, depending of whats fitting at the moment. This will feel like scrolling to a new tableView. For swiping you could use a UISwipeGestureRecognizer.
Option 2 - Using a scrollView with multiple tableViews
If you want it a little bit easier just setup three tableViews and throw them in a UIScrollView with paging enabled.
PageControl
Of course you need to add and setup a UIPageControl, if you want to show those dots.
Regarding the UI:
You can setup everything in your Storyboard. The background, the arrow buttons, the UIPageControl, you can even add the UISwipeGestureRecognizer within the Storyboard.

Can my custom tabbar be created like so for iPhone?

I have designed a custom tabbar and the developer says the design I created can't be done.
The screen is made up of a usual background with a tabbar. I'd like my tabbar to look a little different to the usual iPhone style. I would like at the bottom of the tabbar a grass illustration (transparent) and on top would sit all the separate buttons and on top of those would be the icons. All of these images (as seen in link below) are separate .png files.
When the user scrolls the content, it will scroll under the transparent grass. The buttons of course will be clickable and have a different view for an active state.
Please see the link below to see a mock-up of the image:
http://www.stuartkidd.com/dummy.jpg
I'd appreciate if the community could explain to me if this could be done and if so, how. I thought it would have something to do with 'creating a custom tabbar'.
And a further question, if it can be done, can also the tab buttons be horizontally
scrollable with a swipe action?
Thanks,
It all can be done but you are going against the Iphone UI guidelines. You won't be able to leverage the UITabbarView to do what you want so you'll basically have to write the whole thing from scratch. Your tab bar would be a scroll view with a row of buttons representing each tab. When a button is clicked you load in the appropriate view. The UITabBar controller gives you a lot of functionality for free and I suspect once you start working towards this you'll see exactly how much extra work this will end up costing you. Going against the way Apple does things can be a slippery slope.
Another idea might be to keep a hidden UITabBar to manage the tabs and call it from your custom tab bar. This would free you from a lot of the hassle of swapping views/controllers in and out.
You can create a row of custom buttons and have 2 subviews. One for the bottom navigation bar and one for the content view where you will be swapping your content based on what is pressed.
You can have a state which maintains what was clicked. Based on that you can set the button enabled state for every button in your bottom bar.
button.selected = YES
It will be easy to handle the touch up inside events and properly load appropriate views in and out of the bigger subview as they will be part of the same view controller.
I have implemented a similar functionality and it works well but still in process of submitting it to the app-store.

Nested UIScrollView-iPhone photos application

I have been facing the same nested UIScrollView problem for long time.I tried some open source codes like Scrolling madness ,three-20 and others but all fails finaly.I am trying to make a photo Viewer application same as iPhone.For that I have created the structure like this:-
1)one View controller.
2)on view of view controller one UIScrollView (i.e inner/parent scroll view) as a child.
3)on inner/parent scroll view number of child scroll views(i.e. outer/child scroll views) ,each represents one page of photos application.
4)On each scroll view one image View on which i am displaying my image.
So what I want is when user scrolls the outer scroll view it should scroll horizontally with all the child views so I will get the look and feel of paging in photos application.Also when user is on one specific image(i.e. child/outer scroll view) he should be able to zoom in/out,swipes and perform single/double tapping.I was able to make it work in sdk 2.1,but it dosnt work since sdk 3.0.Please tell me the idea behind your project.Means which scroll view you are subclassing ,in which view to detect touches.How this completely child - parent relation should be.
If possible provide any sample code also.
There is a WWDC session from 2010 that deals with this very issue.
Here's the short of it:
You need a single scroll view that is paginated and scrolls horizontally. Each "page" of that scroll view is another scroll view containing a photo.
First, it looks like you want to subclass UIScrollView? Every interaction method you need is provided for you in either the delegate callbacks or the touch methods. (Many of Apple's more advanced classes, such as UIScrollView, react poorly to subclassing.)
Second, it sounds like you have a first responder problem. IOW, your innermost scrollview isn't getting the first crack at the touch events.
Andrew
I also struggled with this for a long time trying samples you mentioned. I could finally figure it out with the samples provided by apple (iphone dev center).
http://developer.apple.com/iphone/library/samplecode/Scrolling/Introduction/Intro.html
http://developer.apple.com/iphone/library/samplecode/ScrollViewSuite/Introduction/Intro.html
The first one is pretty basic and probably what u already have. The second one is all about zooming, etc. Just study these and the samples you already have, I think you will be able to figure it out. On specific topics just come back here search for answers or post another question.
EDIT: I forgot this one check out these examples by Andrey Tarantsov hosted on github. This is what you want... http://github.com/andreyvit/ScrollingMadness