nice to meet you. I am studying "Coordinate System" of UIView of iOS. Frame is easy to understand, but Bounds isn't.
For example, Frame works as expected when you change origin.
Bounds does not change its position even if we change origin.
import UIKit
class ViewController: UIViewController {
var childView : UIView!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let rect = CGRect(x: 20, y: 30, width: 200, height: 200)
childView = UIView(frame: rect)
childView.backgroundColor = UIColor.red
self.view.addSubview(childView)
}
override func viewDidAppear(_ animated: Bool) {
UIView.animate(withDuration: 5, animations: {
self.childView.bounds = CGRect(x: 100, y: 150, width: 200, height: 200)
})
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
"Why do we need Bounds?" I thought. And I searched hard on the internet. So, there are some facts I found out.
Bounds literally means borderline. iOS can draw a picture only within that boundary line. As you can see in the figure above, the UIButton also has Bounds, and when it exceeds the Bounds, the picture is cut and drawn.
---- Second ----
Size of Bounds and Size of Frame are the same.
It's not important, but I tried to test it out.
---- Thirds ---- bounds.origin is also useful in View Hierarchy. But it works differently from Frame.
Frame is easy to understand. The ViewController's RootView will be 700 from top to button.
import UIKit
class ViewController: UIViewController {
var childView : UIView!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let rect = CGRect(x: 100, y: 100, width: 200, height: 200)
childView = UIView(frame: rect)
childView.backgroundColor = UIColor.red
self.view.addSubview(childView)
self.view.backgroundColor = UIColor.cyan
}
override func viewDidAppear(_ animated: Bool) {
UIView.animate(withDuration: 10, animations: {
self.view.frame = CGRect(x: 0, y: 700, width: self.view.frame.size.width, height: self.view.frame.size.height)
})
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
If you look at the Coordinate System in iOS, you can see that Frame should work like that.
However, Bounds does not move itself, but only the Subview below it. I do not understand this part.
import UIKit
class ViewController: UIViewController {
var childView : UIView!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let rect = CGRect(x: 100, y: 100, width: 200, height: 200)
childView = UIView(frame: rect)
childView.backgroundColor = UIColor.red
self.view.addSubview(childView)
self.view.backgroundColor = UIColor.cyan
}
override func viewDidAppear(_ animated: Bool) {
UIView.animate(withDuration: 10, animations: {
self.view.bounds = CGRect(x: 0, y: 700, width: self.view.frame.size.width, height: self.view.frame.size.height)
})
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
So, I searched it in google. Eventually, I found a mathematical formula for "SubView" to reposition when SuperView.origin.bounds was changed. ( 출처 : article )
CompositedPosition.x = View.frame.origin.x - Superview.bounds.origin.x;
CompositedPosition.y = View.frame.origin.y - Superview.bounds.origin.y;
By the way, why did Apple use these formulas? Basically, based on the "Coordinate System" we think,
CompositedPosition.x = View.frame.origin.x + Superview.bounds.origin.x;
CompositedPosition.y = View.frame.origin.y + Superview.bounds.origin.y;
Is not this formula more intuitive?
So, My Question are these.
- When I increase SuperView.bounds.origin.y by 700 in its original state, why does SubView move up not moving down ???
- Should I just accept the formula and memorize it?
---------------------------------------------------------------
----------------------------Edit--1----------------------------
Now I Got the concept of bounds by studying UIScrollView!
CompositedPosition.x = View.frame.origin.x - Superview.bounds.origin.x;
CompositedPosition.y = View.frame.origin.y - Superview.bounds.origin.y;
This is right.
This is a picture what I understand.
yes, I agree this picture looks dizzy sorry!
If I scroll UP the scrollview, and bounds.origin.y will increase and offset.y will increase and the subviews attached in scrollview's frame.origin.y will not change but, iOS calculate where the subviews to draw(CompositedPosition) by using that formula so! It looks like that the subviews goes UP!.
In brief, bounds change -> iOS calculate by using that formula -> draw!