I would like to put thumbnails in the toolbar like the Photos app. Like the screenshot on the left:
(source: apple.com)
Is there is a built-in control to do this, or do I have to implement it from scratch?
If the answer is from scratch, any tips?
This would be a control you'd have to write yourself. I'm not what the best approach would be, but I think I'd go with subclassing a UISlider, drawing the array of images next to each other to create the track, and then using the current image as the handle.
From scratch, is the answer, unfortunately.
You create a custom view and add your array of images as subviews using UIImageView objects incrementing your x position by the the thumbnail width you've determined to use.
Then override the touch events for you custom view. Determine which image view the touch is currently over in -touchesMoved and use Core Animation to animate the current view's scale making it larger than the rest. Add the custom view to your toolbar wrapping your custom view in a UIBarButtonItem using -initWithCustomView.
Remember to enable user interaction on your custom view or you won't receive any touch events. If you need help with the code, update your question with some code specific questions.
Should anyone still need it, I made an effort of coming up with ThumbnailPickerView - a simple UI control resembling Photos.app thumbnail slider.
Related
Language: Swift, IDE: Xcode for iOS development, Single View Application > View Controller...
I have 2 UIImage Views with identical images that I'm scroll-animating from left to right across the view in order to create a 'slowly-moving background' of sorts. I'd like to place other UI elements (Labels, other images, etc.) in the foreground of this repeating background animation, but find when I run the simulator the foreground image isn't seen...
Question: Is it possible to force other UI elements to stay in front of a repeating animation programmatically?
I'm not at my Mac so I can't share my code at the moment, but if you know a straight answer to the question and/or which method could best achieve this, I'm all ears!!
Thanks in advance! :)
This depends on the z-ordering of the views. Assuming you are adding all of your views then starting the animation call bringSubViewToFront on the view you are animating right before you start animating it. If you are laying things out in interface builder the Z order is based on top = farthest and bottom = closest. If you are adding view programmatically the newest view is always added in front. You can change this with insertSubview:at: and the related methods. Take a look at the documentation for UIView.
If you want z-index use:
YourImageViewName.layer.zPosition = 1
Also you could play with bringToFront method on the parent view:
self.view.bringSubviewToFront(YourImageViewName)
Hope this fix your problem.
If I have an animation which can play with an array of images.
How Do I set this to play on a button? I want the buttons image to display the animation?
Thanks
If you need an actual button, then the choice is clear: You will need to build your own custom UIControl object to achieve this. Quite possibly you can just subclass UIButton, and handle animating the images that way. I do something similar in one of my apps using core animation to fade between a series of 6 images. It works quite well.
I will point you at the UIControl class reference. Please read the intro material on the page, it links to other pages, like event handling. As well, I will also point you at the CABasicAnimation class reference, with the same caveat applied.
Remember, a UIControl is just a UIView, except that it handles events a particular way.
Simplest way is just to place a custom UIButton (ie invisible to the user) above your UIImageView. Then it will appear that the button is animated but in reality it will be the images underneath the button that are animated.
Create an array, eg. myArray with the filenames of your images.
assign this array to a UIImage with myImage.animationImages = myArray;
then use setImage:forState to assign this animation to the button.
What I want to accomplish is something like this:
Two different scrollViews, and each one scrolls horizontically. Each showing 3 images, and a half one (or 1/3th) piece of the next image in the datasource of the scrollview.
Does anyone know how to accomplish such a scrollview?
I also want to be able to tap an image to flip it and show some information and a button to the detail. (See lower scrollview).
Tapping it again would just show back the image, much like the coverflow ui inside itunes, but without the coverflow being 3D...
Any help is welcome :)
Thanks in advance,
Lewion
Scroll view doesn't have a datasource. What you are looking for is standard scrolling and nothing special.. So it is definitely doable... Check the scrolling and photo scroller sample codes from apple developer samples. For more implementations of scroll view check the scroll view suite sample code and read the scroll view programming guide.
The flip animation is also a standard animation for a view and is easily doable. For example, create a utility application for iphone. It has a flip side view. See how that animation is done.
I want to add some custom buttons and realize the same effect like the iPhone's home screen. What I can think of is to calculate the position of each button and add them to the view. Are there any other ways to do this? e.g. add buttons to the tableview
Check TTLauncherView from Three20,
I realized the same view of the thumbnails in the photo app (which in principle differs only because of the background color and the rounded effect of the buttons) using a custom cell (with 4 UIButtons inside) in a normal tableview.
In my case, this is because I need to scroll up and down, in your specific case there should be a way to "lock" the table from scrolling. By the way, for this reason, it could be simpler to design the custom view in the interface builder, it is very quick to design such a view, and then create a custom controller to provide simple methods to assign icons and actions to the UIButtons dynamically.
You could also look at the Three20 libraries as already suggested, it is already implemented, but you app will easily be rejected by Apple if you do so.
I am almost at the end of coding my kids educational application, woohoo!.
But... Im stuck on something.
When app loads i have my main view. It has 4 buttons for flipviews(each with ten views of content) and 4 buttons for character selection(an image that will follow you through every screen of content).
Problem is im unsure on how to link UIButton selection to UIImage display in multiple views. I want the user to choose a character button and then continue to the flipviews and in the views the image displayed should be the one that they have selected on the main view. So everytime they return to the main view they can change the character that will follow them around the app.
Any thoughts, help or code would be much appreciated!
Thank You
Alex
Make a new object, a subclass of UIImageView, which has a -setImage method. Once you set the image, then where ever you embed that object, it will display the same image. You could even have that subclass view have a score displayed next to it, or a name or other stats, so as you go from one screen to another, you have all that info follow you around with the image. No need to create labels in all the screens for global info like that.
In summary:
make a new subclass of UIView or UIImageView in Xcode using the New File... menu. You would do new UIView if you will have other items than just an image.
add methods that allow you to set the image, update text stats etc.
BONUS: you can make the class handle taps, so if a user taps the image, you could do something like provide help or run a cute little animation
embed that object in any screens you wish. Keep in mind that you can have that view be sized differently in each screen using transforms. Cool, no?
that's pretty much it!
Good luck!