Copy link to clipboard
Copied
I'm making a dial, the range is 0 to 100. So far people can drag it, like they are adjusting the number. The problem is, when drop (release the mouse button), it always jumps to 100 because I set the end frame (the next artboard) to 100.
Now for a more realistic experience, the client is hoping for dropping at any number. Under the current logic, I have to create every variation which means 100 artboards. Is there a smarter way to do this?
Thank you.
Copy link to clipboard
Copied
Hi Shanechen,
Please correct me if my understand is wrong, to move from 1 artboard to any other artboard (2- 100), instead of creating 100 artboard , do we have any other way instead of creating 100 artboard.
Sorry that feature we still dont have. You can make use of compoment and states. Hope it will help you.
Thanks,
Vertika Gupta
Adobe XD
Copy link to clipboard
Copied
Hi Vertika,
Thanks for your reply. Sorry, I'm new to the program so maybe I didn't describe it clearly with the right terms. I prepare some images and a demo file to explain the situation.
so I made this dial. you can drag the white circle button and turn it to 100. The number in the center and the green bar change accordingly. But when I release, no matter where the white button is, it either goes back to 00 or 100.
I want it to stay at where it is dragged. Like 40, 75... so it feels more realistic.
Is there a way to achieve that without creating new artboards? Thank you!
You can find the file here.
https://xd.adobe.com/view/14a2db40-2bde-448f-7f7b-bacd07c8d6d4-6293/
Copy link to clipboard
Copied
Hi Shanechen,
I feel, we have to create different artboard to make it work.
Can you please share XD design document of above design with me, you can mail me directly you can find my email ID by clicking on my name or you can post it directly in this channel only, so that i can look into design how you created if we can do any modification in design to make it work.
Thanks,
Vertika Gupta
Adobe XD
Copy link to clipboard
Copied
This would be easier to do if we could switch between component states with a drag trigger, which I just noticed we cannot do.
@Vertika Gupta why cannot we switch between states with the drag trigger? You can switch with a tap and auto-animate, and drag is basically manual auto-animate, so it should be easily possible.
@shanechen7 currently you will have to make a separate artboard for each number you want to be able to stop at. Also, you will be able to drag only to the stop number, so if you make 10 artboards for the round numbers, from the first one you will only be able to drag from 0 to 10, on the second one from 10 to 20 and so on. You won't be able to make it smooth, drag to a number and go there directly.