Hi i have navigation item in there is a view which contains two labels i have added userInteractionEnabled for the view inside the navigation element (IBoutleted as navigationView)
navigationView.isUserInteractionEnabled = true
mainTitleClicked = UITapGestureRecognizer(target: self, action: #selector(mainTitleTapped))
self.navigationView.addGestureRecognizer(mainTitleClicked)
This was working in IOS 10 but when i run the same code in xcode 9 ios 11 UI is messed up and gesture is not getting recognised
IOS 10 Version
IOS 11 version
What should i change to make it work on ios 11
Thanks for the help
I Solved it By adding the following code
if #available(iOS 11.0, *) {
self.navigationController?.navigationBar.prefersLargeTitles = false
self.navigationItem.largeTitleDisplayMode = .automatic
var width = navigationView.sizeThatFits(CGSize(width: CGFloat.greatestFiniteMagnitude, height: CGFloat.greatestFiniteMagnitude)).width - 15.0
let height = navigationView.sizeThatFits(CGSize(width: CGFloat.greatestFiniteMagnitude, height: CGFloat.greatestFiniteMagnitude)).height
let screenSize: CGRect = UIScreen.main.bounds
let windowWidth = screenSize.width
width = windowWidth * 0.55
let widthConstraint = navigationView.widthAnchor.constraint(equalToConstant: width)
let heightConstraint = navigationView.heightAnchor.constraint(equalToConstant: height)
heightConstraint.isActive = true
widthConstraint.isActive = true
}
Making height and width constraint active was a answer given in another question i currently don't have the link to it will post the link in the edit (Currently i am unable to find that question)
I have this same problem and solved with this code too:
if #available(iOS 11.0, *) {
self.navigationController?.navigationBar.prefersLargeTitles = false
self.navigationItem.largeTitleDisplayMode = .automatic
var width = popUserChatView.sizeThatFits(CGSize(width: CGFloat.greatestFiniteMagnitude, height: CGFloat.greatestFiniteMagnitude)).width - 15.0
let height = popUserChatView.sizeThatFits(CGSize(width: CGFloat.greatestFiniteMagnitude, height: CGFloat.greatestFiniteMagnitude)).height
let screenSize: CGRect = UIScreen.main.bounds
let windowWidth = screenSize.width
width = windowWidth * 0.55
let widthConstraint = popUserChatView.widthAnchor.constraint(equalToConstant: width)
let heightConstraint = popUserChatView.heightAnchor.constraint(equalToConstant: height)
heightConstraint.isActive = true
widthConstraint.isActive = true
}
calling in ViewDidLoad()
Related
I am on Swift 5.
The goal is to center a UIImageView vertically inside a view. Currently it looks like
Note all the image bubbles are running off of the cell.
This is the code that lead to this:
let imageView = UIImageView()
let width = self.frame.width
let height = self.frame.height
let img_width = height //* 0.8
let img_height = height
let y = (height - img_height)/2
let x = width*0.05
imageView.frame = CGRect(
x: x
, y: CGFloat(y)
, width: img_width
, height: img_height
)
let rounded = imageView
.makeRounded()
.border(width:1.0, color:Color.white.cgColor)
self.addSubview(rounded)
The imageView extension functions are:
func makeRounded() -> UIImageView {
self.layer.borderWidth = 0.5
self.layer.masksToBounds = false
self.layer.borderColor = Color.white.cgColor
self.layer.cornerRadius = self.frame.width/2
self.clipsToBounds = true
// see https://developer.apple.com/documentation/uikit/uiview/contentmode
self.contentMode = .scaleAspectFill
return self
}
func border( width: CGFloat, color: CGColor ) -> UIImageView{
self.layer.borderWidth = width
self.layer.borderColor = color
return self
}
Which is very vanilla.
This is odd because I laid out the textview vertically in the exact same way, that is: (parentHeight - childHeight)/2, and it is centered. You can see it in the blue text boxes in cell two and three.
____ EDIT _______
This is how I laid out the cell
let data = dataSource[ row - self._data_source_off_set ]
let cell = tableView.dequeueReusableCell(withIdentifier: "OneUserCell", for: indexPath) as! OneUserCell
// give uuid and set delegate
cell.uuid = data.uuid
cell.delegate = self
// render style: this must be set
cell.hasFooter = false //true
cell.imageSource = data
cell.headerTextSource = data
cell.footerTextSource = data
// color schemes
cell.backgroundColor = Color.offWhiteLight
cell.selectionColor = Color.graySecondary
Add these constraints to you imageView and remove frame and its calculations
self.contentView.addSubview(rounded)
self.mimageView.translatesAutoresizingMaskIntoConstraints = false
self.mimageView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor,constant: 20).isActive = true
self.mimageView.centerYAnchor.constraint(equalTo: contentView.centerYAnchor).isActive = true
self.mimageView.heightAnchor.constraint(equalTo: contentView.heightAnchor).isActive = true
self.mimageView.widthAnchor.constraint(equalTo: contentView.heightAnchor).isActive = true
Note : Not created ViewController in storyboard
I created ViewController programmatically after giving support for safe guard now my problem is that how i can got his height?
I try following thing but no luck
let guide = view.safeAreaLayoutGuide
let height = guide.layoutFrame.size.height
print("\(height)")
print("\(self.view.frame.height)")
height = 812.0, self.view height = 812.0
Is there any other way?
A safeAreaLayoutGuide, which is iOS 11+, is meant for auto layout and to try to get a frame is close to trying to make orange juice from a lemon.
If what you want is to find out is what you can safely use for a frame, maybe try something like this:
Create a transparent view:
let mySafeView = UIView()
override func viewDidLoad() {
super.viewDidLoad()
mySafeView.backgroundColor = UIColor.clear
mySafeView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(mySafeView)
// if needed, send this view to the back of the hierarchy
view.sendSubview(toBack: mySafeView)
}
Next, in your constraint-building code attach it to the true anchors:
// create generic layout guides
let layoutGuideTop = UILayoutGuide()
view.addLayoutGuide(layoutGuideTop)
let layoutGuideBottom = UILayoutGuide()
view.addLayoutGuide(layoutGuideBottom)
let margins = view.layoutMarginsGuide
view.addLayoutGuide(margins)
// get correct top/bottom margins based on iOS version
if #available(iOS 11, *) {
let guide = view.safeAreaLayoutGuide
layoutGuideTop.topAnchor.constraintEqualToSystemSpacingBelow(guide.topAnchor, multiplier: 1.0).isActive = true
layoutGuideBottom.bottomAnchor.constraintEqualToSystemSpacingBelow(guide.bottomAnchor, multiplier: 1.0).isActive = true
} else {
layoutGuideTop.topAnchor.constraint(equalTo: topLayoutGuide.bottomAnchor).isActive = true
layoutGuideBottom.bottomAnchor.constraint(equalTo: bottomLayoutGuide.topAnchor).isActive = true
}
mySafeView.topAnchor.constraint(equalTo: layoutGuideTop.topAnchor).isActive = true
mySafeView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
mySafeView.bottomAnchor.constraint(equalTo: layoutGuideBottom.bottomAnchor).isActive = true
mySafeView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
Finally, get the frame size:
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
print(mySafeView.frame)
}
On an iPhone 6 plus running iOS 11.1 you get:
(0.0, 28.0, 414.0, 716.0)
On an iPhone 6 plus running iOS 9.0 you get:
(0.0, 20.0, 414.0, 716.0)
First off you can't do it in the viewDidLoad. You have to wait till viewDidLayoutSubviews
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
myGlobalVars.sceneRect = view.frame
if #available(iOS 11.0, *) {
myGlobalVars.topSafeArea = view.safeAreaInsets.top
myGlobalVars.bottomSafeArea = view.safeAreaInsets.bottom
} else {
myGlobalVars.topSafeArea = topLayoutGuide.length
myGlobalVars.bottomSafeArea = bottomLayoutGuide.length
}
}
I have one UIScrollView (IBOutlet) with success constraint inside a storyboard. then I programmatically create UIButton and put them as a subview to UIScrollView. how do I programmatically set these UIButton constraints so their height and size would tally with their super view?
class ViewController: UIViewController {
#IBOutlet weak var aScrollView: UIScrollView!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
var xCoord: CGFloat = 5
let yCoord: CGFloat = 5
let buttonWidth:CGFloat = 100
let buttonHeight: CGFloat = 100
let gapBetweenButtons: CGFloat = 10
var itemCount = 0
// MARK: - filter buttons
for i in 0..<6 {
itemCount = i
let aButton = UIButton(type: .custom)
aButton.frame = CGRect(x: xCoord, y: yCoord, width: buttonWidth, height: buttonHeight)
aButton.backgroundColor = UIColor.blue
aButton.layer.cornerRadius = aButton.frame.size.width / 2
aButton.clipsToBounds = true
xCoord += buttonWidth + gapBetweenButtons
aScrollView.addSubview(aButton)
}
}
Try this --
This is just an idea about how to add constraint programmatically.
For more understanding you can go through below link - https://developer.apple.com/reference/appkit/nslayoutanchor
let myButton = UIButton()
self.aScrollView.addSubview(myButton)
self.view.translatesAutoresizingMaskIntoConstraints = false
let margins = self.view.layoutMarginsGuide
myButton.leadingAnchor.constraint(equalTo: forView. aScrollView.leadingAnchor, constant: 5).active = true
myButton.topAnchor.constraint(equalTo: forView. aScrollView.topAnchor, constant: 5).active = true
myButton.heightAnchor.constraintEqualToConstant(100.0).active = true
myButton.widthAnchor.constraintEqualToConstant(100.0).active = true
Change your code to:
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
var xCoord: CGFloat = 5
let yCoord: CGFloat = 5
let gapBetweenButtons: CGFloat = 10
let buttonCount = 6
let buttonWidth = (aScrollView.frame.width - CGFloat(buttonCount - 1) * gapBetweenButtons - xCoord - xCoord) / CGFloat(buttonCount) // - (2 * xCoord) = - (margin left + margin right).
let buttonHeight = buttonWidth
var itemCount = 0
// MARK: - filter buttons
for i in 0..<buttonCount {
itemCount = i
let aButton = UIButton(type: .custom)
aButton.frame = CGRect(x: xCoord, y: yCoord, width: buttonWidth, height: buttonHeight)
aButton.backgroundColor = UIColor.blue
aButton.layer.cornerRadius = aButton.frame.size.width / 2
aButton.clipsToBounds = true
xCoord += buttonWidth + gapBetweenButtons
aScrollView.addSubview(aButton)
}
}
This is how to do it. I made a video tutorial for you add unbutton programmatically to scrollview in iOS, swift. please refer the link.
add a scrollview (add constraints -> top, bottom, left, right).
then add a view to your scroll view (add constraints -> top, bottom, left, right, width, height and set width and height as you need. explain in the video)
add those two views as subviews.
then add the button and its constraints programmatically.
follow the video tutorial. add UIButton(outlet) to scrollview programmatically
I have this code for my UIButton. What should I change in my CGRectMake to set my UIButton in the center of the screen for all screen sizes?
let loginBtn = UIButton(frame: CGRectMake(60, 360, 240, 40))
loginBtn.layer.borderColor = UIColor.whiteColor().CGColor
loginBtn.layer.borderWidth = 2
loginBtn.titleLabel!.font = UIFont.systemFontOfSize(24)
loginBtn.tintColor = UIColor.whiteColor()
loginBtn.setTitle("Login", forState: UIControlState.Normal)
self.view.addSubview(loginBtn)
For your place uibutton center of your view , update your cgrectmake as bleow..
CGRectMake((self.view.frame.size.width - 240) / 2, (self.view.frame.size.height - 40) / 2,240,40)
or
You can add one line after your code
loginBtn.center = self.view.center
For SignUp Button :
signup.frame = loginBtn.bounds
signup.center = CGPointMake(loginBtn.center.x, loginBtn.center.y + loginBtn.frame.size.height + 10)
Set your UIButton's center to the center of the view it is in.
loginBtn.center = view.center
You need add the following line prior to self.view.addSubview(loginBtn).
loginBtn.center = self.view.center
This will center the button across the whole screen, not just the view it's in:
let verticalCenter: CGFloat = UIScreen.mainScreen().bounds.size.height / 2.0
let horizontalCenter: CGFloat = UIScreen.mainScreen().bounds.size.width / 2.0
loginBtn.center = CGPoint(x: horizontalCenter, y: verticalCenter)
Edit:
As #LeoDabus pointed out, this can be compacted by using the midX and midY properties on CGRect:
let verticalCenter: CGFloat = UIScreen.mainScreen().bounds.midY
let horizontalCenter: CGFloat = UIScreen.mainScreen().bounds.midX
For Swift 4
#IBOutlet weak var btStart: UIButton!
on the middle of any screen (any device)
btStart.center = self.view.center
OR
btStart.center.x = self.view.center.x
btStart.center.y = self.view.center.y
on the center by x and 25 percent from top
btStart.center.x = self.view.center.x
btStart.center.y = self.view.center.y / 2
I found this to be the best solution for me..
Swift 4
myButton.center.x = self.view.frame.midX
myButton.center.y = self.view.frame.midY
I found if I need to center things quite often, I usually use a generic solution.
extension UIViewController {
func centerComponent(_ component: AnyObject) {
let customView = component as! UIView
customView.center.x = self.view.frame.midX
customView.center.y = self.view.frame.midY
}
}
then you can call it from any UIViewcontroller inside a function like so:
centerComponent(myButton)
I'm looking for examples/tutorials/framework explaining how to do a navigation bar/controller which slide to left and right like Tinder.app and Twitter.app
I'm not talking about the faces swiping thing of Tinder, I'm talking about the top menu and the views we can slide entirely to left or right to go smoothly to other screens of the app like profile, moments, etc
I'm looking around but not find anything really interesting until then, I hope you can point me out something.
I'm afraid that the complete solution to this is quite a bit beyond the scope of a single question.
However in the interest of trying to help you I think it's worth looking into this - That's a link to Cocoa Controls, a website which people build ready to go controls you can just drop into your app. (it's quite a cool site really).
That particular link is to MSSlidingPanelController. Which I think is exactly what you are looking for. The source code is clearly visible so you can see exactly what's required to get the effect you are looking for.
Here are a few other examples. Hope this helps.
MSSlidingPanelController is not what you are looking for. These are "drawer views", which only allows user to swipe to a certain drawer.
TwitterPagingViewer and SwiftPagingNav is exactly like the one on Twitter, only more complicated.
Tinder seems to be using a UIPageViewController with hidden dots, which is done by deleting these methods:
presentationCountForPageViewController
presentationIndexForPageViewController
Here is a good tutorial:
https://www.youtube.com/watch?v=8bltsDG2ENQ
Here is a great repo:
https://github.com/goktugyil/EZSwipeController
If you need it in Swift, I've created this one
(it also works on any screen resolution vs just iPhone 4/5/5s like the other example)
https://github.com/aubrey/SwiftPagingNav
class PageViewController: UIViewController, UIScrollViewDelegate {
var scrollView:UIScrollView!
var pageControl:UIPageControl!
var navbarView:UIView!
var navTitleLabel1:UILabel!
var navTitleLabel2:UILabel!
var navTitleLabel3:UILabel!
var view1:UIView!
var view2:UIView!
var view3:UIView!
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.lightGrayColor()
//Creating some shorthand for these values
var wBounds = self.view.bounds.width
var hBounds = self.view.bounds.height
// This houses all of the UIViews / content
scrollView = UIScrollView()
scrollView.backgroundColor = UIColor.clearColor()
scrollView.frame = self.view.frame
scrollView.pagingEnabled = true
scrollView.showsHorizontalScrollIndicator = false
scrollView.delegate = self
scrollView.bounces = false
self.view.addSubview(scrollView)
self.scrollView.contentSize = CGSize(width: self.view.bounds.size.width * 3, height: hBounds/2)
//Putting a subview in the navigationbar to hold the titles and page dots
navbarView = UIView()
self.navigationController?.navigationBar.addSubview(navbarView)
//Paging control is added to a subview in the uinavigationcontroller
pageControl = UIPageControl()
pageControl.frame = CGRect(x: 0, y: 35, width: 0, height: 0)
pageControl.backgroundColor = UIColor.whiteColor()
pageControl.numberOfPages = 3
pageControl.currentPage = 0
pageControl.currentPageIndicatorTintColor = UIColor(red:0.325, green:0.667, blue:0.922, alpha: 1)
pageControl.pageIndicatorTintColor = UIColor.whiteColor()
self.navbarView.addSubview(pageControl)
//Titles for the nav controller (also added to a subview in the uinavigationcontroller)
//Setting size for the titles. FYI changing width will break the paging fades/movement
var titleSize = CGRect(x: 0, y: 8, width: wBounds, height: 20)
navTitleLabel1 = UILabel()
navTitleLabel1.frame = titleSize
navTitleLabel1.text = "Home"
navTitleLabel1.textAlignment = NSTextAlignment.Center
self.navbarView.addSubview(navTitleLabel1)
navTitleLabel2 = UILabel()
navTitleLabel2.frame = titleSize
navTitleLabel2.text = "Discover"
navTitleLabel2.textAlignment = NSTextAlignment.Center
self.navbarView.addSubview(navTitleLabel2)
navTitleLabel3 = UILabel()
navTitleLabel3.frame = titleSize
navTitleLabel3.text = "Activity"
navTitleLabel3.textAlignment = NSTextAlignment.Center
self.navbarView.addSubview(navTitleLabel3)
//Views for the scrolling view
//This is where the content of your views goes (or you can subclass these and add them to ScrollView)
view1 = UIView()
view1.backgroundColor = UIColor(red:0.325, green:0.667, blue:0.922, alpha: 1)
view1.frame = CGRectMake(0, 0, wBounds, hBounds)
self.scrollView.addSubview(view1)
self.scrollView.bringSubviewToFront(view1)
//Notice the x position increases per number of views
view2 = UIView()
view2.backgroundColor = UIColor(red:0.231, green:0.529, blue:0.757, alpha: 1)
view2.frame = CGRectMake(wBounds, 0, wBounds, hBounds)
self.scrollView.addSubview(view2)
self.scrollView.bringSubviewToFront(view2)
//Notice the x position increases yet again (wBounds * 2)
view3 = UIView()
view3.backgroundColor = UIColor(red:0.529, green:0.600, blue:0.647, alpha: 1)
view3.frame = CGRectMake(wBounds * 2, 0, wBounds, hBounds)
self.scrollView.addSubview(view3)
self.scrollView.bringSubviewToFront(view3)
}
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
navbarView.frame = CGRect(x: 0, y: 0, width: self.view.bounds.width, height: 44)
}
func scrollViewDidScroll(scrollView: UIScrollView) {
var xOffset: CGFloat = scrollView.contentOffset.x
//Setup some math to position the elements where we need them when the view is scrolled
var wBounds = self.view.bounds.width
var hBounds = self.view.bounds.height
var widthOffset = wBounds / 100
var offsetPosition = 0 - xOffset/widthOffset
//Apply the positioning values created above to the frame's position based on user's scroll
navTitleLabel1.frame = CGRectMake(offsetPosition, 8, wBounds, 20)
navTitleLabel2.frame = CGRectMake(offsetPosition + 100, 8, wBounds, 20)
navTitleLabel3.frame = CGRectMake(offsetPosition + 200, 8, wBounds, 20)
//Change the alpha values of the titles as they are scrolled
navTitleLabel1.alpha = 1 - xOffset / wBounds
if (xOffset <= wBounds) {
navTitleLabel2.alpha = xOffset / wBounds
} else {
navTitleLabel2.alpha = 1 - (xOffset - wBounds) / wBounds
}
navTitleLabel3.alpha = (xOffset - wBounds) / wBounds
}
func scrollViewDidEndDecelerating(scrollView: UIScrollView) {
var xOffset: CGFloat = scrollView.contentOffset.x
//Change the pageControl dots depending on the page / offset values
if (xOffset < 1.0) {
pageControl.currentPage = 0
} else if (xOffset < self.view.bounds.width + 1) {
pageControl.currentPage = 1
} else {
pageControl.currentPage = 2
}
}
}