Widgets & Docking Stations
Yesterday saw the basic dashboard layout finalised, with the exception of final widget placements which needed some adjustments. This can be seen in the screenshot to the left. And I mentioned that I'd be working on docking for workspaces next, rather than docking for widgets. However given that the challenges are essentially the same in both cases, but the challenges are a bit greater with the widget docking, I decided to take on these challenges first today.
The reason the challenges are greater is because of the interaction of the widgets with multiple potential docking positions on the dashboard in close proximity. There's also the fact that with controls, there are no built-in drag-and-drop functions when locating these relative to other controls (at least none that I'm aware of, and please don't tell me if there are any after I've spent all day coming up with a manual method because I may just lose the remaining fumes of brain that I have left).
Plus if you've ever used drag and drop with images, for example, you'll know that you can't just drop the image anywhere, which is needed for users moving widgets around. I want the dashboard to be as customisable as possible. So after mapping the docking stations on the dashboard, and working out the activation ranges for each widget, I then used a method I've used before for moving controls by calling on "base.OnMouseDown". However that suspends things like click events, meaning that the initial activation of the docking stations on the dashboard was not happening at first.
Once I got around that, I then needed to find a way to update the dashboard as the widgets move. This means that when a widget moves into or out of range of a docking station, these need to be activated while the user is moving the widget rather than only when the movement stops (which is when the "OnMouseDown" method is called through completion.
To achieve this, I set up a timer loop that checks the status of the widget movement and dock activation. This took some time to get working right because the greater the polling rate of the timer, the greater the chance of the app glitching/freezing. For now, I have it working well enough with a polling rate of 10 times per second. So the movement of the widgets should feel responsive enough in terms of docking stations being activated. And with all of that worked out for one docking station, I then repeated it for the remaining ones.
At this stage, users will be able to move each widget around the dashboard to any point they wish. If the widget is hovering over multiple docking stations (as in the screenshots here), then the widget will not dock when the mouse button is released. The widget will only dock if a single docking station is active/highlighted.
I also discovered that I am able to function (albeit minimally) with 99% of my brain on fire 🙂
Stay awesome,
EMH
HOW MOOVPAD IS BEING BUILT
For the overview of how MOOVPAD apps are being developed, the reasoning behind particular decisions during development, policies, and more in relation to all the technical things, please see the link to the left.
This will be an ongoing work in progress, and will always be linked to the bottom of each upcoming Blog post.