开发者

how to add buttons to a page controller

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!


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
}


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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜