JSNoob
JSNoob

Reputation: 1577

Swift: stick button in tableview

Trying to add a Google Inbox Plus button in my tableview, I managed to add the button to the tableview, but failed to make stick( or float?). here is my code

override func viewDidLoad() {
  self.createButton
}

func createButton() {
        let button = AddButton()  // AddButton is a custom button class I created
        button.setTitle("", forState: .Normal)
        button.setTitleColor(UIColor.blueColor(), forState: .Normal)
        button.frame = CGRectMake(15, -50, 200, 100)
        self.view.addSubview(button)
}

If I want to make the button float like the image below, what should I do next

a button in Google Inbox, the plus button stick to the window

Upvotes: 0

Views: 1172

Answers (2)

Volodymyr
Volodymyr

Reputation: 1442

Here is a code which programmatically adds floating button in a right bottom corner of UITableViewController:

private func createFloatingButton() {
    floatingButton = UIButton(type: .custom)
    floatingButton?.backgroundColor = .clear
    floatingButton?.translatesAutoresizingMaskIntoConstraints = false
    constrainFloatingButtonToWindow()
    floatingButton?.setImage(UIImage(named: "floatButton"), for: .normal)
    floatingButton?.addTarget(self, action: #selector(doThisWhenButtonIsTapped(_:)), for: .touchUpInside)
}

private func constrainFloatingButtonToWindow() {
    DispatchQueue.main.async {
        guard let keyWindow = UIApplication.shared.keyWindow,
            let floatingButton = self.floatingButton else { return }
        keyWindow.addSubview(floatingButton)
        keyWindow.trailingAnchor.constraint(equalTo: floatingButton.trailingAnchor,
                                            constant: Constants.trailingValue).isActive = true
        keyWindow.bottomAnchor.constraint(equalTo: floatingButton.bottomAnchor,
                                          constant: Constants.leadingValue).isActive = true
        floatingButton.widthAnchor.constraint(equalToConstant:
            Constants.buttonWidth).isActive = true
        floatingButton.heightAnchor.constraint(equalToConstant:
            Constants.buttonHeight).isActive = true
    }
}

I performed this as a part of my Medium article of creating floating button to swipe to the end of UITableViewConroller: https://medium.com/@volodymyrrykhva/ios-float-button-to-scroll-down-tableview-ec6a8dd23307

Upvotes: 0

Dave Batton
Dave Batton

Reputation: 8835

Instead of using a UITableViewController, just use a UIViewController with a UITableView as a subview in the storyboard, and use a UIViewController subclass with a tableView IBOutlet. This will give you a lot more control, and it's not a difficult change to make.

Now you can add your button to the view controller's view outlet, rather than putting it right on the table view.

Another, more involved option would be to use auto layout to connect the button's position to the containing window, rather than to the table view. But I think that would be more work.

Upvotes: 1

Related Questions