I am new to iOS app dev. I want to create UI similar to bottom tools line in iPhoto app.
Any tutorial or tips will be really helpful.
Click this link to see UI of iPhoto app.
First image from above link shows the bottom tool container.
Thanks.
you can use a normal UIToolbar.
Here is a tutorial for adding UISlider to your toolbar: http://eureka.ykyuen.info/2010/06/09/iphone-adding-uislider-to-uitoolbar/
// Initialize
aSlider = [[UISlider alloc] init];
UIBarButtonItem *sliderAsToolbarItem = [[UIBarButtonItem alloc]
initWithCustomView:aSlider];
// Set the width of aSlider
[sliderAsToolbarItem setWidth:250.0];
// Add the items to the toolbar
[toolbar setItems:[NSArray arrayWithObjects:sliderAsToolbarItem, nil]];
If you search for custom UIToolbar you are getting tons of results with tutorials.
Here you can find a custom UITabbar: http://idevrecipes.com/2010/12/16/raised-center-tab-bar-button/
Or you can just use a view with buttons in case of toolbar or tabbar and set it to bottom.
Related
I'm trying to customize my UIImagePickerController's status bar appearance. I have a custom image I'm using for the back button, which properly appears, but what I'd like to do is remove the text (so it's just the image). I regularly do this throughout my app, but I can't seem to get it working in the UIImagePickerController.
I figured I could do something like...
UIImagePickerController *uiipc = [[UIImagePickerController alloc]init];
uiipc.navigationController.navigationItem.backBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:#"" style:UIBarButtonItemStylePlain target:nil action:nil];
However that does not seem to work, when selecting a folder e.g. "Photos" I still get the custom image with the text "Photos" next to it for the back button.
Could someone give me a hand removing the text?
EDIT: Worth noting that the custom image is set in my app delegate, which is why you don't see that in my example.
You could use appearance proxy method:
UIOffset backButtonTextOffset = UIOffsetMake(0, -60);
[[UIBarButtonItem appearance] setBackButtonTitlePositionAdjustment:backButtonTextOffset
forBarMetrics:UIBarMetricsDefault];
this will take out title text way. See the attached image for iOS 7.
I used third party code (menu) in my application to change my navigation controller back button title. Therefore I used code like this:
self.navigationItem.hidesBackButton = YES;
self.navigationItem.leftBarButtonItem = [[[UIBarButtonItem alloc] initWithTitle:#"Geri" style :UIBarButtonItemStyleBordered target:self action:#selector(myCustomBack)] autorelease];
This code work fine but there is no default left arrow image in iOS 7, also rectangle button created in iOS 6. How can I add default left image (not custom) in back button?
You need own arrow image.
Create regular UIButton with custom style and background image (arrow) also set action, then create UIBarButtonItem and put this button as custom view;
I am new to developing for iOS, but I am completely stumped with this.
Steps:
In Xcode, create a new tabbed application for iPhone.
Go into first subview and drag a Navigation Bar to the view.
Go into viewDidLoad and add this (assuming you have dropped logo.png into the project structure):
self.navigationItem.titleView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"logo.png"]];
Render the view - it does not work. No custom image replaces the default "Title" text.
I don't understand. Why does this not work? What do I have to do to make it work? Is there something fundamentally different I need to be doing or a concept I am not grasping fully here?
UPDATE
I have figured out that the code above works. You just need to embed your view inside a navigation controller. Click on the first tabbed view, then do Editor > Embed In > Navigation Controller. The code will then work, and you can continue moving forward. Just embed each tab in a navigation controller using the method above and you should be good to go!
The code you have will work if your controller is embedded in a navigation controller, but if you add a navigation bar manually, you need to make an IBOutlet to it (bar in my example), and get its navigation item,
- (void)viewDidLoad {
[super viewDidLoad];
UINavigationItem *item = self.bar.items[0];
item.titleView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"logo.png"]];
}
May be the problem you are facing is because of not setting the frame. I face similar problem sometimes. Try this:
UIImageView *customTitleView = [[UIImageView alloc]initWithFrame:CGRectMake((320-210)/2, 0, 210, 50)];
customTitleView.backgroundColor = [UIColor redColor];
self.navigationItem.titleView = customTitleView;
Hope this helps. :)
I have navigation controller based app and one viewcontroller presents modally graph in a landscape mode. I then add Toolbar with Done button to dismiss the graph vc and return to navigation and portrait mode.
I can't figure out how to position the Toolbar on top of the graph viewcontroller with correct shadow on the bottom of the toolbar. So far I have this code to add the toolbar to the bottom position, which has default shadow on the top of the toolbar. Is it allowed to have toolbar on top of the screen? For the reason of forced orientation rotation I cannot use navigation controller with the graph vc. Platform is iOS7 and iPhone only. Thanks.
UIToolbar *toolbar = [[UIToolbar alloc] initWithFrame:CGRectMake(self.view.bounds.origin.x, self.view.bounds.size.width - 44.0, self.view.bounds.size.height, 44.0)];
UIBarButtonItem *flexibleSpaceButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
UIBarButtonItem *doneButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:#selector(done)];
toolbar.items = [NSArray arrayWithObjects:flexibleSpaceButtonItem, doneButtonItem, nil];
[self.view addSubview:toolbar];
I think your frame is looks a bit strange. You are calculating the y position from the view width and the width from the view height.
Maybe you have to specify that the toolbar is on top using the UIBarPositioning protocol.
UIImage *shadow = [toolbar shadowImageForToolbarPosition: UIBarPositionAny];
[toolbar setShadowImage:shadow forToolbarPosition:UIBarPositionTopAttached];
Next Edit:
This is what the documentation has to say about the iOS 7 UIToolbar:
UIBarPositionTop
Specifies that the bar is at the top of its containing view.
The system uses this as a hint to draw directional decoration accordingly. For example, any shadow would be drawn below the bar.
Instances of UIToolbar do not appear with this position on iPhone, but they can on iPad.
Available in iOS 7.0 and later.
Declared in UIBarCommon.h.
Maybe toolbars are not meant to be used on top. However, you can simply add a shadow with addSubview:
Try to implement the method
- (UIBarPosition)positionForBar:(id<UIBarPositioning>)bar
from of UIToolbarDelegate protocol.
I would like to setup the navigation controller bar button item to be an image.
I have read the following - Add image to a navigationItem's title
I understand how to setup this as an image. I am actually looking to set this up as the setting cog, within the bar button item (like a cog icon). I have seen this before in other apps, I would like to know if there is a default style to initialise for this or normally if this is achieved by the image route as above.
If this is above, does anyone know where this (kind of) default image styled icon is available, or would I need to make one?
Have you tried using the initWithCustomView option of UIBarButtonItem? A sample code will look like the below line.
UIBarButtonItem *aButton = [[UIBarButtonItem alloc] initWithCustomView:[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"settings.png"]]];
Another way to do this is,
UIBarButtonItem *aButton = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:#"settings.png"] style:UIBarButtonItemStyleBordered target:self action:#selector(buttonTapped)];
If you use storyboard, you can directly:
Drag a Button in the navigation bar instead of a Bar Button Item. It will automatically create a Button Bar Item for you with a Button inside it.
Enter a title for the Button Bar Item
Set an image for the Button with a Custom type.
It should works.