MoKuhn

iOS Lockscreen Framer

Nov 1st, 2018
671
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. # sketch import
  2. $ = Framer.Importer.load("imported/Tobi@2x", scale: 1)
  3. #var
  4. counter = 1
  5.  
  6.  
  7. #anzeige code / clipboard
  8. eq = new TextLayer
  9.     fontFamily: "Roboto"
  10.     fontWeight: 400
  11.     fontSize: 12
  12.     height: 21
  13.     lineHeight: 1
  14.     text: "0"
  15.     textAlign: "center"
  16.     color: "#fff"
  17.     x: 213
  18.     width: 80
  19.     y: 8
  20.  
  21. #feedback
  22. pinWrap = new Layer
  23.         height: 0
  24. genratePins = ->
  25.     pins = []
  26.     for i in [0...counter]
  27.         pin = new Layer
  28.             borderRadius: 100
  29.             y: 141
  30.             x:  114 +44 * i
  31.             borderRadius: 100
  32.             backgroundColor: "#fff"
  33.             opacity: 1
  34.             width: 14
  35.             height: 14
  36.             parent: pinWrap
  37.         pins.push(pin)
  38. #wiggle animation
  39. shakeR1 = new Animation pinWrap,
  40.     x: -4
  41.     options:
  42.         time: 0.1
  43. shakeL1 = new Animation pinWrap,
  44.     x: +4
  45.     options:
  46.         time: 0.1
  47. shakeR2 = new Animation pinWrap,
  48.     x: -4
  49.     options:
  50.         time: 0.1
  51. shakeL2 = shakeR1.reverse()
  52. #animations-loop
  53. shakeR1.onAnimationEnd ->
  54.     shakeL1.start()
  55. shakeL1.onAnimationEnd ->
  56.     shakeR2.start()
  57. shakeR2.onAnimationEnd ->
  58.     shakeL2.start()
  59. shakeL2.onAnimationEnd ->
  60. #array leeren
  61.     pinWrap.destroy()
  62.     pinWrap = new Layer
  63.         height: 0
  64.  
  65. #interaktionen
  66. $.no1.onTap ->
  67.     genratePins()
  68.     eq.text = eq.text + "1"
  69.     counter = counter+ 1
  70.     if counter > 4
  71.         eq.text = 0
  72.         counter = 1
  73.         shakeR1.start()
  74. $.no2.onTap ->
  75.     genratePins()
  76.     eq.text = eq.text + "2"
  77.     counter = counter+ 1
  78.     if counter > 4
  79.         eq.text = 0
  80.         counter = 1
  81.         shakeR1.start()
  82. $.no3.onTap ->
  83.     genratePins()
  84.     eq.text = eq.text + "3"
  85.     counter = counter+ 1
  86.     if counter > 4
  87.         eq.text = 0
  88.         counter = 1
  89.         shakeR1.start()
  90. $.no4.onTap ->
  91.     genratePins()
  92.     eq.text = eq.text + "4"
  93.     counter = counter+ 1
  94.     if counter > 4 && eq.text != "01234"
  95.         eq.text = 0
  96.         counter = 1
  97.         shakeR1.start()
  98. #unlock; hier pin ändern
  99.     if counter > 4 && eq.text == "01234"
  100.         pinWrap.animate
  101.             opacity: 0
  102.             options:
  103.                 time: 0.3
  104.         pinWrap = new Layer
  105.             height: 0
  106.         eq.text = 0
  107.         counter = 1
  108.         $.lockscreen.animate
  109.             y: -667
  110.             options:
  111.                 delay: 0.5
  112.                 time: 0.35
  113. $.no5.onTap ->
  114.     genratePins()
  115.     eq.text = eq.text + "5"
  116.     counter = counter+ 1
  117.     if counter > 4
  118.         eq.text = 0
  119.         counter = 1
  120.         shakeR1.start()
  121. $.no6.onTap ->
  122.     genratePins()
  123.     eq.text = eq.text + "6"
  124.     counter = counter+ 1
  125.     if counter > 4
  126.         eq.text = 0
  127.         counter = 1
  128.         shakeR1.start()
  129. $.no7.onTap ->
  130.     genratePins()
  131.     eq.text = eq.text + "7"
  132.     counter = counter+ 1
  133.     if counter > 4
  134.         eq.text = 0
  135.         counter = 1
  136.         shakeR1.start()
  137. $.no8.onTap ->
  138.     genratePins()
  139.     eq.text = eq.text + "8"
  140.     counter = counter+ 1
  141.     if counter > 4
  142.         eq.text = 0
  143.         counter = 1
  144.         shakeR1.start()
  145. $.no9.onTap ->
  146.     genratePins()
  147.     eq.text = eq.text + "9"
  148.     counter = counter+ 1
  149.     if counter > 4
  150.         eq.text = 0
  151.         counter = 1
  152.         shakeR1.start()
  153. $.no0.onTap ->
  154.     genratePins()
  155.     eq.text = eq.text + "0"
  156.     counter = counter+ 1
  157.     if counter > 4
  158.         eq.text = 0
  159.         counter = 1
  160.         shakeR1.start()
  161.  
  162. #unlocked
  163. $.Home.x = 0
  164. $.lock.onTap ->
  165.     $.lockscreen.animate
  166.         y: 0
  167.         options:
  168.             time: 0.35
  169. #cancel
  170. $.Cancel.onTap ->
  171.     pinWrap.destroy()
  172.     eq.text = 0
  173.     counter = 1
  174. #pin: 1234
  175. #wiggle-animation geht nur beim ersten mal, da Framer nicht checkt, dass der gelöschte layer wiederhergestellt wird 🤷🏻‍♂️
  176. #freuen uns auf den sixer bier! 🍻
RAW Paste Data

Adblocker detected! Please consider disabling it...

We've detected AdBlock Plus or some other adblocking software preventing Pastebin.com from fully loading.

We don't have any obnoxious sound, or popup ads, we actively block these annoying types of ads!

Please add Pastebin.com to your ad blocker whitelist or disable your adblocking software.

×