how to add buttons to a page controller - iphone

Question

I wonder how you can add buttons (left and right) to change page controll views.
I'm working on this tutorial [1]: http://www.edumobile.org/iphone/iphone-programming-tutorials/pagecontrol-example-in-iphone/ . How can I add 2 simple buttons (left and right) to turn pages in addition to the swaping function in this example code?
I'm a programmer beginner so any kind of answer is highly appriciated! :)
thanks!

Answer 1

You can add two buttons to the view and when the button is clicked call a method to turn the page according to the button clicked.
UIButton *leftButton = [[UIButton alloc] init];
leftbutton.frame = leftButtonFrame;
[leftbutton setTitle:#"Left" forState:UIControlStateNormal];
[leftbutton addTarget:self action:#selector(leftbuttonClicked:) forControlEvents:UIControlEventTouchUpInside];
[yourView addSubview:leftbutton];
UIButton *rightButton = [[UIButton alloc] init];
rightButton.frame = rightButtonFrame;
[rightButton setTitle:#"Right" forState:UIControlStateNormal];
[rightButton addTarget:self action:#selector(rightButtonClicked:) forControlEvents:UIControlEventTouchUpInside];
[yourView addSubview:rightButton];
- (void)leftButtonclicked:(id)sender
{
//Code to turn page left
}
- (void)rightButtonclicked:(id)sender
{
//Code to turn page right
}

Answer 2

I'm going to answer this in swift, but you should be able to translate.
The process is to find the PageControl view, add the two buttons and hide the buttons when appropriate (i.e. no previous button on first page).
I place the buttons on left and right side of PageControl. The default behavior is that touching there does a page back and page forward. So I set the buttons to enabled=false so that touches execute this default behavior.
First we need an enum to help locate buttons. Use values which won't be use elsewhere in view.
enum enumBtnTag: Int {
case tagPrev = 9991
case tagNext = 9992
}
var pageNbr = 0 //Needed to keep track of page being displayed
Now we will add our buttons in ViewDidLoad. First I locate the PageControl, then I look for buttons so as to not create twice. (ViewDidload could be called multiple times)
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
for view in self.view.subviews {
if view is UIPageControl {
let curr:UIPageControl = view as! UIPageControl
curr.backgroundColor = UIColor.clear
curr.currentPageIndicatorTintColor = UIColor.red //Page Dot is red
curr.pageIndicatorTintColor = UIColor.black //Other dots are black
let pcSz = view.frame
let btnSz = CGSize(width: 35, height: 50) //Use your button size
if let _ = self.view.viewWithTag(enumBtnTag.tagNext.rawValue) as? UIButton {}
else { //Next Button not found
let Nbtn = UIButton(frame: CGRect(x: pcSz.width - btnSz.width, y: -15, width: btnSz.width, height: btnSz.height))
Nbtn.setTitle(">>", for: UIControlState.normal)
Nbtn.backgroundColor = UIColor.clear
Nbtn.setTitleColor(UIColor.brown, for: UIControlState.normal)
Nbtn.titleLabel?.font = UIFont(name: enumFontNames.MarkerFelt_Wide.rawValue, size: 60.0)
Nbtn.isEnabled = false //Allows touch to fall through to PageControl
Nbtn.tag = enumBtnTag.tagNext.rawValue
view.addSubview(Nbtn)
}
if let _ = self.view.viewWithTag(enumBtnTag.tagPrev.rawValue) as? UIButton {}
else { //Prev Button not found
let Pbtn = UIButton(frame: CGRect(x: 0, y: -15, width: btnSz.width, height: btnSz.height))
Pbtn.setTitle("<<", for: UIControlState.normal)
Pbtn.backgroundColor = UIColor.clear
Pbtn.setTitleColor(UIColor.brown, for: UIControlState.normal)
Pbtn.titleLabel?.font = UIFont(name: enumFontNames.MarkerFelt_Wide.rawValue, size: 60.0)
Pbtn.isEnabled = false
Pbtn.isHidden = true
Pbtn.tag = enumBtnTag.tagPrev.rawValue
view.addSubview(Pbtn)
}
}
}
}
Then I capture the page that is going to be displayed. The page might not be displayed (user didn't drag far enough), but that is handled later.
func pageViewController(_ pageViewController: UIPageViewController, willTransitionTo pendingViewControllers: [UIViewController]) {
if let identifier = pendingViewControllers[0].restorationIdentifier {
if let index = pages.index(of: identifier) {
pageNbr = index
}
}
}
Now we modify buttons in didFinishAnimating;
func pageViewController(_ pageViewController: UIPageViewController, didFinishAnimating finished: Bool, previousViewControllers: [UIViewController], transitionCompleted completed: Bool) {
if finished && completed {
if let button = self.view.viewWithTag(enumBtnTag.tagPrev.rawValue) as? UIButton {
if pageNbr > 0 {
button.isHidden = false
} else {
button.isHidden = true
}
}
if let button = self.view.viewWithTag(enumBtnTag.tagNext.rawValue) as? UIButton {
if pageNbr < pages.count - 1 {
button.isHidden = true
} else {
button.isHidden = false
}
}
}
}
Bonus code: I added a Save function at last page where the Next Button is. You need to set the button is enabled (so it registers the touch) and set a target (what ever function you want to execute); mine is "nextSegue".
and of course remove target when not on last page;
if pageNbr < pages.count - 1 {
//Not on last page. Use next button
button.setTitle(">>", for: UIControlState.normal)
button.removeTarget(self, action: #selector(nextSegue), for: UIControlEvents.touchUpInside)
button.isEnabled = false
} else {
//On last page. Use save button
button.setTitle("S", for: UIControlState.normal)
button.addTarget(self, action: #selector(nextSegue), for: UIControlEvents.touchUpInside)
button.isEnabled = true
}
Hope this helps someone.