This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index

February 2018

February 01

Dawson Beggs
Is it possible to switch states to a different layer being visible? for example... (please excuse my likely poor explanation) -- on click of one layer, the layer triggers another layer as being visible and becoming the "active layer" (hiding the original) and events are now subject to the "switched" layer? Thanks so much!
1
Mike Ivanchyshyn
Is it me or just no one has access to camera from Safari in iOS 11.3 beta? https://www.facebook.com/groups/framerjs/permalink/1174801385980264/
2
Florian Pnn
Hi there! I'm facing a different behavior based on where my prototype runs. Within Framer Studio, the code below output the context point, when running it on the iOS app, it returns "undefined". Any idea what is going on?
1
Vitaliy Petrushenko
Hi Framers! I'd like to hear your opinion on a flipping cards prototype that I've recently completed. Feel free to use any pieces of its code in your works 🖖 Thank you! Works best on iPhone 7/8: https://framer.cloud/Sljaa/ (Doesn't work in Chrome on macOS ☹️) Post on Dribbble: https://goo.gl/tZcqR8
4
Paul Rich
Does anybody use Framer for Web?
7
JP Ganyard
Hi All.. been trying to get rolling with Kevyn Arnott's Material Kit. But the system components don't seem to scale themselves properly. Checked out the exiting demo, it works but when I try to reproduce that within current Framer Studio and current library, it is far too large? Did some update break something?
5
Dan Clarke
Hi everyone. I'd like to hear stories from anyone who's made use of Framers MIDI features and how it works or does not? I'm thinking about using it for some future projects but understanding if MIDI can be sent to and from the application and if other things are supported (OSC, UDP) would be great. Otherwise, I may go down the processing() route. Thanks!
1
John Marstall
A reference point for your own Framer modules, if you like.
2
Julian Sharifi
Will SVG layers ever support the copy method? I use .copy() a lot to bring in and arrange sketch groups (for a button for example) with loops and can't seem to find a way to do that with the Design tab
5
Aalok Trivedi
Anyone experiencing issues with spring animations with paths? It's really jerky and not smooth. I tried classic spring as well but got the same result:
0
Josh Peters
I broke apart Benjamin's path animation example and create a simpler version for beginners to grasp. Bind events to them and you can make all sorts of fun things.
1
Patrick Hansen
Is there a way to apply a custom font (non web hosted/non Google Fonts) to Text objects created in Design mode? I was able to add my @fontface embed to the CSS and apply the font-family to the 'body', but I need a different font for other objects (button labels) and it doesn't look like you can define a Selector on any object/layer to apply it to. I also tried applying it directly to the textLayer with this, but it does not appear to have any effect on the textLayer (FontTest) drawn in the the Design mode view.
3
Jason Sparks
With this example below, it's doing everything I want bar two things. i) How do I stop the cards moving outside the boundaries of the scrollContent (i.e stop them sliding from the grey area to the white as if an invisible wall is stopping them) or stop them from overlapping each other ii) Why does my scrollContent always bounce back to its starting position?
0
Josh Goodell
Hey Framers! Got another question for you smart folks: when I use layerName.onTap, this seems to trigger when I'm scrolling if I touch that layer at all. Is there a way to fix this?
3
Jonathan Harvell
Is there a way to draw a stroked path from its initial point to its final point with some animated properties?
6
Joe Martins
Hello everyone! So, I'm having trouble to figure out how to trigger events once a sound is played. How can I do that? Framer v111
3

February 02

Val Stripe
Automatic Hierarchy doesnt work for some reason for me. Is it disabled by default? If anyone knows how to enable it, that would be really appreciated! As I cannot find it anywhere PS: I also can't group layers together
2
Benjamin Den Boer
Hi all! Framer v109 is here. In this release, we've added the ability to target and animate all elements designed in Framer, including path lines of a shape. You’ll also find a new beginner tutorial and four new UI Kits (iOS, Android, Web and Wireframe) to speed up your ideation to production workflow. http://bit.ly/2n3t5Np
6
Dexter Wang
Anyone based in NY? Want to meet up over coffee and talk Framer and design? Feel free to ask me about..product design, analytics, or even filmmaking. Thanks :)
0
Joseph Brick
Hi! I've made about the simplest example of a page component as I could come up with, and I still can't get .nextPage() to work. Clicking the Go Next button seems like it should do it. Any ideas?
2
Luis Escobar
How does one open the Framer app menu on an iPhone X?
5
Dushmantha Sanjaya
When I resize the dartboard, objects won't resize according to a transformation. Does anyone know how to fix this?
1
Mushon Zer-Aviv
Hey Mapbox Framerers, anyone care to share pointers for efficiently #animating #Mapbox paint properties?
0
Eyal Zaidman
Is there a way to programmatically hide an overlay (after calling flow.showOverlayBottom for instance)
3
Jeff Romi
Does anybody know how to fix? I don't want red scrolled ball scroll to carry over to next screen.
3
Niels Flindt Koelmeyer
Why does setting a 'borderWidth' on the parent layer throw off the positions of its children layers? The child-layers seem only to respect their set position (Align.center) in regards to the screen/canvas, not their parent. Anybody got any ideas?
3
Ryan Lawrence
Does anyone have good examples of framer being used for enterprise?
2
Gracjan Złotucha
Hey :) Is it possible to change default animations for flow.showNext and flow.showPrevious?
1
Aalok Trivedi
anybody knows why theres a ‘flicker’ when you animate a path with a rounded cap? It works fine when I use a regular end cap https://cl.ly/0K3Z2Z2f1h20 could it be that the path.length doesn’t account for the round end-cap? Any workaround for this? https://framer.cloud/WSQog
0
Jangala Nikhileswar
Hi, the left most artboard isn't showing up in the preview window. I have tried reloading the window/ restarting Framer but still it shows the 2nd left artboard. How do we solve this?
3
Alec Uitti
Trying to set up a simple dropdown-style menu with hover states. Some parts are working but others aren't. Anyone see some obvious things? layers are being created and the behavior works once. thanks in advance! https://framer.cloud/puIYt
1
Josh Peters
Made a basic path animation example for the beginners in the crowd. Simple stuff for now, but there are more options you can utilize. #pathanimation #animation #bitcoin
1
Christopher Scott
How can I destroy dynamically created layers? I am trying to call layer.destroy() on a click handler, but I don't think the layer is available in the scope. http://share.framerjs.com/t5r9xs2jv5hc/
6
Garrick Li
Hi all, I'm trying to draw 3 paths in a frame using the new drawing capabilities and it's not animating as intended. Does anyone know what I'm doing wrong?
1
Dawson Beggs
could anyone recommend the best way to achieve this drag + drop https://framer.cloud/TkLlG ? I was able to replicate the concept moving card #1 across midX of card #2 for example purposes. Thanks!
0
Martin Halik
Hello guys, how to get custom font using in Framer Design to Framer iPhone Preview?
3

February 03

Marc Brandon Hensley
I'm encountering an issue when I try to set/change the header of a FlowComponent after the initial screen has been assigned. Here's a simple example of what I'm trying to do: https://framer.cloud/PPbrU If you look at the code, moving the flow.header declaration below the flow.showNext function causes the scroll layer to break its child relationship to the flow parent and I cannot understand why. Am I just misusing flow.header by expecting it to be changeable within the flow?
1
Ian McClure
Here is a pet project that I've been having fun with. The period, orbit and sizes buttons don't do anything yet because I am in the middle of redoing how orbits are calculated. I also need to reimplement some animations but it is fun to play with. As a warning, it may crank the CPU a bit.
0
Stephan Orme
I have a basic question that I can't seem to find in the documentation. I started out by creating my design in Framer and now I want to animate a few things. All the examples start out by creating a layer, and it's not clear how to declare a layer that already exists. What I'm trying to do is toggle a button through multiple states, ideally, I want transitory effect using touchStart and touchEnd and then update a text field (off, 1, 2,3) and maybe add a small audio feedback in there.
8
Brandon Thomas
Is anyone else experiencing issues with onTap not working lately on PC browsers? Touch has also been flaky for me. I'm not sure if the boilerplate I have is crusty or if browsers have updated or it's a bad combination of both.
0
Yasin Arık
https://framer.cloud/lqjbO In the example please explain me why this happens: Iteration: 1. Click on a "layer" . A copy is going to be created and Xcentered. 2. Click the corresponding "button" and "newbie" scaled up. 3. Click on "newborn" and it's destroyed. When you do those steps second time, it prints "B" (name of the state after scaling) twice. When you do it again for the third time it prints "B" 3 times and it goes like this. Since this is a very basic program, it doesn't change the result in any manner I guess. However, similar approach on my own project it causes stateCycle() to run awkwardly. Also since it changes states more than 1 time, it runs slowly and animations get laggy. I don't really know how to handle this situation.
1
Jorn van Dijk
The Amsterdam meetup last Tuesday was PACKED. Our office is getting too small, luckily we’re moving Framer’s HQ in March. Here are some photos from the night. Thanks to our speakers for doing their talks twice! https://www.facebook.com/groups/frameramsterdam/permalink/2090900477796836/
7
Jason Sparks
Why doesn't clicking the button scroll the scrollComponent? https://framer.cloud/xdLOc
0
Dominic Winkler
Wondering about modules when installing them with npm, where are these modules stored? Should they be inside a framer project, meaning the folder structure project.framer outside of that? So for some packages (e.g. leaflet) the easiest way is to put the unpkg link to the .js and css into the index.html, but what about if I install the module locally with npm where is it Actually been saved to and how do I link it?
0
Stephan Orme
More newbie questions....thanks in advance: 1. the print command covers over my design so I can't interact with it. How do you move the Print output out of the way so it's useful? 2. How to center text vertically within a layer? I'm hardcoding a padding for the moment: layer.style.padding = "20px" 3. I'm updating the text in the layer, and the text only appears *after* the animation is done which is an ugly effect. What I want is for the text to update and then the animation starts (fade in for example). 4. Can I get the current state of layer and use it to trigger a conditional? This would allow me to update the state and then trigger the animation after. I haven't been able to do this successfully yet. 5. I want to animate a shape/layer *out* of the enclosing layer. When I do that the object 'disappears' when it slides to it's new location. I've tried turning clip on and off. Thanks for help on any of these - all these little gotchas...
1
Colin Sygiel
Hey framers, I am trying to create an infinite looping animation that animates squares (in my case "stars") at random locations across the screen, simultaneously. I have two animations, one to grow the square and one to fade the square. Right now I am trying to reset and restart the animation on every animation end but this isn't working. Any ideas on how to create simultaneous animations out of this - ideally I want to reanimate before the preceding animation ends so that it is more dynamic.
2
Justin Davis
Newbie question. I'm trying to get long text to be responsive and wrap according to the device width and push any content below it down. I tried text.autoSize = yes but it only wraps when specifiying a width. I'm trying to demo on multiple devices so I need the width to be auto. Any advice would be greatly appreciated.
1

February 04

Tai Kim
Hello, Is it possible to view my prototype without mockup device (for my case, TV)? I want to view it in full-screen by default (without it) when a user clicks on a cloud link. Thank you in advance!
2
Paul Kooi
Anyone know where I can find documentation or a tutorial of some kind on the the new Path Animation API in v111?
1
Muhammad Athar
As noob as I am, with a request from a fellow group member I am sharing a quick tutorial to set up real time maps using leaflet on Framer. Special credits go to Jacky Lee for pointing out the zoom pan fix here https://www.facebook.com/groups/framerjs/permalink/1251836218276780/.
3
Josh Ackerman
Hello, How can I call layerB.bringToFront() after layer is finished animating? This is my current, failed attempt: button.on Events.Click, -> # some layer animations Utils.delay .6, -> if not layerA.isAnimating layerB.bringToFront() At the moment when I click on "button", layerB instantly moves to the front, rather than waiting .6s and checking if the animation is over. I would like some layers to animate before they disappear to the back. I can post the project if the context would help.
11
Cordova Putra Handri Ansyah
Hey guys, I've recently searching for a prototype example which integrates with Google Map API from Min-Sang Choi, which he posted about three years ago. The file's unavailable, does anyone here have built one and mind to share?. Thanks
0
Brent Riddell
Playing around with a game prototype (just for fun) and wondering why this loop only destroys every odd child, leaving only the even numbered ones and not all of them? If I print world.children[i] in the loop, it finds all of them, so I'm confused why it can't destroy all of them :/
6
Yasin Arık
A bit off topic but, Is there anybody using Framer with a database? (It is better be a local database) Any recommendations for data modeling for an SQL db to use together with Framer? Until now, I used some basic arrays for designing and interactions. Now I need to scale things up and populate my proto with lots of images, user data and relations between them. Thanks for help :)
1
Susan Ryu
Hi all. I am new to Framer. I found changing the size of shapes and borderRadius(in code) don't work for me for some reason. Plus if anyone knows how to clip two SVG objects (as a parent-child relationship) without grouping each object in a frame, I would be very appreciated! Thanks :)
2

February 05

Nicholas Hobson
Hi, Framer + Firebase question: How can I update specific fields? I'm using marckrenn's firebase module. I need the coffeescript for something like this
1
Giles Perry
I’m trying to figure out a couple of things... 1. Is there a way to make a layer emit an event when a second draggable layer is dragged over the top of it? 2. Is there a way on a mouse down event to create a new draggable layer and transfer the mouse events to the new layer so the new layer gets dragged around up until the mouse is released?
3
Gary Sikhosana
I'm fairly new to Framer. Is there a way to have a MouseOver and MouseOut event disable when an onClick event is active. Currently, when an onClick event is registered in my prototype the MouseOver and MouseOut events still register. Thanks
2
Joel Smith
I'm using a flow component and disabled overdrag with flow.scroll.content.draggable.overdrag = false This works fine for the first page but not the second, I would have thought it should work for every page. What am I doing wrong?
0
Darko Stanimirović
What's the best workflow if you primarily use Design tab to create specs for developers – without replicating everything in Sketch? I have several artboards and I'd like to share those individually, but uploading to Cloud renders the prototype instead. (all artobards mashed into one viewport) I guess I'm using it for something it's not yet meant to be. Is it better to do all the drawing in Sketch and switch to Framer Design only for single screens/interactions?
2
Bhaskar Ravi
A bit more of a complex question regarding loading views with data. Is there any built in solution, or preferred method, to manage state of a view created in design mode, and then filled with data? Each time the data changes, do you have to completely destroy and recreate the content within the view? Or is there a way to revert to the view's initial state and then repopulate with new data? Hope that makes sense and thank you!
2
JP Ganyard
Did path animation get broken in a recent update? Was looking at some of the examples out there, they work fine until I download and update the library. Wanted to do some path anims in a current project.. :(
6
Raveesh Bhalla
Is it possible to mimic various input events? For example, can I programmatically show a scroll gesture, so that the prototype demonstrates related behavior?
1
Arturo Goicochea
Quick JS question: Why is does the 'i' in a for loop different change it's value when used inside a click event? When I do: ################## for i in [0...1] foo = i layer.onClick -> print i print foo ################## outside the click event, both i and foo = 0 inside the event, foo = 0, i = 1 (Look at image fore reference, or open example Framer file) https://framer.cloud/seoCk
6
Matt Bullock
Is there a method to check your code for errors? Whilst learning the fundamentals it can be hard to see where you've gone wrong and Framer doesn't always point out your errors. For instance, it just took me about 20 minutes to work out that I had left the 's' off 'constructor'. As I'm terrible at spotting spelling errors, this is happening way too often. I'm hoping there might be a site you can copy your code into which will point these errors out? Thanks!
2

February 06

Woo-seok Kim
Hi everyone. I'm trying to prototype with google map. I'm familiar with using google map api with web, but first time with framer. ------------------- mapLayer = new Layer height: Screen.height width: Screen.width mapLayer.html = "<div id='map'></div>" mapElement = mapLayer.querySelector("#map") mapElement.style.height = Screen.height + 'px' {DynamicLoader} = require "DynamicLoader" DynamicLoader.add('./vendor/google_map.js').then(-> map uluru = {lat: -25.363, lng: 131.044} option = {zoom: 4, center: uluru} initMap = -> map = new google.map.Map(mapElement, option) print "load" ).catch(-> print "load fails" ) --------------------- This is my first approach with DynamicLoader which help to load external JS file and 'google_map.js' is exactly same file with the code firstly given to me with my own api key. As this way didn't work could you recommend any reference for using google map api in framer?
2
Stephan Orme
Just learning, and would love to get some feedback on the code for this widget, it seems verbose, wondering if there's a more elegant way to do this. If you click on the Viking, it pops up feedback widget, cycles through some states, and after a delay, after last user input, it animates it closed. Handles a few particular situtations: touch-and-hold (keep feedback open) and tap during animation close (cancel close). Thanks in advance! Will post the code below as well. Any comments or suggestions on animation effects would be welcome too, I tried to do a gooey-effect-to-close without success.
1
Yasin Arık
Hi guys, I have improved a function that changes a layer's height and width then scales that layer. Modified function works pretty well for me. I use this function in a loop but because of scoping I guess, I can't reach the variable "factor" . I want to strore each layer's "factor" in an array like this factorArray[i] = factor How can I get a variable inside a function? I tried return factor, but I must be doing some mistake. Any help?
2
Yasin Arık
Hey FFFFramers :) Sorry for I've been asking too much these days :) I made an example project for learning how scoping works. https://framer.cloud/HIFlj The last loop doesn't work. It doesn't print anything. Why I can't reach those buttons outside of a scope? I'm stuck at the same thing with my main project. I have searched lots of posts in this group and tried all I found. Need an urgent help esp. from pros Joshua Tucker Jordan Robert Dobson Koen Bok
1
Maximilian Bredow
Strange behaviour found when handling .svg (imported from Sketch) in v111: at some point my logo seems to disappear. When I move it outside the frame and back inside it returns.
1
Ken Yiu
Is there any native way to lock the orientation?
13
Rohan K
I have an array of layers, I want to find a layer in that array and remove it. What's the most efficient way to do this? Its not a stack model, so I can't use array.pop()
2
Alec Uitti
trying to make a loop mouseOver state with the layers attached to a parent for position. When I add parent: designation, the mouseOver event seems to transfer to it vs the layers in the loop. when I take out the parent declaration it works fine but of course the position is off. any ideas? tia
0
Nicholas Guthrie
Does anyone have any simple tutorials about prototyping real chat interfaces?
4
Misha Erikov
Guys, I'm just starting and probably it might be a stupid one, but two pages of googling didn't quite help. Is it possible to mask images in the Design tab? Or even clip them?
4
Josh Peters
Are there any basic protos or tutorials on using TextLayer in the context of a stepper moving number values up and down? Tried searching some different terms here and Dynamic Type tuts aren't much help Thanks!
2

February 07

Sam Sam
Hi everybody ! I've just started a new proto. But i'm stuck on a simple thing. I want to lock the scroll direction on 2 differents component on 2 differents pages with "flow.scroll.directionLock = true" The first card component on the page 1 is fxcards the card component on the page 2 is fxcardscopy I included my two components but it doesn't work for fxcardscopy contents = [fxcards, skincards,fxcardscopy] for elem in contents scroll = ScrollComponent.wrap(elem) flow.scroll.directionLock = true scroll.scrollVertical = false scroll.content.clip = false scroll.contentInset = right: 20 You can switch page by click on Bandpass Stop Thanks in advance for your help fellows 😋😋 https://framer.cloud/mvmlA
2
Keith Lang
'Frame' feature requests: - A 'adjust to fit' button for when you move the contents inside a frame and want to resize the frame around it - A keyboard shortcut to 'unframe' something - Like Sketch, support Enter = go into frame, select topmost layer
1
Josh Ackerman
Hello, Has anyone achieved a floating/hover effect through animation? My current solution which does not work very well, is to animate the layer position with y: layer.y - (Utils.randomNumber(2, 8) * direction), where the direction cycles through [-1,1]. This results in layer moving up and down, although it is fairly choppy. My next idea is to move layer around a tiny circle at a possibly random speed. It would help me greatly to hear any other ideas. Thanks.
3
Oleg Frolov
Hi there! Here is my new UI concept on Dribbble. Also, I've got a question. Could we preload images in a prototype? Do we have something like a preload function? In my case, If I test the prototype in Web, I see delays for an image loading. https://framer.cloud/yvzzY
2
Trisha Suri
hello! i want to create a carousel with some cards i've created in sketch. does anyone have any tips on how to do this? thank you!
1
Dushmantha Sanjaya
Dose anyone know, how to switch the two screens without tap or click on Framer? Like a Splash Screen. Cheers!
2
Ian McClure
I feel like I am missing something obvious here but how do you add inline styling to text in a TextLayer? I’ve tried using the html <em> but it gets escaped and displays as text.
1
Lucas Carmichael Lu
Curious to know what is everyone's workflow when working with remote developers? Thinking about signing up for Framer. How do you prepare specs and assets? (we currently use Sketch + Zeplin for that)
1
John Harrison
Is it possible to make a mailto button in framer?
3
Jordan Robert Dobson
Jake, Josh and I studied gravity and orbiting today while working through our HTML5 Animation with Javascript book on Particle Attraction and Gravity. Demo: http://jrdn.io/jfuL I wanted to share the results as this is a pretty fun task!
4
Stephan Orme
I'm having problem with States. I'm making a copy of 'button3' (called button3_display) and want to animate the new button from the default (where it was created) to a new location (~100 pixels above the widget) button3_display = button3.copy() # add state to new button button3_display.states.display = - opacity: 1 - x: 50 #has no effect on X or Y - y: 100 - backgroundColor: "#fff" - animationOptions: - curve: Spring(115,12,0) - time: 0.5 # This doesn't update X either: # button3_display.states.display.x = 100 # print current state info for button3_display print button3_display.states.current.name print button3_display.frame print ".........." #switch states button3_display.animate("display") #print state info, no change in X or Y, why? print button3_display.states.current.name print button3_display.frame
1

February 08

Junhyuk Jang
mix blend mode experiment just for fun :) Is there any parts that can be use this interaction ?? http://share.framerjs.com/tr2kfw8r5wom/
3
Rupa Chaturvedi
Hello framer community! Dumb question, but how do I change font-color for a text layer?
2
Julie Zhu
Hi everyone! I'm having trouble with device size when I'm trying to use the prototype on my phone. I own a iPhone 7 plus, and I used iPhone 8 plus in the framer. But the design was all messed up in my phone display, any idea how I can solve this problem? Thank you very much!
0
Paul Kooi
Hi. Benjamin Den Boer I'm using your input module and was wondering if there is a way to focus it automatically after an event? So when the user clicks a search button for example, and the input field appears... the input field is already focused rather than having to click it after it has appeared. Thanks for the module. It's been working really well by the way.
6
Umid Negmatullayev
Hello guys, How can I test my framer design on the phone? Thank you!!!
1
Daniel Maniés
Hey guys, I maybe found a little bug which occurs in v111. When something is entered in the replace input field and I click in the text is not visible anymore (s. screenshot).
1
Hussain Fazaal
Hi guys, I recently won the tweet-to-win 1 year license of Framer for free. However, the link they provided is for trial version download and there are no instructions given to activate the free 1 year license. Can anyone help me with this?
1
Greg Becker
Wondering if there are any Framer peeps in Portland who might want to start a meetup. I just purchased my license and would totally come to learn.
5
Aalok Trivedi
having a little trouble with classes. I creating a button class with a bunch of default options, but when I create the new Button--with no properties declared--it should just pull the default options, right?? What am I doing wrong?
3
Sergey Ivanov
Hi! I'm experiencing problems with Framer Preview app for Android. I can't download prototypes to view them offline. Error says "Error Downloading". I'm using app version 6 on a device with Android 6.0.1, USB debugging is enabled, etc...
3
Tianhua Yang
Hi guys, I’m playing around with the page component. Does anyone know how to put padding in front and back of the pages(circles in my prototype), so it starts from the first one and you can also scroll to the last one? or maybe not the padding but anything else... As you see in the prototype, due to the constrain of the scrollable area, I'm not able to scroll to the first and last circle..., Any tips would be much appreciated! 😉
2
Dmytro Zaliznyj
hey guys, is there any solution to preview your prototypes in Chrome without any issues?
2
Yaron Tamuz
Hi all, I would like to create a walking path animation similar to what Uber or Google maps use when they navigating the user. I managed to get to this point but pretty much stuck. What I imagined is an invisible path that many circles shapes are moving along it and disappears at the end. Can someone help me with this or direct me to a similar example? Thanks
1
Kasper Germann Kramme
How do i use PageComponent when the pages is created in the design tab inside framer studio? I tried adding the by using the page.addPage("pagename", "right") method...
7
Stephan Orme
Anyone know how to: A. get a list of all states for a layer B. get the list of properties for a state C. know the syntax for updating a state property
3
Ignas Vasiljevas
Hey, when I apply a header to my FlowComponent, the content seems to be offset by the header's height. I would like my content to start at y:0, behind the header. Is there any way to achieve this? You can see the project here: https://framer.cloud/OYIaO
1
Stephan Orme
Can anyone tell me why the first line works and the 2nd does not? 'display_value' is a child of 'display' in this example. One appears to be addressable, the other is not. I also tried: # Works button2_display.html = "Q" # Does NOT work button2_display_value.html = "R" #Also does not work button2_display.button2_display_value.html = "R"
5
Dushmantha Sanjaya
Dose someone know, how to do a images horizontal scroll on Framer?
1

February 09

Johnny Dayday
Problem solved!! for those friends who are also wondering this, just capitalizes 'screen' to 'Screen' and it will work out,(see the comments) thank you Aalok for your kind help:) ----> Hi, everyone ;) I was wondering a question about “states” and layers’ location. For example, since layerA.x, the “x” point is determined by the left edge of layerA, if layerA (x: Align.center, y:Align.center) and I set a state(s1) as (layerA’s) width: screen.width; height: screen.height; x:0; y:0, which I intended to expand layerA into a full-screen layer. However, when the animation happens, layerA always start to expand and relocate itself from its left edge... I was wondering it’s there any way that the animation can somehow begins in the center of layerA just like “pop up” ? (Just very curious about this..thank you very much if you may have figured out!)
4
Dave Crow
Has anyone used Chart.js with Framer?
3
Maximilian Bredow
Idea: Integrated Docs/Helper Switching back from RStudio, I realize how much I had enjoyed the integrated help function and am now struggling again on issues that I had solved months back already. Quite frustrating. RStudio is made for researchers who are not necessarily familiar with coding - just like designers in Framer. E.g. by writing "?array" in RStudio I can learn what this function does, which parameters it holds, and a code example. This made it easier understanding new functions or picking up after a longer break or a project by somebody else. I know that writing ?array won't work in Framer as all code is executed at once, but how about integrating the Docs into the code tab (e.g. alternate between showing either prototype viewer or docs) and make it possible to research a function from within Framer (e.g. CMD+Click)?
1
Keith Lang
Shortcuts from Sketch I miss in Framer: - Hitting Enter on text object puts it in edit mode, but also selects all text - Selecting a group (frame) then hitting Enter, selects the first item in that group (frame) - With an object selected, option+Command + dragging anywhere on that screen will drag the item. Useful when it's hard to 'grab'
1
Stephan Orme
Framer Ignoring clearTimeout? I'm seeing strange behavior. Framer appears to be ignoring clearTimeout under some situations. If I click on the button and mouseOver over the scroll, it's supposed to stop a close animation, If I more slowly, it works. If I move quickly, it fails. It's supposed to stop a close animation if a user mouseovers the widget, and it's not for some reason. It has something to do with the order things are firing in, but I don't how to address it. It's ignoring a clearTimeout basically.
0
Baisampayan Saha
Hi! I want to remove the left hand side panel that comes while sharing framer project. I am putting the framer link in an iframe. Is there a way of doing it? Any help is appreciated. Thanks.
2
Chris Camargo
Is there a quick and easy way to shift the position of the device frame? I want to move it around so I can do some detailed screen recordings.
4
Tes Mat
Hi! There’s now a 🎁 free preview version of the Framer book. It contains a few chapters that already could be found online (Text Layer, Apple Music tutorial), but also introductory chapters (first steps in Framer), CoffeeScript fundamentals and the Flow Component chapters. -> framerbook.com
0
Aalok Trivedi
Is there an easy way to control the start and end points of a path? I want to create a tether interaction where the endpoints of a path are fixed to the midpoints of two layers, and if if drag one layer, the endpoint remains attached
2
Abby Walter
I'm trying to get a scrolling component to work. I have two mouse enabled scrolls - one on the main content, the other on the right sidebar. The scroll works. However, sometimes when I resize my screen to a smaller size and reload (it has to be fluidly responsive), the bar on the right hand side gets this white box on top of it. It's definitely the scroll component because when I delete it this is no longer an issue. Any help would be greatly appreciated.
2
George Kedenburg III
got native camera access working in Framer on iOS 11 😱
24
Josh Goodell
I'm curious if anyone has a solution for design systems in Framer? Currently, Sketch has pretty powerful design system capabilities but it's a net negative if I still have to design everything twice: once in Sketch and once in Framer.
1
Giles Perry
I've noticed that scroll.contentInset does not affect the size of scroll.content. Normally you'd have content that is bigger than the scroll area, but when you don't I'd expect the layers to bounce back to their initial position when you stop scrolling. With no inset that's exactly what happens, but with an inset the content scrolls by the inset amount. I can't use contentInset in this case. Anyone else find this annoying?
1
Norbert Dragán
Hey, I'm trying to create a Bitcoin chart, but I am struggling to get the little dot follow the path. I used `path.pointAtFraction(fraction)` to calculate the y coordinate, but I can't figure out why my math is off. Is there another way to get a shape follow a specific path? Proto: https://framer.cloud/VBUiX Thanks for your help!
1
Dawson Beggs
Does anyone have any good resources on drag and drop? Examples, etc... they might be able to share? Thanks!
2
Sauraj Babu
Hey guys i recently took part in the #spacedchallenge organised by Dann petty. I designed and prototyped the entire concept on framer You can try it out here: https://framer.cloud/vHffv/ Dribbble : www.dribbble.com/Sauraj
0
Joshua Noon
Hey guys, I think this should be really simple but after countless google searches the syntax eludes me. Im trying to address instances of a loop that I've pushed into an array. I would like to be able to address multiple instances at the same time. Can anyone give me the syntax to do this?
2
Stephan Orme
Does anyone know why the index property doesn't appear work in this bit of code? scroll = new ScrollComponent - width: 60 - height: 170 - backgroundColor: "grey" - x: 100 - y: 100 - scrollHorizontal: false - contentInset: - top: 5 - bottom: 5 - right: 10 - left: 10 delete scroll.states.default window_top = new Layer - backgroundColor: "green" - opacity: .5 - width: scroll.width - height:70 - midX: scroll.midX - y: scroll.y - parent: scroll - index: 90 ###### PROBLEM: INDEX DOESN'T SEEM TO WORK ##### # Desired behavior: window_top should overlay and partially obscure the Scroll layer and it's contents
5
Alec Uitti
I'm wondering now if this is a bug. It's clear that when you put the parent: fubar_layer in the loop the parent layer will grab the mouseOver and renders your layer loop useless. Anyone have a way of doing this using a different method?
3

February 10

Stephan Orme
Anyone know how to get the current scroll layer? I want to control the scrolling from a secondary widget so my end-goal is to get and increment/decrement the layer and scroll to it. I think I also to throttle the rate. I'm using PanUp on the other widget and it fires rapidly, so if just use button.onPanUp -> ScrollToLayer (X) it will go by fast. I tried Utils.delay but it doesn't appear to work.
1
Scott Herrington
Hi! Quick, and hopefully easy question. How do i get new InputLayer set as type=number, so the numpad pops up on my phone rather than default keyboard? tried the obvious type: "number" but no dice Thanks!
2
Jonas Treub
Hi all. We realize there’s been some confusion around Frames and Shapes, so we’ve introduced a bunch of fixes to make the distinction clearer. Download the latest beta and let us know what you think. https://framer.com/beta/
9
Johnny Dayday
Hi everyone:), I was thinking to give a more dedicated effect to a layer when users click on it, but I had some difficulties in doing so. Basically, I was trying to make the layer smaller when someone is clicking it, and make the layer lager when the 'Click' is done, just like a jumping effect, but I found the final result(the layer) cannot always full fill the screen, I was wondering if someone could please help me out (apologies for my poor English expression here..) Thank you very much! Have a good day!
2
Josh Goodell
Huge thanks to the community for your help with this so far. It's coming along! One issue I'm having that you can see in the GIF is that when one of the list items is open, the items behind it are still somehow tappable. Is there a way to prevent items on background layers from reacting to taps?
0
Maximilian Bredow
Request/Question: I want to mirror a shape along an axis. Dragging across the xMax axis works e.g. in PowerPoint but in Framer it didn’t help. How can I do this?
2
JP Ganyard
Simple svg animation.. but how do I get rid of that dot on the bottom??
1
Jason Sparks
I've never seen this before. How come the 'Big 1 Button' is not displayed in the Prototype view when it is turned into a frame, yet the frames for 'Small 1 Button' and 'Small 2 Button' are? It appears to have an x value way off screen. Also, why is there no option to group a rectangle and a text layer?
1
John Harrison
Hi, I was was wondering if anyone could help me with a simple bit of coding. I have an array of 10 questions (located in the design tab). I also have a button that when clicked randomly chooses one of the 10 questions. This works fine although sometimes the random question chosen is the same as the one that it is currently on. How can I stop this? Also is it possible to show a different screen once the button has been clicked 4 or 5 times? Thanks in advance, really appreciate the help in the Framer community.
6

February 11

Nathan Magyar
Hello. Does anyone know if it's possible to animate the height of a class instance? Like adding states to the constructor or options? In the attached prototype, the profilePic, petName, bio, and readMore layers all have states that I'm toggling between. But when the user clicks on a given card, I want it to increase in height. Thoughts? Thanks!
2
Rohan K
I have been working on this module as part of my job for a year, and I am happy to finally be able to share this with everyone. Special thanks to Jordan Robert Dobson and Emil Widlund for the inspiration.
6
Brandon Souba
I recently integrated map box into one of my prototypes using this great tutorial: https://www.mapbox.com/help/mobile-framer/ I'm noticing some super laggy pinch interactions in addition to things not being responsive when looking at it on an iPhone using the framer app. Has anyone else had these issues? I would love to be pointed to some resources where I can tell when certain zoom levels have been reached and how to attach things to the map (I assume this is a JS question, but not sure the proper workflow with Framer).
8
Jason Sparks
When using flowComponent and showOverlayLeft(layer), do I have any control of the y value of the overlay. This would be so it doesn’t slide in at the top left of the screen but instead, for example, slides in at the middle of the screen so it is not covering the top section of the screen?
1
Michael Weisert
Hi All - I need to create a div area within a page that has scrollbars. Essentially, we're showing when a table might need to scroll horizontally if it has a bunch of columns. I've tried 'overflow:auto' turned on, set my heights, but no luck. This has turned out to be nearly impossible. I'm also trying to use a ScrollComponent, but this seems to bring it's own baggage. I don't see anywhere for enabling scrollbars within the layer. Anyone have ideas? Thanks in advance.
0
Stephan Orme
How do you get the scrolled-to item? There doesn't seem to be any functions for doing this.
1

February 12

Yoann Lopez
[LOOKING FOR PAID HELP] Hi everybody! I joined this group a few months ago to learn more about framer but I never had the time to actually train myself very well. I'll eventually do it but in the meantime I need your help. I'm looking for a freelancer who could design a framer mockup based on an existing product. We want to use this framer working prototype on the product web page (embedded). Do you happen to know anyone that could work with me on this topic?
6
Bhaskar Ravi
Hi all - having trouble w/ Framer here. Any help would be appreciated. I have a simple object (testing Framer w/ Elastic Search). When I print out the object, my neighborhoods print as undefined. While this may seem trivial, I legit spent hours debugging this, as I trusted the console and thought I was getting a bad http response at the time (turns out I wasn't, but on the plus side I learned a lot about the Framer console). The culprit of this bad print seems to be "offset" and "length" in my object. When I comment out those two lines, the print statement works as you would expect. Would love to know why this is the case. It might not even be a Framer problem - could be a coffeescript issue. Regardless, thought I'd bring it to the community. Link attached below:
1
Chris Wang
Anyone know why SVG sometimes gets dispositioned when viewing in Preview? Halp!
4
Maximilian Bredow
I have a weird alignment issue with two shapes. Is it a bug or do I have to do something differently? https://framer.cloud/IxvMp
5
Jangala Nikhileswar
There are some variations in how things appear between preview window, browser and iOS app. How do we solve this?
1
Joseph Brick
I searched this group for a good way to sense when screen orientation changes between portrait and landscape (assuming a mobile environment). I found some good solutions, but these were older posts. It turns out that now, Screen.onResize is an actual event, though it hasn't made the docs. (I think this went in last year at some point.) So on that event, you just check whether Screen.width is greater or less than Screen.height to figure out which orientation is active. Works perfectly in Framer and on the device.
2
Baisampayan Saha
Hi...I am trying to embed my framer prototypes in my website. But when I open my website in a tablet, the prototype dimension changes, even though I have set the width and height of the iframe in which the framer url goes. Is there a way to bypass this and always show the prototype correctly, rather framer detecting the device type and messing up with the constraints? Added a screenshot of how it looks like in ipad pro! The prototype is old so, editing it would be a huge task. I have few other prototypes like this which I want to put in my site but could not do so because of this problem. Any help is appreciated.
1
Dennis Søberg Vinther
Hi Guys Im pretty new into framer. I need to make a gesture where you as an user can turn a wheel and then I can use the values to do someting like change images or show text. See example of the wheel feature here. (From an real app) How do i do that ? :)
1
Luka Drezga
This was a fun exercise for a mini game! You can navigate the car with your keyboard or by dragging it around :). Mines appear and animate on a random path, and although the collision detection is done a bit hacky it seems to work! I wonder how the collision detection could be done differently? In this example I generate a new mine layer and with Utils.delay check the y and x position of that mine.
0
Abby Walter
What's the best way to add multiple frames on one screen? Is that possible? For example, how one adds a header except I want to add a sidebar that has functionality within it to every page.
2
Martin Jerkovic
In Framer Design, I tried to align a position (e.g. center) of path layer but it seems like it gets ignored even if I wrap it in frame or group, or create a target. So when I resize the parent frame, it's stuck in place no matter what resizing or positioning properties I set. Can anybody help me understand the mechanics behind this? I guess I can do it manually in code but wonder why this doesn't translate properly.
2
Nick Andrews
Hey everyone, I had some spare time to download the Framer trial and play around this weekend. Loving it so far! I'm trying to do something that I think would be super simple, but I can't figure it out. I have an array of 6 circle elements, and a for loop that loops through each circle and applies an animation + delay on each circle. I was able to reverse that animation and now it just loops forever. My question, is how do I apply a 3 or 4 second pause between the initial animation and the reverse animation?
8
Dennis Søberg Vinther
Hi Framers Im trying to make a wheel that can control and switch between states. I found an example that I modified, but can't make the wheel work in Framer iOS preview app. Any idea what to do ? or is there a simpler way to do this ? ... And when the wheel is made, how do I switch between states with the wheel...
0
Kenneth Spry
Is there a way to get async/await working in framer?
0
Brandon Souba
I'm looking to recreate the "stacked cards" UI from tinder. The swipe logic isn't what I'm looking for - I've already created a loop to create the cards and "push" them back in space behind one another - but I'm curious how you could create a "endless" stack where if I swipe off the first card, we automatically "update" the positions of the rest of the stack and add a card at the end. Any tips?
2
Maximilian Bredow
I want to recreate the parallax style top navbar from Tinder. The parallax effect is already working nicely but I would also like to add gradients to the .svgs (at least in their active state). "gradient" doesn't seem to work. Any tips? https://framer.cloud/ubOtD
4

February 13

Jamie Charlesworth
Created my first path animations :'D
7
Jeff Romi
Is there a function that allows me to do load stateCycle as soon as I press next page button and prototype loads : https://framer.cloud/IcHfj
1
Maximilian Bredow
*My Wishlist for future Framer Studio releases* Hey there, I am returning to Framer after a 2 month break, so I am only now learning about Frames vs. Shapes. I read about the initial confusion but having skipped v108-v110 and rejoining the party with v111 I feel the distinction between both is pretty clear. First of all, I must applaud you: the ability to create and manipulate SVGs is a huge game changer for me! It made Sketch almost redundant for my purposes, and I feel the design tab of Framer is actually easier to handle and quicker to learn than Sketch. I also love how I can export screens and now collapse elements in the layer overview. I used to work only in the code tab, but with the recent changes the design tab has become very useful to me! In just one day I created an app storyboard from scratch with 12 screens - I would not have been able to do this before Frames/Shapes. Framer already is my favourite prototyping tool by far and I also like how close I am to the developers via the Facebook group, sometimes receiving answers within minutes. That said, there are a few features I'd love to see in future versions to make it even better: - Crop images. I know this is kind of possible by inserting it into a frame, manipulating the frame and clipping the image. But I wish I could simply manipulate the image directly - More easily readable layer menu on the left: Right now I feel it's quite hard to differentiate one element from another. Frames that are screens look the same as frames that act like folders containing shapes. Each icon is quite small and in the same colour and often I didn't see the arrows properly. In Sketch, the screens have a separate background colour, folders are blue, all icons are twice the size (the arrows probably even 3x), and shapes actually are displayed with a miniature version of my shape. Also, how about renaming new frames to "Frame 2" etc. whenever there is already a frame with identical name in the same location? - Quick&Dirty preview mode for viewing all screens, without having to set links in code. I have now 15 screens but I always manually copy&paste the screen I want to see to the very top left because this is the one that my previewer will show. I wish I could just swipe through them like a slideshow if in the code tab there is not any line of code - I might have missed this, but is there a way to resize a frame to fit its content? What I do right now is I create a new frame, move it outside of the old frame and delete the old one. I'm sure I could do this more efficiently - More shapes! E.g. triangle shape, or basically (almost) any shape that PowerPoint supports. I am not very good in creating shapes so I ended up reusing elements of the icons a lot, e.g. the check sign. (I know the triangle is possible by creating a polygon with three sides - but it wasn't that straight forward for me) - Round edges on custom shapes - Export all artboards to one pdf - Make icons more prominent. As per the introduction of Frames, the icons have become a lot more useful to me. I use them to quickly extract entire icons or parts of them as paths. - Radial gradients and gradients with more than 2 stops - Gradient text (not sure if the developer will hate me for this but at least Sketch and PowerPoint support it so I think it should be possible in an app as well) - More templates! I love how kits are now embedded in the welcome screen and I used the iOS one a lot. I wish I could the other templates you have created in the past here as well (eg Fiber, Voyage, etc.). For the iOS template, I'd love it to include a chat view, e.g. iMessage. I ended up recreating my own but I think this effort could have been avoided - I wish CMD+1 would would zoom to fit all artboards but currently it is set to the best predefined zoom levels (10%, 25%, etc.). Alternatively, you could add a few zoom levels? - Window -> Zoom maximizes my window but doesn't seem to influence the zoom level. Is this intentional? - Import a shape layer directly from Sketch (cmd+c) into Framer (cmd+v). Currently, Framer imports an image layer, but if I export from Sketch to SVG and import that file to Framer it works pretty well - Sometimes I can't seem to set direction of my gradient. Removing the gradient and adding it again fixes the problem. Bug? As always - great work on an amazing product!
3
Alexandre Lordelo
Hey guys, The iOS iPad app is showing a different font than Framer Preview. How can I fix this?
2
Kamaljeet Dhiman
Hey fellas! I see that there is no way to officially record a video of prototypes. I tried using Quicktime but it is too jittery, even on my maxed-out 2017 Macbook Pro. Any advice on how I can achieve smooth video?
8
Luke Warda
Connecting to API that requires Token Hey folks, I'm trying to connect to an api that requires generating and passing a token to verify the request. I want to display a random artwork from artsy api https://developers.artsy.net/start https://www.npmjs.com/package/artsy I've tried following the npm route but no luck Any advice where to look? Here is what I have https://framer.cloud/qgSLN Thanks!
0
Luis Escobar
Is there a function that allows me to do something as soon as the prototype loads? onPageLoad or something like that? Thanks
3
Aalok Trivedi
I come across this a lottttt. How do I stop this from happening? I've deleted the layer and created it again. Still want's to add that _1. I know this happens when you duplicate a layer. But it usually fixes the name when I rename it
2
Muhammad Athar
A quick question from Framer people. Since a huge community is building a large number of modules which has become hard to keep track of, Can Framer people please help us with something like this?
3
Maximilian Bredow
Is there a way to lock the prototype orientation to portrait? Framer can set default orientation and listen for rotation of the device. But is it also possible to simply lock orientation at portrait? When I hand over my phone for user testing it sometimes rotates the screen and I would like to disable that for a more robust first impression. I know I could set my iPhone on rotation lock but I always forget to do this. Thanks! PS: This has been asked before but that was in 2015 or 2016
2
Alan Museljic
Why is the rotation origin axis on objects not the same in iphone app as it is in desktop simulator? In desktop simulator it's in the canter of the object but on iphone it's top-left? Any tips on how to fix that?
2

February 14

Ina Moon
https://framer.cloud/dUCjl Hey all, this is driving me crazy. I would like to trigger Spring animation for "icon_reply" by dragging the "talk_balloon_1". This interaction should work EVERY TIME I drag it, though. But how? Massive thanks in advance!
4
Oleg Frolov
Hi! Finally I tried SVGLayer (Path animation, especially) in Framer and it turned out awesome as I had expected. Great!
0
Bhaskar Ravi
When working with text, is there any way to bold a specific word (say the first word) programmatically? thanks in advance!
2
Keith Lang
I'm on v111. When I ask for frameGroup.children I see something like `» <SVGLayer id:93 name:.SVGLayer (0, 0) 76x76> Wondering if this is new, and a bug?
10
Patrick Keenan
With the latest update I'm getting an error when trying to copy frames. The layer is not an SVG layer: Error: SVGLayer doesn't support `copy` when the layer has one more children
5

February 15

John Smith
Is there a way to override the darkening of the background when apply the overlay option with a page component?
6
Abby Walter
Probably a very simple question, but can't figure it out. I have several elements that have the same on click action. Is there a way to write this so I don't have to keep repeating stuff. I thought this would work, but it doesn't.
2
Daniel Roeven
Hi everybody! I'm looking for a way to make two (or more) Pinchables simultaneously. The standard Pinchable doesn't allow four fingers to pinch two object at the same time (it only tracks the first pinch). Thanks in advance!
0
Ania Banaszek
Hello! I'm trying to build a very simple list with radio buttons. In a design tab, I have a 'list' frame with rows containing radio buttons (checked version on top of unchecked). I can trigger the checked radio button to show up on click using the code below but I can't figure out how to disable all other checked buttons in other rows. And ideas how to solve this? for layers in list.children layers.onClick -> this.childrenWithName("radio_checked")[0].opacity = 100
0
Márcio Ribeiro
Hey guys, I'm getting this error when testing a prototype with Desktop Chrome when mouse over/mouse out/ on click an element: "Uncaught TypeError: Failed to execute 'multiply' on 'DOMMatrixReadyOnly': The is2D member is set to true but the input matrix is 3d matrix". It works fine on Desktop Safari and Framer Preview. Any clue on how to solve it?
1
Jordan Robert Dobson
Is a symbol a class?
10
Paul Kooi
anyone know why this isn't repeating?
3
Thierry Meier
Guys, what is the state value of the default state of a Layer? Example: You switch to a different state via layerA.states.switch("foobar"). Now, you want to switch back to the default state you have declared when you created the layer. layerA.states.switch("default") does not work ;p.
2
Colin Sygiel
Hi framers, does anyone know how I can animate many layers with different coordinates away from a single origin centered in the screen? The idea is that all layers would move in opposite directions (180 degree angle) compared to where the "parent" origin is.
3

February 16

Colin Olphand
Hi guys, I'm having an issue trying to change a text layer content with states. When the content is some text it works, however what I want is numbers. Upon the stateSwitch (triggered from the heart icon), Framer tries to add the numbers together and I end up with a series of NaN. I simply want the text to change from 3 to 4. Any help ?? Thanks !!
2
Dong Jae Cho
hey guys if there any function in framer that uses concept of probability? For example, can we make a button disappear when I click it in probability of 80%?
3
Maximilian Bredow
*Updating layer dimensions/positions from event* I have a pageComponent nested within another pageComponent. I managed to create the click events and Clicking/dragging for next/previous picture works fine. But on the "click bottom for more" I have several issues: 1. When expanding, the event dimensions do not update with the dimensions of the "detail" state. A frame from Design Tab would update its position and dimensions but not a layer from Code Tab. 2. When I collapse it again, the slideshow jumps back to the first slide, away from the slide that I had expended 3. the animation is painfully slow in Framer Studio on my 2017 MacBook Pro (but it's fine on my iPhone and on Framer.cloud) How can I fix this? Many thanks!
0
Vicky Lou Fox
Hey all, can anyone help me with targeting siblings of an array of layers? I want a piece of text to move when I hover over the picture, which is it's sibling SO, how do i combine: picture.onMouseOver -> text.animate y:288 WITH for layer in [picture1, picture2, picture3, picture4, picture5, picture6] Thanks!
1
Théo Lebert
Hi guys, do you know if it's possible to link apps such as MyScript Stylus to Framer ? It's an alternative keyboard that allows to do some cursive writing
1
Joe Puddle
Hi, I am having trouble with layer orders and cant seem to work this out. In the framer file there is a image (background layer) and a red box (foreground layer) but for some reason once I create a scroll component the background layer is above it. Any one know how to solve this and keep the layer order from the design tab? I have tried using bringToFront, PlaceBehind and placeBefore... basically every variation. https://framer.cloud/nNvvG thanks for any help!!
1
Rúnar Guðbjartsson Jr.
Hey there. So I'm creating a prototype using: "flow.showNext(layerA, animate: true)" Is it possible to manipulate the animation itself? So without using "transitions" and use ".animation" or "animationOptions". Like speed up the animation or adjust the different curves or opacity. If so, what is the right syntax?
1
Marc Krenn
Just a simple, yet handy method to make a Layer look at a given point.
6

February 17

Herje Wu
Quick question: I have a tap event but if you drag/scroll starting on the button it causes the tap event even though it's not really a tap. How can I prevent this? Thanks!
17
Jason Valalik
Hello - are there any events that I can call on Layer Loaded/Page Load/ Page Viewed?
3
Stephan Orme
I'm having problems getting objects create in Design mode to associate with a class, this is the code, can anyone tell me how to fix this? Project is here: https://framer.cloud/dYspB
2
Colin Sygiel
Hey framers, I am running into a problem where when I run two animations with a specific set of properties on the second animation, the first animation doesn't work. In my case, the first animation is switching between states of the star layers for "twinkling" effect. The second animation (Grow()) moves all the stars in the opposite direction of the center point. This works, however as soon as I try to add properties: opacity and scale, then the first animation no longer works. Any ideas what the problem is here? Project link: https://framer.cloud/OAmIz
0
Alexander Artsvuni
Hi. I have a .onTap event conflicting with pageComponent. When you try to 'swipe' tap triggers immediately as you are touching the card. Does anyone know a workaround or a fix?
7
Neil Everette
In the new Framer studio, I'm having trouble with tap events firing during scrolling events. Is there a way to prevent this? Sample file included
15
Alex Heidarian
Hey all! Great to be in this group. I'm rather new to prototyping with Framer, and have a question about state: I'm currently trying get my animation to cycle back and forth between states. Specifically in this prototype, I have a button that, when pressed, will make a box rotate and scale (the button also has its own state where it "presses"). Once the button is pressed again, I want the box to revert back to its original state (the same goes for the button). I've made two states for each object—a state for changing, and a state for reverting. However, what I've noticed is that once I try to click the button after the first state cycle, I find that I have to click it again to repeat it. Basically, what I want is: click 1: change, click 2: revert, click 3: change, click 4: revert; so on and so forth What I'm getting instead is: click 1: change, click 2: revert, click 3: nothing, click 4: change, click 5: revert, click 6: nothing, click 7: change, click 8: revert; so on and so forth. I tried to simple create states for changing, without any reset states, and while this solves the problem, it throws off the timing properties. Prototype here:
0
Tim Kjær Lange
I want to mass create layers using a for loop. I know that I can name each layers programatically using string literals, as seen in the attached screenshot (the out-commented bit). But is there a way to name the “layer” string that I highlighted with the red arrow? I want to be able to select these layers individually without using the Layer.select method.
6

February 18

Wang Shiyun
Hi Framers, I am making a prototype with a continuous menu, trying to let navigations move along with the scrollComp. I made it somehow, yet when I click, the animation is quite slow. I wonder if my code is efficient or not. New to framer and hope someone can help, thanks!
0
Prakhar Shivam
The screen area other than the card stack remains dim without any code by default. I don't know why is this happening? Please help!
2
Joe Mallory-Skinner
Hi all, This is my first outing with Framer and I've been playing around with Mapbox based off of an example by Jacky Lee (thank you!). I'm trying to find a way to get the Mapbox Camera Center Position in real time. The idea being that when the Current Location is out of view then the Location icon (bottom right) goes pink and the Plus icon moves down. Any idea on how to do this? Jordan Robert Dobson maybe?
0
Lukas Guschlbauer
Hey! I‘ll be in London from 27th to 28th for the Framer Meetup. Anybody who wants to meet up before the meetup? 🙂
1
Maximilian Bredow
I want the position of a tap, which should not conflict with dragging the same layer. When using .onClick, it works fine in the Studio Preview and Chrome but not in iOS preview as my iPhone returns "undefined" for event.point When using .onTapEnd, my phone recognizes my tap with the correct position but I have troubles with conflicting tap and swipe events. What is the best way to handle this? I would love to have something about this written in the Docs. Topics in this Facebook Group I found were quite old already
1
Alex Heidarian
Is there a library/feature for prototyping with hardware vibrations? For example, when the user taps a button, the interaction triggers a device vibration.
1
Alex Heidarian
Is there a way to lock orientation via CoffeeScript?
1

February 19

Maximilian Bredow
What does the underscore identifier _ mean? I've come across an underscore identifier a few times now, like _.debounce or layer._previousScreenFrame.x Typically in the more elegant solutions that I fail to understand. What does this _ mean in Framer prototypes? Are there any tutorials, blog posts, examples that I can read to understand this better?
6
Jason Sparks
I’m using flow component’s custom transition to have a search overlay screen drop down from below the header. It works but for some reason it is stretching the height of the search overlay rather than maintaining it’s height so it doesn’t cover the full screen. Any ideas why this is happening?
1
Maximilian Bredow
EDIT: Solved. Had to change onClick to onTapEnd. Updated prototype link with my solution Click Events in PageComponent In my prototype, I have a PageComponent on which I want to be able to click, but avoid click events while dragging. I read about .isDragging but I failed to implement this. What is my mistake? Thanks! Example Prototype:
2
Anna Klindyuk
How do I open framer.cloud links using the Framer Preview app? The links open only in the browser :( this is very uncomfortable
2
Gracjan Złotucha
It's anyone experiencing issues with animating borderRadius at v111?
1
Haseeb Danyal
Hi, I'm using mapbox in framer. Trying to add custom markers but I'm getting an error: https://framer.cloud/FisRb. Also why in browser is the map displaying so small ?
1
Karthik Vadlapatla
Hi everyone! I just started learning Framer. I know CSS well but only bits of JS. Most tutorials online use older version before frames update. Which would be a good and comprehensive source. I prefer reading to watching
3
Adam Deher
SVGPath.width error Hey, I am getting an error attempting to animates the states of Shapes. Is this a bug, or am I misunderstanding how to manipulate shapes? Link to example:
0
Dong Jae Cho
hi, is there any way I could use page component and scroll component at the same time? They are causing errors when I used both functions at the same time.
0
Kasper Germann Kramme
Greetings everyone. I was hoping that someone could give me advise on how to make an animation setup like this (the App store app). Is it possible to do it so that I will be able to use it repeatedly in a loop? Where do I begin? Flow, states? Any help would be much appreciated. Thanks :)
3
Josh Peters
My number conditional logic knowledge is total crap. In the included example "low" and "high" work, but default doesn't. How do I write the IF statements to either be ranges of numbers and if I wanted to, exact number values?
5

Monthly archives

2018

2017

2016

2015

2014

2013