I'm currently using the Surface SDK 1.0 in Blend and VS2008, and I've encountered a problem: I use a scatterview over the whole screen. I also have a grid in the middle of the screen. The panel in the middle is quite annoying because my scatterviewitems can easily get lost BEHIND the grid, and since the grid is locked in position, there is no way for me to retrieve them.
It would be desireable to add "walls" around the grid, so that my scatterviewitems would bounce off it, as it does at the edges of the scatterview.
How can I solve this problem?
Just hook up to "ScatterManipulationCompleted" and check if the item is under your grid. If yes start a Storyboard which moves the Center of your ScatterViewItem back out of the grids background.
Also take a look at the surface community forums, there are a lot posts regarding ScatterViewItem and collision detection.
Related
I have created a usercontrol that is essentially a text editor (using Graphics.Drawstring in OnPaint).
I have set AutoScroll = true, and AutoScrollMinSize values appropriately. Everything is working how it should...
EXCEPT, i would like the control to scroll itself WHILST I am currently scrolling (i.e. click and drag the scroll bar... and whilst it is being dragged the control should be scrolling the entire time). At the moment it only scrolls when the scroll bar is released (mouse up).
I have tried implementing _Scroll and invalidating the control, but that just makes it flicker uncontrollably.
I cannot find any examples online for this, due to it being difficult to describe!
Can anyone point me in the right direction please?
Control.Invalidate() will make something flicker badly. I faced this problem drawing cross-hairs over a mouse position on a PictureBox drawing a line chart before. The trick is to use (and I cant remember which one is best to come first)
Control.Update();
Control.Refresh();
in the Scroll event. Depending on what else you are drawing in the Control and how you are drawing it this may be better for you. Also this is tested on PictureBox, Control may be another matter.
I've been searching for awhile, but haven't been able to find anything. I'd like to be able to add kind of a glimmer or sparkly animation on an image element in wpf.
Essentially the effect here I'm after here is the same that you get with trading cards that are "foil's".
I'd like to have an image, and then be able to add this animation to it at will. I'm thinking maybe some kind of user control, or template possibly. Hopefully generic enough that I can just toss an image at it and it will just overlay the image and run.
Any ideas?
A simple construction that easily can be turned into a control is by nesting the image in a Grid and adding a second Grid (on top) as a sibling.
De second grid can be given a linear gradient brush that is primarily transparent but does contain a white glimmer.
This brush can be animated; you could move it and change the opacity of the grid/brush.
This way you do not change the image.
I have a WPF scrollViewer that I use for panning (MouseDown, MouseMove, MouseUp) and I would like to include an acceleration effect that incorporates inertia. So, if the mouse moves beyond a threshold speed and I release the mouse, it continues to pan but slows down as a function of the initial speed. Any ideas, thoughts or examples?
I've done basically this before and started by looking at ScrollViewer but in the end threw it away and used a Viewbox with a Canvas as the child for absolute positioning of content (I was supporting zoom aswel as scroll, it was basically DeepZoom without the scaled images for zooming so there was pixelation when zoomed right in). I wrote code for determining the gesture direction and the speed of the gesture from the mouse events and converted this to a scroll direction and speed and then animated the Canvas.Left and Canvas.Top properties of the scrollable content (which was in the Children collection of the Viewbox's child Canvas) with DoubleAnimation. It worked well, however there may be a better way...heres a thread suggesting hosting DeepZoom in WPF via a Frame control (although I wouldn't do it that way).
EDIT: Basically the ScrollViewer was just too restricting. Even if you get into the ControlTemplate and get references to the ScrollBars directly, it is the position of the Thumb of these scrollbars that you would need to animate and I'm pretty sure this is what I found I couldn't do (it was almost 3 years ago :)
I have an app with a bunch of controls in it and I want to place a set of cross hairs on top of it. My first attack used a PictureBox and ran into this problem. The solution that fellow proposes, seems a bit... verbose for what I need.
Is there a simple way draw on top of my form? Note that I don't even need the drawing to be part of a control as it doesn't need to do anything but just be there.
This eventually worked. I had to play some games though because most of the controls I wanted to draw on were not where it expected them to be.
Also, it ran into issues when controls were moved; it failed to redraw and stuff moved with the underlying control. This was fixed by forcing invalidation from the move event for anything that might move.
Does a PictureBox with a transparent image have the same problem as a Panel with BackColor set to Transparent? I'm thinking you could have a PictureBox with the crosshair image in it and move that around, instead of drawing it yourself...
I'm trying to modify the default graph viewer of the Graph# library because its user interface is awful (just try dragging a node outside of the boundaries, you'll see!)
The basic setup is this: there is a GraphCanvas control (inherited from Panel) which has children of Vertex and Edge control types. What I want to achieve is:
GraphCanvas has scroll bars if the contents do not fit in the screen;
GraphCanvas can also be scrolled by "dragging" it (just click on an empty space and drag);
GraphCanvas can be zoomed in and out (via CTRL+mouse wheel);
Vertices can be dragged around. If a vertex is dragged outside the current boundaries of GraphCanvas, the boundaries are increased. The scroll bars should reflect this, however the current viewport should not scroll away while the vertex is being dragged . The same goes if dragging a vertex reduces the boundaries of GraphCanvas - it should stay the same size until the drag operation is finished and resize only then. Automatically scrolling the viewport during a drag operation is awfully confusing and easily introduces dragging errors. See the original implementation if you want to know what I mean.
Although I've got a fair bit of experience with .NET, I'm still a complete beginner in WPF. My current attempt is (in the measure/arrange layout phase) to give each vertext the XY coordinate it desires (even if negative) and implement zooming/scrolling by handling mouse events on the GraphCanvas and modifying the RenderTransform property. Dragging just changes the XY coordinates on the specific vertex (probably triggering the re-layout of the whole thing which would be nice to avoid too). Scrollbars are implemented by placing the GraphCanvas inside a ScrollViewer and implementing IScrollInfo on the GraphCanvas.
Unfortunately there seems to be a problem: I can get mouse events on the GraphCanvas itself only if it has a background at the point. That would be OK, I want a white background anyway, but in the negative coordinates of the GraphCanvas it does not draw the background - and thus does not respond to mouse events.
I'm also wondering if I'm doing the Right Thing by allowing all my child controls (vertices and edges) to go into negative coordinates. How would you implement this?
Added: To clarify about the background problem check out the following screenshot:
(source: valts.21.lv)
What you see here is a simple Windows Forms form with a WPF Host control on it. That has a ScrollViewer in it, and the ScrollViewer has the GraphCanvas in it. The GraphCanvas contains 4 vertices and 6 edges.
The GraphCanvas is stretched to fill the ScrollViewer. But since some of the vertices are at negative coordinates, it has a RenderTransform applied which simply shifts everything to the right (TranslateTransform). It also has a white background brush.
Note the gray area on the left. That's still a part of the GraphCanvas, but the background brush somehow doesn't exted there. Also, if I left-click there with my mouse (not on a node, but on the gray area), I do NOT get an event. If I left-click on the white area, I get all events just fine.
Call CaptureMouse on canvas.mouseDown and ReleaseMouseCapture on mouse up. Also, if you set your canvas background to transparent it will still be hit testable
You can attach a 'Draggable' behavior to each element.