No need to say I'm an absolute beginner in Xcode, after you read my question:
In my app I'm putting together, as menu, 5 pics, fulfilling the whole screen in portrait. I'm using UISwipeGestureRecognizer for each view so the user will be able to go left and right through all of them. My problem is that the transition goes very dry and instantaneous, without any animation. So, my question is what should I use, to obtain this cool effect of the views, snapping to the screen boundaries, when the user takes out his finger?
You know, just like the main menu of the iPad, when you go through the pages with your apps and before swiping a page all the way to the end and let go, the page snaps with a little jerky adjustment.
I,ve looked everywhere and could not find anything on that on the net.
Thank you very much in advance for your answers
Ioan
Check out the three20 library. It does this and much more. Specifically look at the launcher feature.
You'll have to add in your own animations and effects yourself if you aren't using a 3rd party utility (I don't know of one that does what you want).
For instance, if you wanted your icons to center on the screen smoothly, maybe setup a timer that triggers every 100 milliseconds for .5 seconds so that after the .5 seconds are up, the icons are centered.
As soon as the user lifts their finger after a swipe take the center position, how far away the icons are from the center, and divide by 5 and move by that much each timer activation.
That's a simple example, but I think you get the idea.
Related
Well, it might be hard to describe, but what I want this:
When the application fires up, I want it to load a couple of components and I want to show a progress bar loading upto 100% Complete. But for Interface sake, I just want the progress bar on the desktop. I don't want the Window controls or background. My customized progress bar should appear on the desktop loading upto 100%, followed by showing of window and thereby, the entire app.
Just to mention, I want this in a Mac App being developed in Xcode.
I strongly suggest you think about the visual effect you're considering and the assumptions you're making. I would argue this to be "bad design":
Users can put anything as a Desktop Picture. If my background happens to be blue... and your custom progress bar is blue.. then I won't see the progress bar and will be left wondering why your application isn't responding. "Screw this app, it hangs when I launch it. Delete!"
Chances are that users have more than one application running. Your "floating progress bar" would be lost in a sea of other application windows. (Why is iTunes loading something? Oh wait!! It's this other windowless thing... "Not intuitive! Not cool")
This is not very Mac-like. Don't forget there are rules for each platform as to how to be a good citizen. Metro apps need to adhere to a specific Interface paradigm. Likewise, there's a thing to be said for "Mac-like" and I would argue this behaviour isn't (a floating progress bar).
I would strongly suggest you keep your progress bar within a properly named modal window. Applications go in-and-out of being front-most... so it's important to know what that progress bar relates too.
If you've considered all these, the following question should help you get started :
How to make an NSView transparent and show what's under the NSWindow?
You are probably talking of a borderless NSWindow (NSBorderlessWindowMask), with an opaque background view whose alpha is set to zero and an NSProgressIndicator subview to show the progress. You also probably want to use the -[NSWindow center] method to nicely center your window.
However, I doubt that you want that kind of UI. A progress bar is probably not visible on top of all desktops, and thus aesthetically worthless.
I think a rounded, half-transparant black window will be more suited in your case. Take a look at Matt Gemmell's source code.
This is hard for me to explain, so please bear with me for a minute.
In Xcode, if it is in full screen mode, showing the app's menu also moves the toolbar down. I have tried to make an NSView move and resize whenever the menu bar is shown, but I cannot figure out how to do it. I think this has something to do with and event, because setting struts and springs in Xcode does not make it move automatically. Can anybody help me figure out what the event is?
Edit: I just re-thought my question, and I have to make a correction. NSToolbar does this on it's own. I want a normal NSView to move and resize itself when the window goes into full screen mode.
I think you might be having the same issue as I was - if so, you need to call [NSToolbar setFullScreenAccessoryView:] on the "accessory view" you want to glue to the bottom of the NSToolbar.
Note that in windowed mode, your accessory view should take up space in the NSWindow's contentView just like any other view, but when you enter fullscreen mode you'll want to remove the accessory view somehow since Cocoa rips it out of your layout and leaves a gap unless you account for that.
I can certainly understand this issue being difficult to explain without having the background knowledge - I had the same problem. :)
Also see: How can I get a two-row toolbar like in Mail.app and Xcode?
I'm working on an app that needs many TabBar Items (6 or 7). I don't think users like to click the "More" button on TabBars, so I'm wondering how to make my own TabBar that slides from left to right, so one can easily access all the buttons on the tabbar without pressing "More."
Thanks!
I agree with the other answer that it's a bad idea from a design standpoint.
Nevertheless, the technical answer is that you can simply embed a UITabBar in a UIScrollView. If you set the tab bar's width and the scroll view's contentSize appropriately, the tab bar will be scrollable. You will probably want to turn off bouncing and scroll indicators.
I didn't try it with a UITarBarController.
Opinions on whether this is a good idea or not aside
A simple carousel should be fairly simple to implement from scratch using a UIScrollView with UIButton subviews. which will provide all the scroll mechanics for you
As a sample idea.
A UISCrollView which spans the width of the device.
N buttons across the scroll content pane
Restrict scroller to horizontal scrolling.
Provide selected and unselected images for the buttons
Create glue code to ensure only one button is selected at a time (like Radio buttons)
But I do agree with the other posters that its a bad UI idea. Id be thinking UIToolbar for this.
Apart from considerations about UX and UI guidelines, a way you can implement such thing is implementing a tab bar from scratch. You can even find a tutorial here for iOS5.
Actually, implementing a tab bar and a tab bar controller is not difficult as it may appear at first sight, but given the effort involved, you could also ask you what value this kind of design add to your app and to the user experience.
In any case, if you decide to go for this path (a scrollable tab bar), I would suggest to make it such that the user cannot be misguided into thinking it's a standard tab bar.
That's against about every design guideline ever written for iOS.
(I know that Gift Plan for iOS has a scrollable tab bar, but it never hides items from the user.)
The HOW to do it has been accepted,
MOBILE DESIGN PATTERNS are not cast in concrete - it is about what is appropriate for YOUR app.
It used to be that web pages scrolled vertically and side-scrolling was frowned on.
But the tablet has been a game changer - people EXPECT to swipe side to side.
A comment on one case when scrolling tab view is actually highly appropriate ..
(a) Look at xFeed in App Store
This has 10+ topics like News Sports ... , easy to scroll to topic and click takes you to RSS feeds under it.
This is truly convenient for user, and in my opinion appropriate.
The alternative is to go back and forth between a menu of some kind and the target view - which could be a 2nd option, but from a quick browse experience this is good.
(b) USA Today is another example - even on its main website, has the < > arrows to scroll between topics or you can click on tabs at top. Admittedly the tabs themselves don't scroll, but you get the idea. The entire site, and the mobile experience for USA Today is strongly optimized around side swipeing between chapters.
(c) Presentations and content sites have come to be side scrolling as well.
(d) FINALLY on a Human Happiness viewpoint! People WANT TO TOUCH and PLAY with their mobile stuff. Not just tap!
So mobile touch is quite happy here. One more thing to swipe and slide :)
Here is a link of project with custom scrollable tab bar:
github - scrollable tab bar by BananaDev
It's free and provides a wide variety of customization options allowing you to fully change control.
I've got a tabbed iPad application with just about each tab running a UIWebView. I'm getting all sorts of callbacks, like when a user tries to leave the corporate site (which only displays the company site to users). In this case, I pop up a "toast" style window that tells them to click a button to open the page in Safari. I also pop it up with a spinner and no text to indicate that a page is loading. The approximate look that I'm going for is used in lots of applications, but you can see it best when changing the volume on the iPhone or iPad. It's just a translucent rounded square that fades in and out.
Right now I've got it implemented on one of my tabs, and I did it by creating the objects (a spinner, a label, and a UIImage with the square) and then programmatically hiding and showing them using [UIView beginAnimations] and changing the label's text. It works perfectly but I've got these nagging things hovering over my interface in Xcode, and it takes a lot of setup to accomplish if I wanted it to be in another tab, which I do. I can't help but think that there's a better way to accomplish this. I thought about making and adding a subview, but that would leave a white background to the toast. What I'm thinking is creating some sort of object that I can allocate in a tab's view controller whenever it's needed.
What are your guys ideas, or have you done this in the past? I see it in a lot of prominent applications, like Reeder, so I'm sure it's been done more eloquently than I have done it.
Matt Gallagher has a great class called LoadingView here Showing message over iPhone Keyboard. I use it.
MBProgressHUD is a popular library for this, as well.
I am trying to design a feature in my application for the iPhone that simulates the Springboard feature (Main menu of the iPhone that allows you to view more apps), or the way Weather application works that allows you to flip between views.
Does anyone have any samples of this how I would go about doing this. It's seems very trivial but I am wondering if I am missing something that is already available either as an Apple example or someone who did a tutorial on this.
The image below show how the user would use it.
alt text http://www.agilitesoftware.com/SpringboardExample.png
As they slide their finger to the right (or left) the other image would begin to show up. And it would animate smoothly. The faster you swiped your finger the faster it would move to the next view.
Update: The other feature is that it should mimic the same feel when you slide your hand across the display that is snaps to the current view into place. It should not keep sliding across if there is more than 1 view to the direction you swiping your finger.
I've seen other applications use this so that is why I am asking.
This is accomplished using the UIScrollView with the pagingEnabled property set to true. Just add each of your views, adjust the contentSize, and it will automatically "page" to the width of the screen across the content.
There is a sample app (with code) with exactly this functionality on the iPhone developer site on Apple.com (I believe it's called "PageControl".) - I'd suggest checking it out.
d.
I'm writing an app that uses a similar UI. As NilObject recommended, we're using a UIScrollView with pagingEnabled=YES.
You may also be interested in this example code involving just two child views. I'm trying it out now; it's an interesting technique but I've had to write some additional special-casing code for some odd situations that resulted.
There's also another question on this site that asks about creating a grid of icons like the home screen.
I would check out Joe Hewitt's code from the Three20 project for this. It provides a nice interface and further refinement of the UIScrollView implemented as TTScrollView and TTScrollViewDelegate, TTScrollViewDataSource.