Question

I would like to make a back and forward navigation from the start. So I added a Button inside the navigation bar however I would like the exact iOS icon with the back text after it.

How can I get this thing myself without the need to navigate programmatically? I use the storyboard.

Ignore the background color I mean this icon :

enter image description here

I do not use a navigation controller I use a page view controller and that is why. I don't know how this icon work if the text is part of the icon or not so I hope anyone knows.

Was it helpful?

Solution

I get now what you are trying to do. I did this not too long ago. I actually had to make the button myself. You said you have a leftbutton, this will need an outlet in your .h file. If you want we will call it leftButton for now. You will need some images so I am going to include the ones that I made. I made them in Paint Code. It is $99 USD but one of the best investments I ever made as an App designer. Here they are. I called them back and whiteSpace..

enter image description here enter image description here enter image description here enter image description here

The last two images are white spaces so make sure you get them too. Drage them from this page to your desktop, then drag them to your project, make sure to click destination, copy into folder when you do this. Once you have the icons, the rest is done programmatically. In your viewDidLoad method you will change the appearance of your leftButton.

//First get the images
UIImage *arrow = [UIImage imageNamed:@"back.png"];
UIImage *wordSpace = [UIImage imageNamed:@"whiteSpace.png"];

//Next make a size of the image or it will be distorted
CGSize size = CGSizeMake(arrow.size.width + wordSpace.size.width, arrow.size.height);

//Put the two images together
UIGraphicsBeginImageContext(size);
[arrow drawInRect:CGRectMake(0, 0, arrow.size.width, size.height)];
[wordSpace drawInRect:CGRectMake(arrow.size.width, 0, wordSpace.size.width, wordSpace.size.height)];
UIImage *finalImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

//Assign the icon to the button
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle:@"Back" style:UIBarButtonItemStylePlain target:self action:@selector(backButtonClicked)];
[backButton setBackgroundImage:finalImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];

//Move title over a bit to make it look nice
[backButton setTitlePositionAdjustment:UIOffsetMake(-20, 0) forBarMetrics:UIBarMetricsDefault];

//Make your button this new backButton
_leftButton = backButton;

Now that you have a custom back button you can assign the @selector(backButtonClicked). I am not sure about the fact that you are using a page controller, but in mine, I used a popViewController. But I did have a Navigation Controller in the project. You might need to call the proper VC with another method. But this is backButtonClicked.

- (void)backButtonClicked
{
  //NSLog(@"going back");
  [self.navigationController popViewControllerAnimated:YES];
  //change to call your VC
}

So other than calling your desired view controller that should do it. If you don't know how to call a view controller programmatically, here is a link.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top