Having a problem with customizing the navigationBar. I have changed the titleView text to an image through coding. Now I want the image to be a clickable button with a segue to the starting page (for example a home button to the main viewController). How do I make the titleView image into a button (or item) and how do I create a segue from it. I suppose it has to be done in code since I haven't found any other means of doing it. If you have a solution, please be thorough - I'm a beginner.
Simply add a custom UIView containing UIButton and UIImageView to the titleView of navigationItem.
Example:
override func viewDidLoad()
{
super.viewDidLoad()
let button = UIButton(frame: CGRect(x: 0, y: 0, width: self.view.frame.width - 80, height: 30))
button.setTitle("Button", for: .normal)
button.addTarget(self, action: #selector(showMainVC), for: .touchUpInside)
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: self.view.frame.width - 80, height: 30))
imageView.image = UIImage(named: "Image")
let customView = UIView(frame: CGRect(x: 0, y: 0, width: self.view.frame.width - 80, height: 30))
customView.addSubview(imageView)
customView.addSubview(button)
self.navigationItem.titleView = customView
}
func showMainVC()
{
//TODO:
}
Related
I have a UIPageViewController with UIPageControl at the bottom like so:
let rect = CGRect(x: 0, y: UIScreen.main.bounds.maxY - 50,
width:UIScreen.main.bounds.width, height: 50)
let button = UIButton(frame: CGRect(x: UIScreen.main.bounds.maxX-30, y: UIScreen.main.bounds.maxY - 30, width: 20, height: 20))
button.addTarget(self, action: #selector(buttonPressed), for: .touchUpInside)
pageControl = UIPageControl(frame: rect)
self.view.addSubview(button)
self.view.addSubview(pageControl)
But whenever I put the button inside the bounds of the UIPageControl view the button doesn't respond to my clicks, but when I move it outside of it it works fine and triggers the action. Does anyone know why that is?
I can't figure out what is wrong in this code. i want to display button and image in tableview section header
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let view = UIView()
let image = UIImageView()
image.frame = CGRect(x: view.frame.width - 10 , y: 0, width: 20, height: 20)
image.image = UIImage.init(named: "triangle.png")
let button = UIButton(type: .system)
button.frame = CGRect(x: view.frame.origin.x, y: view.frame.origin.y, width: view.frame.width - 30, height: view.frame.height)
button.setTitle("Open", for: .normal)
button.backgroundColor = .yellow
button.addTarget(self, action: #selector(buttonclick), for: .touchUpInside)
view.addSubview(image)
view.addSubview(button)
return view
}
You shouldn't set imageView and button frame by view frame. Because when viewForHeaderInSection function is being called view frame will be 0.
Instead of view you can use tableview
image.frame = CGRect(x: tableView.frame.width - 20 , y: 0, width: 20, height: 20)
button.frame = CGRect(x: 0, y: 0, width: tableView.frame.width - 30, height: 50)
It is recommended to use autolayout instead of setting frame.
Add below code just after initialising view :
view.frame = CGRect(x: 0 , y: 0, width: tableView.frame.width, height: heightForHeaderInSection)
you forgot to set the view's frame.
I'm trying to add a UIButton inside a UIView called containerView. The containerView is showing normally but the UIButton isn't showing up at all. This is my code:
let containerView = UIView()
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(true)
self.containerView.frame = CGRect(x: self.view.frame.size.width - 100, y: 200, width: 225, height: 70)
self.containerView.backgroundColor = UIColor.gray
self.containerView.layer.cornerRadius = 20
self.containerView.clipsToBounds = true
self.view.addSubview(self.containerView)
let button1: UIButton = UIButton()
button1.frame = CGRect(x: self.view.frame.size.width - 70, y: 200, width: 35, height: 35)
button1.clipsToBounds = true
button1.setTitle("Tesing Button", for: .normal)
self.containerView.addSubview(button1)
}
Any help? Thanks!
Your button frame is positioned incorrectly. You have set the value of y as 200 which is beyond the size of your container view.
I'm trying to change the selection area of a UIBarButtonItem within the navigation controller. Basically I'm trying to change the allowable area that will make that UIBarButtonItem selectable. Right now, the size of my UIBarButtonItem is 40x40, but I can easily select it even if my finger is not touching the button at all.
Here's to illustrate what I mean:
The green represents the size of the UIBarButtonItem. The red represents the allowable area that makes the UIBarButtonItem selectable.
How can I change the width of the red area?
Here's a snippet of code if helpful:
changeMuscleMap = UIButton(frame: CGRect(x: 0, y: 0, width: 40, height: 40) )
changeMuscleMap.setImage(UIImage(named: "change"), forState: .Normal)
navigationItem.leftBarButtonItem = UIBarButtonItem(customView: changeMuscleMap)
Thanks!
If you want larger click area than required, try the below code, then making a UIBarButtonItem With custom button:
#implementation CustomButton
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent*)event
{
UIEdgeInsets extendTouchInsets = UIEdgeInsetsMake(20, 0, 20, 0);
CGRect bounds = self.bounds;
bounds.origin.x -= extendTouchInsets.left;
bounds.origin.y -= extendTouchInsets.top;
bounds.size.width += extendTouchInsets.left + extendTouchInsets.right;
bounds.size.height += extendTouchInsets.top + extendTouchInsets.bottom;
return CGRectContainsPoint(bounds, point);
}
#end
You can use the following code to increase or decrease UIBarButtonItem button width.
changeMuscleMap = UIButton(frame: CGRect(x: 0, y: 0, width: 120, height: 40) )
changeMuscleMap.setImage(UIImage(named: "change"), forState: .Normal)
changeMuscleMap.contentHorizontalAlignment = .left
navigationItem.leftBarButtonItem = UIBarButtonItem(customView: changeMuscleMap)
It can be achieved by making a UIBarButtonItem with custom item as UIImageView instead of UIButton. Try the below code. I hope this will solve it now.
changeMuscleMap = UIImageView(image:UIImage(named: "change"))
imageView.frame = CGRectMake(0, 0, 40, 40)
let leftBarBtn = UIBarButtonItem(customView: imageView)
self.navigationItem.leftBarButtonItem = leftBarBtn
I was able to achieve what I wanted by using #Damien Romito's provided answer here:
UINavigationBar UIBarButtonItems much larger click area than required
Updated for Swift 3.0:
let buttonContainer: UIView = UIView(frame: CGRect(x: 0, y: 0, width: 27, height: 30) )
let barButton: UIButton = UIButton(frame: CGRect(x: 0, y: 0, width: 30, height: 30) )
buttonContainer.addSubview(barButton)
barButton = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
barButton(#imageLiteral(resourceName: "image"), for: UIControlState.normal)
self.navigationItem.leftBarButtonItem = UIBarButtonItem(customView: buttonContainer)
barButton(self, action: #selector(ViewController.doSomething), for: UIControlEvents.touchUpInside)
I have an UIButton and an UIView where i want to remove bottom border for the button and top border for the view. The image below show an UIButton. When I press this UIButton the UIView will be added as subview (like a dropdown menu), But I want the button and the view merge with each other so it will look like on "box".
I know how to set border width and color:
self.layer.borderWidth = 1
self.layer.borderColor = UIColor(CGColor: "#616366".CGColor).CGColor
But I don't know if it is possible to remove on border line. Hope you guys can help - Thank you
The easiest way is going to be to change your layout a little bit so that rather than adding the UIView as a subview of the UIButton you add them both as siblings to a container view, and draw the border on the container view.
Kind of like this:
let button = UIButton(frame: CGRect(x: 0, y: 0, width: 100, height: 44))
button.setTitle("Button", forState: .Normal)
button.titleLabel?.textColor = UIColor.blackColor()
let container = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 44))
container.addSubview(button)
container.frame = button.frame
container.backgroundColor = UIColor.whiteColor()
container.layer.borderWidth = 5
container.layer.borderColor = UIColor.blackColor().CGColor
let added = UIView(frame:CGRect(x: 0, y: 44, width: 100, height: 200))
added.backgroundColor = UIColor.blueColor()
container.addSubview(added)
container.frame.size.height += added.frame.size.height
XCPlaygroundPage.currentPage.liveView = container