Request details

Scrollable Area (not scrolling whole artboard)

Define a scrollable area within an artboard

This provides real-world app use cases, such as a table, slideshow, or iOS dropdown lists.

4,154 votes
Sign in
Check!
(thinking…)
Reset
or sign in with
  • facebook
  • google
    Password icon
    Signed in as (Sign out)

    We’ll send you updates on this idea

    Peter DiBartolo shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

    253 comments

    Sign in
    Check!
    (thinking…)
    Reset
    or sign in with
    • facebook
    • google
      Password icon
      Signed in as (Sign out)
      Submitting...
      • Abdullah Anis commented  ·   ·  Flag as inappropriate

        Please make this feature Adobe Pleaseeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee.

      • Justin Jack commented  ·   ·  Flag as inappropriate

        It goes without saying, that our websites and apps sometimes scroll! Until yesterday, it was impossible to emulate scrolling within XD.

        Making a given screen, or artboard rather, scrollable is fortunately very easy.

        Let's say you have the following artboard (by the way, I copied this from the Google Material Design UI Kit within Adobe XD), and you want to simulate scrolling of this list of names.

        Notice the red Viewport Height section. This is the viewable area by default.

        If you want to make this artboard scrollable beyond that height, you simply drag down the bottom of the artboard:

        Notice the dotted horizontal line, that's the Viewport Height. Anything below this will become scrollable content.

        Let's drag the bottom Name group down to the bottom: https://whatstatus.co/whatsapp-dp-images

        Now, click on the play icon in the upper right, and wala! We can scroll down!

      • My Anime commented  ·   ·  Flag as inappropriate

        To every one of you who needs to demonstrate models. Put a square shape behind the zone that you need to look into, at that point let your scrollable look behind the square shape. That way it will "look" genuine atleast.
        http://mangazuki.me/brawling-go

      • A1D commented  ·   ·  Flag as inappropriate

        Hi there,
        Is there any news about this feature?
        When we shall expect this?

        Thanks!

      • Anonymous commented  ·   ·  Flag as inappropriate

        I think, it's a must-have feature to scroll areas vertically or horizontally. I know there are some workarounds, but they are just not professional.

      • Anonymous commented  ·   ·  Flag as inappropriate

        Someone suggested this "To all of you who needs to show prototypes. Put a rectangle behind the area that you want to scroll into, then let your scrollable scroll behind the rectangle. That way it will "look" real atleast."

        I also thought of this, however, it is not possible when using blurred backgrounds or images with transparency.

      • Brad commented  ·   ·  Flag as inappropriate

        look at framer x, it needs to be exactly the same as that.

      • Reinoud Schuijers commented  ·   ·  Flag as inappropriate

        For now, just group all elements apart from the scrollable area and make them fixed when scrolling. The effect is the same.

      • Anonymous commented  ·   ·  Flag as inappropriate

        To all of you who needs to show prototypes. Put a rectangle behind the area that you want to scroll into, then let your scrollable scroll behind the rectangle. That way it will "look" real atleast.

      ← Previous 1 3 4 5 12 13

      Feedback and Knowledge Base