How do you setup in your application to show little bubbles with text and block the rest of the screen from being used and only allow a small section / button to be pressed. I am wanting to create a walkthrough to show users how to use the application and where to find things within the application when it is opened for the first time.
I would like to dim the rest of the application except for the part I want them to click on. Is there a framework already with these features?
There's no frameworks that provide this functionality, as far as I know.
One way you could do this though is to have a set of overlay images which you overlay over the whole screen the first time the user goes to that screen. To determine if the user has already been to a screen, I suggest you look at NSUserDefaults. To create the overlay images, I'd make the image the full size of the screen (i.e. 460x320 if you are showing the status bar) and then have transparent sections where you want to "see through" to the element below. Add a gesture recogniser to the overlaid image view to detect a tap and then hide the image and set the flag in NSUserDefaults to make it not happen the next time the user goes to that screen.
If you don't get a better answer, you could look at MAAttachedWindow on the page at this link. It's written for Cocoa, not Cocoa Touch, so you would have to convert it. I am considering doing this myself. You might find it to be worth the trouble, but I haven't looked at every detail, yet, so I couldn't say for sure. There are only tow files that are involved (.m and .h).
Related
I have seen some apps where when you launch them for the first time after downloading (e.g. Chrome app on iPhone), it shows you a list of animated gestures on the screen, kind of giving you a tour of the app.
How do I build one something like that? And how does the app know to launch only for the first time after download and not since then? For the second question, I am guessing a "shown=TRUE" value can be saved inside a PList file and checking the value each time when the app finished launching. But I am more curious about the mechanism involved in creating a guided app tour.
You can use transparent and semi-transparent images with a UIImageView, so you can make up an image with arrows and notes and put over the whole screen. You could fade it out when the user taps.
To know if it's the first time running the app, you should use NSUserDefaults instead of a plist; it's much easier, and you should be app to find a quick tutorial on that fairly easily.
Also, you could check around on this site for controls like this one. I haven't used any of them myself, so I'm not sure how much they differ from a regular UIImageView. They look nice though.
So, in an iPhone app I am working on, I've decided that the best way to display all the contents to the user is to have the top part of the screen show some information, and the bottom of the screen show different information. However, the bottom part will change sometimes, so I was working on implementing that.
Another app that does this is the MTGLife app, here are some pictures:
http://picasaweb.google.com/lh/photo/HILMaJPnbLxP6hQRkn_6XA?feat=directlink
http://picasaweb.google.com/lh/photo/d5wpS8x_aRyAEOBpYYIxwQ?feat=directlink
http://picasaweb.google.com/lh/photo/RW-BQfqx-VytRim3BxeRZQ?feat=directlink
You see that upon hitting a button, the picker switches over and displays the log. Hitting the same button switches them back, with a pretty animation. I would like to do the same thing in my application. I'm not sure the best way to go about it though...
I was thinking that I would make 2 UIViews, and then would simply flip between them, but I want to get some opinions first on how to do this, and then a push in the right direction.
Thank you!
The 2 UIViews is a good approach. By using the UIView animations functions, you can switch between the Log and the Picker with the desired transition.
In the UICatalog sample application (see TransitionViewController), there an example on how to animation two subviews
I'm self-learning iPhone development and I see that one of the aspects of an iPhone/iPad app is the start image that gets displayed when your app is run. I'd like my start image to display some basic info about the user when the app is launched, but that info has to first be collected by the user when the app is first run. That tells me that I either need to dynamically generate the start image after the user enters their information or I need to place a label of some sort on top of my static start image in order to accomplish this. The first time the app launched and before the user enters their info, the start image can be anything or nothing at all, I'm not concerned about this.
So, my questions are...
Can you place controls, like a label, on top of the start image when your app is launched?
If not, what's a good approach to dynamically generating the start image after the app is launched for the first time and the user info is collected?
If there's no way to change this start image (thanks kristopher!), can I instead display my dynamically generated image for a set amount of time (~3 seconds) as soon as the start image closes? Do I even have to use a start image at all?
Thanks so much in advance for your help! I'm going to begin researching this question right now.
To answer number 3, Yes, you need a start image. It should look like your dynamic start image but without the dynamic information.
To display the dynamic information briefly after launch, just use a modal view controller on top of whatever view controller comes up first (called viewController below):
SplashScreenController *splashScreen = [[SplashScreenController alloc] initWithNibName:#"SplashScreenController" bundle:nil];
[viewController presentModalViewController splashScreenController animated:NO];
[splashScreenController release];
[viewController performSelector:#selector(dismissModalViewControllerAnimated:) withObject:YES afterDelay:3];
Obviously you need to create a UIViewController subclass and xib file called SplashScreenController.
Apps can't change their start images. Those image files, as well as other files in the app's bundle, are treated as read-only by the OS.
If you don't have a startup image, then the user will just see a black screen for a second or two (or more, depending on how big your app is). It's a good idea to have a startup image.
You can display whatever you want after your app starts running.
I do something similar to what you are trying to accomplish, except I do not display user information. If you want to see what I did, check out my app How Long Can You Tap It (free). The Very first image, as Kristopher mentioned, is not changeable. It will be displayed for as long as the application takes to load. Then, the image will disappear and show your initial viewController, which will be whatever you want. In my app, it simply is the same image is the initial image, but instead of saying LOADING I display text telling you to Tap the screen to start playing. If you don't want to rely on the user to tap the screen to continue, you can do what Frank said and dismiss it within X number of seconds. If you want more code than what Frank provided, let us know.
When I've learned that I have to write some code to make the iphone keyboard go away. I was quite surprised. I was surprised even more when it become apperent that it is just the top of the iceberg.
What are the expected UI behaviors that aren't provided by system OOTB?
Is the list below complete?
The expected UI behaviors:
Focusing next text field when [done] is hit
Hiding the keyboard when background is hit
Using Touch Up Inside to fire a button action. (To give user opportunity to change his/her mind)
Supporting the screen rotation.
Some of that is silly, but some of it has uses as well.
Focusing next text field when [done] is hit
Which field is "next"? If you have a large form with fields both next to and above/below each other, next might not be so obvious. Even if they are in some linear layout, the iPhone would have to work to figure out which one is next. Do you want to wrap around at the end of the form, or dismiss the keyboard, or submit the form?
Hiding the keyboard when background is hit
I mostly agree with you here, though there are a few cases where this is useless. For example, adding a new phone number in the contact app.
Using Touch Up Inside to fire a button action
This one I really don't get. I can only guess that it's designed to allow you to use buttons instead of the touchesBegan/Moved/Ended methods. I guess it could be useful, but I've never used anything but Touch Up Inside.
Supporting the screen rotation
Many apps just don't work in any other orientation, such as games. If you want to use rotation, you only have to add two lines of code assuming you've done your layout well.
I hope this helps explain some of the strangeness. Aside from the keyboard dismissal, I've never really found anything too annoying. The one thing I wish they supported was using the highlight state of UIButtons for the set state. It would be a quick and easy toggle button, but I've taken to screenshotting a highlighted button and using that for the background image of a selected button.
Want a rounded rectangular button that isn't white? Since that one uses a background image, you can't just click something somewhere that makes it the color of your choice. You have to create your own image or you could even use CSS (WTF!?) to do it.
Unfortunately, the iPhone SDK lacks a lot of helpful things one would think would just be there. However, many people have taken the time to write wrappers for many of these kinds of things to help facilitate development - a quick google search into the functionality you are expecting may turn up a lot of useful answers!
For example, you could make the keyboard go away when you tap outside of it by creating a new view when it appears, and placing that view behind any user-interactable views on the screen. When that new view is tapped, it will become first responder and cause the keyboard to slide away (because the UITextField is no longer first responder).
Such a thing could be easily implemented as a drop-in fix for pretty much anything you'd need it for with very little code.
Still should have been included in the SDK in the first place, though!
I would like to take a stack of images (or potentially an array of URLs to download images) and display them in full screen, one at a time, using user swipes to smoothly animate the next image in the stack, using the iPhone SDK. Apple's Photo.app seems to do this. Additionally, if the image has not been retrieved yet, I'd like to display the progress indicator.
Can you point me to example code and explain how this technique would be implemented?
You need to use UIScrollview's page control mechanism. Apple has plenty of sample code, including one called, strangely enough, Page Control:
http://developer.apple.com/iphone/library/samplecode/PageControl/index.html
If you want any behavior beyond that, you'll have to roll it yourself.