Live data from Hacker News

Draggable objects

redblobgames.com

91–100 of 147 posts

Re: Draggable objects

#91
Is there any way to reduce lag between pointer and draggable?

I once tried throttling updates via requestAnimationFrame but it didn't help much. Perhaps movement prediction?

Re: Draggable objects

#92

One thing missing: accessibility. how ought facilitate drag using keyboard controls?

I think that's a bit off base here. It's like asking how does a keyboard user facilitate click-and-hold to pan the canvas in a drawing program? They don't. Panning with the mouse (or dragging objects) is one interface. The task is panning the canvas, the means to achieve that are varied.

In my example, the answer to the question about accessibility is to additionally provide keyboard controls to complete the task (preferably ones that don't - or optionally don't - require holding a key). For example perhaps a key shortcut to enter a pan mode, in which the arrow keys move the viewport around the canvas. Problem solved.

As for draggable objects, the task is re-ordering. How do you make that accessible? Provide an alternative means to re-order objects, perhaps using TAB to cycle focus through the objects, then a key to select the focused one, and use the arrow keys to move the drag preview to the nearest valid position in that direction.

Re: Draggable objects

#93
post #91

Is there any way to reduce lag between pointer and draggable? I once tried throttling updates via requestAnimationFrame but it didn't help much. Perhaps movement prediction?

The cursor is often rendered with special GPU acceleration like when using Hardware Cursor, making it as responsive as possible, but that does mean there’s always going to be a slight delay for the draggable object

Re: Draggable objects

#94

This article is about dragging, and I've run into all of the pitfalls and come to the same solutions that Amit talks about. Excellent article! One of the hardest things I have needed to code from scratch is drag-to-reorder. It seem so natural from a user perspective, but when you get into inconsistently sized items, having to create placeholders between items, detecting edges, going down rabbitholes of box-fitting al…

Same. It’s such a simple idea but execution can be brutal. I also took drag select for granted for years too.

Re: Draggable objects

#95
In the distant past, there was this NSF-funded geometry center in Minneapolis. There was a computational group theory conference (these guys are over the top) and they invited a few mascots from neighboring fields. I had written a system for algebraic geometry, and got an invite. I'd get up really early in the -20F cold to insure a Silicon Graphics workstation for the day, and set about coding a game to better understand group generators and relations.

It involved dragging.

I loved the 2am conversations that resulted. My idea was that dragging need not respect real-world physics. Dragging should feel like a great tab of acid. And everyone was into this, everyone had ideas.

Re: Draggable objects

#96

This article is about dragging, and I've run into all of the pitfalls and come to the same solutions that Amit talks about. Excellent article! One of the hardest things I have needed to code from scratch is drag-to-reorder. It seem so natural from a user perspective, but when you get into inconsistently sized items, having to create placeholders between items, detecting edges, going down rabbitholes of box-fitting al…

[deleted]

Re: Draggable objects

#97

Am going to chime in as well - Amit is amazing and has been providing his knowledge and experience since the early 90's, when I first encountered him on FidoNet over BBS, then next on Usenet. Regular tech blog: https://amitp.blogspot.com/ Game Dev blog: https://simblob.blogspot.com/

Oh wow, FidoNet, that brings back memories. :-) I still miss Usenet of old.

Re: Draggable objects

#98

Amit Patel is the man. I always say his last name like Matthew Patel says his name in Scott Pilgrim. Side note: Sebastian Lague is great too.

> I always say his last name like Matthew Patel says his name in Scott Pilgrim One of the seven evil hexes :D

"PUH-TELL" with the fast Michael Jackson version of the Indian head wobble

Re: Draggable objects

#99
post #46
post #43

Earlier quoted context omitted.

Can you please nominate a specific URL on your site that we can change the top link to? (see https://news.ycombinator.com/item?id=37707904 for why) What's your most interesting piece that hasn't gotten sufficient attention yet? I believe HN has had many great threads about the A* and hexagonal grid articles over the years. Is there a comparable one that's been overlooked so far?

This year I've mostly been updating existing pages in small ways (examples: [1] [2]). This week I've been fixing broken links, which isn't a good HN submission. I think the best candidate is https://www.redblobgames.com/making-of/draggable/ . It's from earlier this year and hasn't been posted to HN yet (I think). [1] https://simblob.blogspot.com/2023/04/explaining-hexagon-layo... [2] https://simblob.blogspot.com/2023…

I'm building out menu systems and information panes for a hobby game right now, and was just starting to wonder about how to make them draggable, so this is exactly the topic I needed. Thank you!

Re: Draggable objects

#100
Love this.

I was just implementing dragging an SVG element in a Vue app earlier this week, and had to discover pretty much everything the author describes in the article, even in the same order the author describes them, and ended up with pretty much an identical component to do so (except I wrote a composable utility `useDragging` instead of a functional component ``).

Post reply on HN