最近在學(xué)習(xí)SpriteKit框架迎膜,涉及SKSpriteNode position屬性設(shè)置诉位,也有對anchorPoint做一些設(shè)置茵瀑。之前對這兩個重要的屬性用的不是很多昆咽,有些知識點還是有點模糊,特此記錄一下尘奏。
UIView坐標(biāo)系
關(guān)鍵點:
- position和anchorPoint都是layer屬性,都是CGPoint類型
- layer顯示到什么位置病蛉,由position決定炫加。position是相對于父坐標(biāo)系
- anchorPoint是相對于自身坐標(biāo)系
- 自身的anchorPoint和自身的position必須重合
position:
用來設(shè)置CALayer在父層中的位置
以父層的左上角為原點(0, 0)
anchorPoint稱為“定位點”瑰煎、“錨點”:
決定著CALayer身上的哪個點會在position屬性所指的位置
以自己的左上角為原點(0, 0)
它的x、y取值范圍都是0~1俗孝,默認(rèn)值為(0.5, 0.5)
栗子
SpriteKit坐標(biāo)系
關(guān)鍵點
- SKView坐標(biāo)系,坐標(biāo)遠(yuǎn)點(0,0)在左下角赋铝,往上y加 往右x加
- position和anchorPoint都是node的屬性
- anchorPoint原點(0,0)在自身左下角插勤,x和y范圍都是0-1,x往右加革骨,y往上加
- 和UIView一樣农尖,postion是相對于父坐標(biāo)系,anchorPoint相對于自身坐標(biāo)系
- position和anchorPoint必須重合
- 動畫是以anchorPoint為基準(zhǔn)
來看下以下代碼加深下印象
func createCircle() {
backgroundColor = .orange
let circle1 = SKSpriteNode(color: .blue, size: CGSize(width: 100, height: 100))
circle1.position = view!.center
circle1.anchorPoint = CGPoint(x: 0, y: 0)
addChild(circle1)
// animateNodes(circle1, type: .rotation)
let circle2 = SKSpriteNode(color: .red, size: CGSize(width: 100, height: 100))
circle2.position = view!.center
// circle2.anchorPoint = CGPoint(x: 0, y: 1)
addChild(circle2)
// animateNodes(circle2, type: .rotation)
let circle3 = SKSpriteNode(color: .purple, size: CGSize(width: 100, height: 100))
circle3.position = view!.center
circle3.anchorPoint = CGPoint(x: 1, y: 1)
addChild(circle3)
// animateNodes(circle3, type: .rotation)
let circle4 = SKSpriteNode(color: .green, size: CGSize(width: 100, height: 100))
circle4.position = view!.center
circle4.anchorPoint = CGPoint(x: 1, y: 0)
addChild(circle4)
// animateNodes(circle4, type: .rotation)
}
運(yùn)行后的效果如下(根據(jù)顏色對應(yīng)一下)
加上動畫后的效果: