×

Responsive resizing of a text

Hello,

I would like to make a responsive text, what I mean by responsive is that I want the size of the text to reduce if the size of the device is reduced (or the size of the container is reduced). Not just the size of the text box, but the text size.

I think I understand how to make elements to resize responsively to a container. I already did this with the icon of the sun in the screenshot below.

So I tried to do it with the text the same way I did for the icon, but it doesn't work.

I've already checked this thread : https://support.invisionapp.com/hc/en-us/community/posts/360032172032--Invision-Studio-Design-for-all-mobile-devices-

And the "groups and containers" part in this page : https://support.invisionapp.com/hc/en-us/articles/360000096723-Inspector

I was wondering if I could make it with invision studio, because when you create a text, you have to specify the size of the text with pt, but you cannot specify the size of the text with %.

Maybe that's why it cannot work ?

Thanks in advance,

Olivier

0

Comments

Please sign in to leave a comment.

  • Avatar
    Shaina Torgerson

    Hi Olivier,

    First off, I want to thank you for checking out our Help Center and other posts in Community related to your issue! We are currently tracking interest to add resize handles on text fields in Studio so that they can be resized by dragging the handles, rather than having to set properties. Is this the type of functionality you are looking for?

    If not, please let me know, and I'm happy to look into this further for you.

    Thanks,

    Shaina

    1
  • Avatar
    Olivier Baudry

    Thanks Shaina for getting back to me.

    I was looking for a functionality that adapts the size of the text automatically depending on the space that is available on the device.

    For example, in my screenshot above there is the same design on different devices : iphone xs and iphone se.

    You can see that the sun is not the same size on xs than se, it has resized because it is in a container.

    I want to have the same effect with text. I want the size of the text (Paris 23°) to be reduced automatically on iphone se because currently this text is overlapping the sun.

    I hope it does make sense :)

    Thank you

     

    0
  • Avatar
    Shaina Torgerson

    Hi Olivier,

    Thank you very much for clarifying! I definitely see the issue you're running into and was able to replicate similar behavior myself. That being said, I would like for our Support team to take a closer look at this.

    I will be opening a ticket on your behalf with our Support team requesting additional information for troubleshooting. Please look for a message in your inbox soon and respond with the requested information.

    Hope to get things sorted out for you soon!

    Thanks again,

    Shaina

    0