Moving and Positioning Events – Story Tellers iOS Starter Kit Documentation

Events for Moving / Positioning Nodes

Story Tellers iOS Starter Kit 2 Documentation

Using Actions you can perform many time-based positioning events. The kit provides plenty of extra functionality though for moving or “sticking” one node to another.  Also keep in mind, your Scene can have an unlimited number of placeholder nodes (Empty Nodes with nothing but a Name property), to simply position other nodes.

Positioning Moving Animating SKNodes 1

 

Using placeholders provides a lot of device specific flexibility because you can have two different Scene files (one for the iPad and one for the iPhone) and position the same-named Placeholders differently in each scene.

  • MoveNodeToNode – A dictionary defining a key and value, being the node to move to another node’s position. The value is the node that will stay put. Note that this is a one time movement and the node doesn’t attach permanently to the node.

Positioning Moving Animating SKNodes 2

  • AnimateNodeToNode  – A dictionary defining a key and value, being the node to animate to another node’s position. The value is the node that will stay put. The move occurs over 1 second by default. You can alter that with the AnimateNodeToNodeTime
  • MoveNodeToSlot – Define a string value for the node name you want to move to the next available slot. Slots are predefined locations in the scene using placeholders (Empty Nodes) with the name of Slot0, Slot1, Slot2, and so on, up to 100. Whatever node you place using MoveNodeToSlot the kit will find the next available slot and go to it.  This could be used to automatically place inventory items in a GUI style location, or it could be used to define locations to jump to, perhaps on a map.

Positioning Moving Animating SKNodes 3

  • AnimateNodeToSlot – Same as MoveNodeToSlot, but using an animation to move the node to the slot. 1 second is the default which you can alter with the AnimateNodeToSlotTime property.
  • AttachNodeToSlot – Identical to MoveNodeToSlot but makes the moved-node permanently stick to the slot (useful if the camera is moving)
  • MoveNodeOnPath – Identical to MoveNodeToSlot but each placeholder is defined as Path0, Path1, Path2  and so on. Whatever node you move will go to the next path placeholder.
  • AnimateNodeOnPath – Same as MoveNodeOnPath, but using an animation to move the node to the slot. 1 second is the default. 1 second is the default which you can alter with the AnimateNodeToPathTime
  • MoveNodeToInventorySlot –  Identical to MoveNodeToSlot but each placeholder is defined as InventorySlot0, InventorySlot1, InventorySlot2  and so on. Whatever node you move will go to the next available placeholder.
  • AnimateNodeToInventorySlot – Same as MoveNodeToInventorySlot, but using an animation to move the node to the slot. 1 second is the default which you can alter with the AnimateNodeToInventorySlotTime
  • AttachNodeToInventorySlot –  Identical to MoveNodeToInventorySlot but makes the moved-node permanently stick to the inventory slot (useful if the camera is moving)
  • StickNodeToNode – A dictionary defining the terms of how the node will stick to the node.  See the image below for reference. Required entries are StickNode (which can be a String or Array to define multiple items) and ToNode.  Optional entries are Offset, Parallax or UseCurrentOffset. Offset and Parallax must be in { x, y } format. The default for Offset is {0,0} and the default for Parallax is {1, 1}. The example below will offset the y location by -100, so Cloud1 and Cloud2 will both be -100 from the Balloon node. You can optionally include OffsetPhone as well as Offset to make it device specific. Parallax will act as a multiplier, so in the example below, the x location of Cloud1 and Cloud2 will always match Balloon but the y value will be 60%. If you set  UseCurrentOffset to a Bool value of YES, delete the Offset value and the kit will figure out the current difference of the StickNode and ToNode nodes and use that as the offset.

Positioning Moving Animating SKNodes 4

Read more about StickNodeToNode dictionaries here.

  • RepositionBy – The key value will be the node to reposition and the value will be a String in {x, y} format. The x and y values will get added to the current position of the node. You can also do this with a “Move By” action (and perform it over a duration), so just consider this event a quick convenience.

Positioning Moving Animating SKNodes 5

 

  • RepositionBySafely – same as above, but delayed by 1/60 of a second to account for any other repositioning that might happen first.
  • MoveNodeToTouch – value of the node name to move to the touch location. This can be a String or Array to move multiple nodes.

Positioning Moving Animating SKNodes 6

 

  • MoveNodeToNodeTouched – value of the node name to move to the location of the node touched. For example, in the image below, we moved Rain to Cloud1. This is primarily intended as a TouchEvent option, but the kit will remember the last node touched, so the property could be run from any event.

Positioning Moving Animating SKNodes 7

 

  • PositionPercentageWidth – A dictionary where the key is a decimal value  (used to multiply the scene width) and reposition the value (the node). In the example below, Balloon2Icon will be at 20% the width of the screen. Note that when a camera is used, the node will actually be at 20% of the camera’s view port.

Positioning Moving Animating SKNodes 8

 

  • PositionPercentageHeight – Just like the previous property but for the height. Note that with both dictionaries (width and height) the value can also be an Array to reposition multiple nodes (see the example below).

Positioning Moving Animating SKNodes 9

 

 

 

 

 

 

 

 

If you stumbled onto this article, it is part of our documentation for the Story Tellers iOS Starter Kit 2. The kit enables you to make children’s book apps and games without writing any code! But it is Swift 2 based and compatible with iOS9 (or higher) and Xcode 7 (or higher), so kit buyers can even extend the functionality to fit their needs further. Some of what we cover in the kit documentation may apply to Xcode in general, so this article could be worth a read even if you aren’t a user. You can purchase Lifetime Updates the kit here, or subscribe Yearly to CartoonSmart and get the latest version, plus access to all of our other kits / tutorials.

We’ve also created an iBook to document the very latest properties in the kit, so be sure to download that as well.