Hi! Just wrote a module that makes it easier to work with text inside Framer.js. Let me know what you think! https://github.com/awt2542/textLayer-for-Framer
Johannes -- using this module, and contentEditable: true. listening for the events, but all i get is a KeyboardEvent with one field (isTrusted) available...how do i get the key pressed? couldn't tell from the code...
Jon Madison I'm not sure I understand exactly what you need, but when I have listened for changes with a textlayer I usually listen on the document and do something like this: https://framer.cloud/SemCb
it's a heavy hammer to listen to the whole doc, but you gave me the proper field to listen to--.which -- works fine when listening on the text layer, thanks so much!
Cool! Can it do auto-height? That would be super useful.
Josef Richter try layer.autoSize = true and see if that works for you. It automatically scales the layer to make room for the content.
Awesome and super useful! 😊
Awesome. When using a text layer, just setting its style.contentEditable to true makes it a text input box
great idea Johannes Eckert. just pushed an update with contentEditable as a property. now you can just use layer.contentEditable = true. included a fix to make it work inside Framer Studio, too :)
Josef Richter I've added a separate .autoSizeHeight property. Now you can make fixed width columns with variable heights. Great for lists. See example: http://share.framerjs.com/a4tscclssj5j/
Is there a way to add in a line break, like <br> or \n — these characters are encoded, which probably makes a lot of sense, unless you want a new line of text
Johannes Eckert fixed! .text is now just a syntactic sugar for .html. should work nicely with <br>, <strong> and other tags
Very nice! Something I've been looking for :)For just text inputs I created this one some time ago https://github.com/ajimix/Input-Framer
Adria Jimenez yeah -I borrowed the setup property to keep things consistent with your module. :)
Hello guys,If I make use the layer.contentEditable = true, would that mean that a keyboard opens up when that layer is in focus? Or do we have to manually open the keyboard? I tried using it but I can't seem to edit the text... Maybe I'm missing something?
LOL nevermind guys... I used = instead of : haha and there I was trying to solve the issue for 30 minutes already... silly!
Hi, I love this module, but when I tried to use custom fonts and preview using frameless it defaults to a serif font, is there something I might be doing wrong
Andreas Wahlström What do you mean about .text as a syntactic sugar for .html? I'm trying to get <br> to create line breaks, but no luck
oh got it, you have to use \n
I changed it back since it created some issues. I think you can still use .html though.