swift - How can I make my level menu scrollable vertically? -
i have following level menu (as seen below). make vertically scrollable, resulting in total height double of screen (full scroll height). how can achieve this?
below code image above:
class levelmenu: skscene { let levelbuttonsize = skspritenode(imagenamed: "b1").size let levelbutton1: skspritenode = skspritenode(imagenamed: "b1") let levelbutton2: skspritenode = skspritenode(imagenamed: "b2") let levelbutton3: skspritenode = skspritenode(imagenamed: "b3") let levelbutton4: skspritenode = skspritenode(imagenamed: "b4") let levelbutton5: skspritenode = skspritenode(imagenamed: "b5") let levelbutton6: skspritenode = skspritenode(imagenamed: "b6") let levelbutton7: skspritenode = skspritenode(imagenamed: "b7") let levelbutton8: skspritenode = skspritenode(imagenamed: "b8") let levelbutton9: skspritenode = skspritenode(imagenamed: "b9") let levelbutton10: skspritenode = skspritenode(imagenamed: "b10") let levelbutton11: skspritenode = skspritenode(imagenamed: "b11") let levelbutton12: skspritenode = skspritenode(imagenamed: "b12") override init(size: cgsize){ super.init(size: size) let bg = skspritenode(imagenamed: "bg") backgroundimage.position = cgpoint(x: self.frame.midx, y: self.frame.midy) self.addchild(bg) let column1posx = levelbuttonsize.width*cdiff let column2posx = levelbuttonsize.width*cdiff + levelbuttonsize.width*2.0 let column3posx = levelbuttonsize.width*cdiff + levelbuttonsize.width*4.0 let row1posy = self.frame.height - levelbuttonsize.width*1.5 let row2posy = row1posy - levelbuttonsize.height - levelbuttonsize.width*rdiff let row3posy = row2posy - levelbuttonsize.height - levelbuttonsize.width*rdiff let row4posy = row3posy - levelbuttonsize.height - levelbuttonsize.width*rdiff levelbutton1.position = cgpoint(x: column1posx, y: row1posy) levelbutton1.zposition = 10 self.addchild(levelbutton1) levelbutton2.position = cgpoint(x: column2posx, y: row1posy) self.addchild(levelbutton2) levelbutton3.position = cgpoint(x: column3posx, y: row1posy) self.addchild(levelbutton3) levelbutton4.position = cgpoint(x: column1posx, y: row2posy) self.addchild(levelbutton4) levelbutton5.position = cgpoint(x: column2posx, y: row2posy) self.addchild(levelbutton5) levelbutton6.position = cgpoint(x: column3posx, y: row2posy) self.addchild(levelbutton6) levelbutton7.position = cgpoint(x: column1posx, y: row3posy) self.addchild(levelbutton7) levelbutton8.position = cgpoint(x: column2posx, y: row3posy) self.addchild(levelbutton8) levelbutton9.position = cgpoint(x: column3posx, y: row3posy) self.addchild(levelbutton9) levelbutton10.position = cgpoint(x: column1posx, y: row4posy) self.addchild(levelbutton10) levelbutton11.position = cgpoint(x: column2posx, y: row4posy) self.addchild(levelbutton11) levelbutton12.position = cgpoint(x: column3posx, y: row4posy) self.addchild(levelbutton12) }
update
based on ron myschuk's solution, code below show's i've been able achieve , this link shows .gif of issue having currently, screen scrolls @ top of menu.
class lmscene: skscene { let levelbuttonsize = skspritenode(imagenamed: "b1").size let levelbutton1: skspritenode = skspritenode(imagenamed: "b1") let levelbutton2: skspritenode = skspritenode(imagenamed: "b2") let levelbutton3: skspritenode = skspritenode(imagenamed: "b3") let levelbutton4: skspritenode = skspritenode(imagenamed: "b4") let levelbutton5: skspritenode = skspritenode(imagenamed: "b5") let levelbutton6: skspritenode = skspritenode(imagenamed: "b6") let levelbutton7: skspritenode = skspritenode(imagenamed: "b7") let levelbutton8: skspritenode = skspritenode(imagenamed: "b8") let levelbutton9: skspritenode = skspritenode(imagenamed: "b9") let levelbutton10: skspritenode = skspritenode(imagenamed: "b10") let levelbutton11: skspritenode = skspritenode(imagenamed: "b11") let levelbutton12: skspritenode = skspritenode(imagenamed: "b12") let levelbutton13: skspritenode = skspritenode(imagenamed: "b13") let levelbutton14: skspritenode = skspritenode(imagenamed: "b14") let levelbutton15: skspritenode = skspritenode(imagenamed: "b15") let levelbutton16: skspritenode = skspritenode(imagenamed: "b16") let levelbutton17: skspritenode = skspritenode(imagenamed: "b17") let levelbutton18: skspritenode = skspritenode(imagenamed: "b18") private var scrollcell = skspritenode() private var moveamtx: cgfloat = 0 private var moveamty: cgfloat = 0 private let minimum_detect_distance: cgfloat = 30 private var initialposition: cgpoint = cgpoint.zero private var initialtouch: cgpoint = cgpoint.zero private var resettingslider = false override init(size: cgsize){ super.init(size: size) scrollcell = skspritenode(color: .blue, size: cgsize(width: self.size.width, height: 2*self.size.height - self.frame.width*0.24734)) scrollcell.position = cgpoint(x: 0, y: 0) scrollcell.anchorpoint = cgpoint.zero scrollcell.zposition = 0 self.addchild(scrollcell) let backgroundimage = skspritenode(imagenamed: "bg") backgroundimage.position = cgpoint(x: self.frame.midx, y: self.frame.midy) self.addchild(backgroundimage) let column1posx = levelbuttonsize.width/2 + self.frame.width*0.14855 let column2posx = 3*levelbuttonsize.width/2 + 2*self.frame.width*0.14855 let column3posx = 5*levelbuttonsize.width/2 + 3*self.frame.width*0.14855 let row1posy = self.frame.height - levelbuttonsize.height/2 - self.frame.width*0.24734 let row2posy = row1posy - levelbuttonsize.height - self.frame.width*0.24734 let row3posy = row2posy - levelbuttonsize.height - self.frame.width*0.24734 let row4posy = row3posy - levelbuttonsize.height - self.frame.width*0.24734 let row5posy = row4posy - levelbuttonsize.height - self.frame.width*0.24734 let row6posy = row5posy - levelbuttonsize.height - self.frame.width*0.24734 levelbutton1.position = cgpoint(x: column1posx, y: row1posy) levelbutton1.zposition = 10 scrollcell.addchild(levelbutton1) levelbutton2.position = cgpoint(x: column2posx, y: row1posy) levelbutton2.zposition = 10 scrollcell.addchild(levelbutton2) levelbutton3.position = cgpoint(x: column3posx, y: row1posy) levelbutton3.zposition = 10 scrollcell.addchild(levelbutton3) levelbutton4.position = cgpoint(x: column1posx, y: row2posy) levelbutton4.zposition = 10 scrollcell.addchild(levelbutton4) levelbutton5.position = cgpoint(x: column2posx, y: row2posy) levelbutton5.zposition = 10 scrollcell.addchild(levelbutton5) levelbutton6.position = cgpoint(x: column3posx, y: row2posy) levelbutton6.zposition = 10 scrollcell.addchild(levelbutton6) levelbutton7.position = cgpoint(x: column1posx, y: row3posy) levelbutton7.zposition = 10 scrollcell.addchild(levelbutton7) levelbutton8.position = cgpoint(x: column2posx, y: row3posy) levelbutton8.zposition = 10 scrollcell.addchild(levelbutton8) levelbutton9.position = cgpoint(x: column3posx, y: row3posy) levelbutton9.zposition = 10 scrollcell.addchild(levelbutton9) levelbutton10.position = cgpoint(x: column1posx, y: row4posy) levelbutton10.zposition = 10 scrollcell.addchild(levelbutton10) levelbutton11.position = cgpoint(x: column2posx, y: row4posy) levelbutton11.zposition = 10 scrollcell.addchild(levelbutton11) levelbutton12.position = cgpoint(x: column3posx, y: row4posy) levelbutton12.zposition = 10 scrollcell.addchild(levelbutton12) levelbutton13.position = cgpoint(x: column1posx, y: row5posy) levelbutton13.zposition = 10 scrollcell.addchild(levelbutton13) levelbutton14.position = cgpoint(x: column2posx, y: row5posy) levelbutton14.zposition = 10 scrollcell.addchild(levelbutton14) levelbutton15.position = cgpoint(x: column3posx, y: row5posy) levelbutton15.zposition = 10 scrollcell.addchild(levelbutton15) levelbutton16.position = cgpoint(x: column1posx, y: row6posy) levelbutton16.zposition = 10 scrollcell.addchild(levelbutton16) levelbutton17.position = cgpoint(x: column2posx, y: row6posy) levelbutton17.zposition = 10 scrollcell.addchild(levelbutton17) levelbutton18.position = cgpoint(x: column3posx, y: row6posy) levelbutton18.zposition = 10 scrollcell.addchild(levelbutton18) } override func touchesbegan(_ touches: set<uitouch>, event: uievent?) { if let touch = touches.first uitouch! { if let touch = touches.first uitouch! { self.scrollcell.removeallactions() initialtouch = touch.location(in: self.scene!.view) moveamty = 0 initialposition = self.scrollcell.position } } } override func touchesmoved(_ touches: set<uitouch>, event: uievent?) { if let touch = touches.first uitouch! { let movingpoint: cgpoint = touch.location(in: self.scene!.view) moveamty = movingpoint.y - initialtouch.y scrollcell.position = cgpoint(x: initialposition.x, y: initialposition.y - moveamty) } } override func touchesended(_ touches: set<uitouch>, event: uievent?) { checkforresettingslider() ymoveactions(moveto: -moveamty) } func checkforresettingslider() { if resettingslider { return } let scrolldif: cgfloat = (scrollcell.size.height - self.size.height) / 2.0 if scrollcell.position.y > scrolldif { let move: skaction = skaction.moveto(y: scrolldif, duration: 0.3) move.timingmode = .easeout scrollcell.run(move, completion: { self.resettingslider = false }) } if scrollcell.position.y < -scrolldif { let move: skaction = skaction.moveto(y: 0 - scrolldif, duration: 0.3) move.timingmode = .easeout scrollcell.run(move, completion: { self.resettingslider = false }) } } func ymoveactions(moveto: cgfloat) { let move: skaction = skaction.moveby(x: 0, y: (moveto * 1.5), duration: 0.3) move.timingmode = .easeout self.scrollcell.run(move, completion: { self.checkforresettingslider() }) } required init?(coder adecoder: nscoder) { fatalerror("init(coder:) has not been implemented") } }
here code use scroll vertically, i've adapted fit menu. doesn't line items, it'll give somewhere start. , it'll show how figure out on own.
edit: i've updated code use these funds instead. still declare buttons same way call createmenu func create menu. looped auto adjusts if change number of menu items. thing have aware of is; if add or remove buttons change array @ top of createmenu accordingly. adjust padding variable how vertical space want between items
func createmenu() { let buttons = [levelbutton1, levelbutton2, levelbutton3, levelbutton4, levelbutton5, levelbutton6, levelbutton7, levelbutton8, levelbutton9, levelbutton10, levelbutton11, levelbutton12, levelbutton13, levelbutton14, levelbutton15, levelbutton16, levelbutton17, levelbutton18] let padding: cgfloat = 400 let numberofrows = cgfloat(buttons.count / 3) scrollcell = skspritenode(color: .blue, size: cgsize(width: 1024, height: levelbuttonsize.height * numberofrows + padding * numberofrows)) scrollcell.position = cgpoint(x: 0 - self.size.width / 4, y: 0 - (scrollcell.size.height - self.size.height / 2)) scrollcell.anchorpoint = cgpoint.zero scrollcell.zposition = 0 self.addchild(scrollcell) // let backgroundimage = skspritenode(imagenamed: "bg") // backgroundimage.position = cgpoint(x: self.frame.midx, y: self.frame.midy) // self.addchild(backgroundimage) let column1posx = scrollcell.size.width / 3 / 2 let column2posx = scrollcell.size.width / 2 let column3posx = scrollcell.size.width / 3 / 2 + scrollcell.size.width / 3 * 2 var colcount = 0 var rowcount = 0 button in buttons { var posx: cgfloat = column2posx if colcount == 0 { posx = column1posx } else if colcount == 2 { posx = column3posx colcount = -1 } let indexoffset = cgfloat(rowcount) * (levelbuttonsize.height + padding) let posy = scrollcell.size.height - levelbuttonsize.height / 2 - (indexoffset + padding / 2) button.position = cgpoint(x: posx, y: posy) button.setscale(0.5) button.zposition = 10 scrollcell.addchild(button) if colcount == -1 { rowcount += 1 } colcount += 1 } } override func touchesbegan(_ touches: set<uitouch>, event: uievent?) { if let touch = touches.first uitouch! { self.scrollcell.removeallactions() initialtouch = touch.location(in: self.scene!.view) moveamty = 0 initialposition = self.scrollcell.position } } override func touchesmoved(_ touches: set<uitouch>, event: uievent?) { if let touch = touches.first uitouch! { let movingpoint: cgpoint = touch.location(in: self.scene!.view) moveamty = movingpoint.y - initialtouch.y scrollcell.position = cgpoint(x: initialposition.x, y: initialposition.y - moveamty) } } override func touchesended(_ touches: set<uitouch>, event: uievent?) { checkforresettingslider() ymoveactions(moveto: -moveamty) } func checkforresettingslider() { let toppos: cgfloat = scrollcell.size.height - self.size.height / 2 let bottompos = 0 - (self.size.height / 2) if scrollcell.position.y > bottompos { let move = skaction.moveto(y: bottompos, duration: 0.3) move.timingmode = .easeout scrollcell.run(move) } if scrollcell.position.y < -toppos { let move = skaction.moveto(y: -toppos, duration: 0.3) move.timingmode = .easeout scrollcell.run(move) } } func ymoveactions(moveto: cgfloat) { let move = skaction.moveby(x: 0, y: (moveto * 1.5), duration: 0.3) move.timingmode = .easeout self.scrollcell.run(move, completion: { self.checkforresettingslider() }) }
Comments
Post a Comment