Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Swap two Framer layers of different heights and reposition parent layers
# Swap two Framer layers of different heights and reposition parent layers
# Special thanks to Niels http://stackoverflow.com/questions/39240373/framerjs-layer-with-dynamic-height-importing-layers-from-sketch (much cleaner than the original solution I wrote)
# Cowritten by Emily (https://github.com/xymostech) & Nick (https://github.com/mrnickbreen) at Khan Academy (https://github.com/khan)
stackLayers = (layerList, amountToReposition = 0) ->
for layer in layerList
layer.y = layer.y + amountToReposition
resizeParents = (layer, heightDifference) ->
if !layer.parent
return
parent = layer.parent
if parent instanceof ScrollComponent
return
parentChildren = parent.children.slice()
parentChildren.sort (a, b) -> a.y - b.y
layerIndex = parentChildren.indexOf layer
layersToReposition = parentChildren.slice(layerIndex + 1)
stackLayers(layersToReposition, heightDifference)
parent.removeChild(layer)
parent.height = parent.height + heightDifference
parent.addChild(layer)
resizeParents(parent, heightDifference)
# This assumes the layers are the exact same width and may have different heights
swapLayersAndRepositionElements = (originalLayer, newLayer,
destroyOriginalLayer = false) ->
heightDifference = newLayer.height - originalLayer.height
resizeParents(originalLayer, heightDifference)
# Add new layer and remove old layer
if (destroyOriginalLayer)
originalLayer.destroy()
else
originalLayer.y = -1000
parentLayer = originalLayer.parent
if parentLayer
parentLayer.removeChild(originalLayer)
parentLayer.addChild(newLayer)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.