I have a UserControl that is basically a ViewBox inside a Grid with a Border. The ViewBox has a background image and I blit various little icons onto the image. The icons are nothing more than pixels painted onto the background image. In code-behind I can detect when the mouse stays within the bounds of on one of these icons for more then 500ms. I call this a 'hover event'.
When I detect a hover event, I need to pop up something that shows details unique to the object represented by the icon. These details are not just text, there could be images of small graphs, so I think the popup needs to contain a StackPanel. I would like it to pop up, via some slick animation, at a location I specify near the location where the pointer is hovering.
Can someone please show me how to 1) create a popup containing a StackPanel at any given location in the ViewBox and (optionally) 2) have the popup use some slick animation when it appears?
Related
In WPF, I have a custom "toolbox" which consists of Label controls and some vector icons docked to the left of the screen.
In the center, I have a Canvas control which I eventually am going to need to serialize out the relative coordinates (for other platforms) for this "designer surface".
Basic question, I can drag/drop controls from this psuedo-control box onto a Canvas but I need to know how to place this WPF control properly in the canvas, under where the mouse pointer is, realtive to the Canvas and not the screen or main Window.
What are the functions that needed to be called so that I can ensure that if I drop a Button control at 10%, 20% of the canvas, I get an actual location back and the button drops where expected?
Mouse events provide a Point structure.
Converting of positions can be done by Control.PointToScreen and TargetControl.PointToClient.
Part of the problem I am having with what I am trying to do is trying to explain to others what I want. What I am trying to accomplish is an in-game pop-up menu or window which has its own Draw area. For example lets say I have a pop up window with multiple objects stacked on top of each other, such as button, but there are too many to fit on the window so you need a scroll bar to move them into view. What I want to do is make these object only Draw inside of the window:
http://imgur.com/8IWNEqN
The black area with scribbled pink is the main game window and the centre image is the pop up windows, the dark blue squares being the objects inside. Any code, suggestions, and mainly theory will be appreciated. I've tried drawing them only when they're inside the window and this works but it doesn't look very smooth, I want the object gradually disappearing as they move out the window, not just vanishing when they touch the borders, and especially not slipping out of the window.
Thanks.
Before you do any rendering in XNA you can set the ViewPort on the GraphicsDevice. This lets you restrict where things are being rendered.
For example, if you want to render something to a 100x100 pixel area at the top-left of your screen you might do:
// Create the rectangle
var clipRectangle = new Microsoft.Xna.Framework.Rectangle(0,0,100,100);
// Set the rectangle when you call SpriteBatch.Begin:
mSpriteBatch.Begin(SpriteSortMode.Immediate, renderStates.BlendState,
samplerState,
depthStencilState,
rasterizerState,
null, matrix,
clipRectangle);
I'm trying to create an image slideshow just like this one on this page: http://forum.xda-developers.com/forumdisplay.php?f=1914
If you mouseover the image of the tablet, two arrows appear and you may slide through these images.
How to achieve this with wpf?
I want to create it just like on the page, I press the right arrow and the current image moves left out of sight and the new image comes to the center from the right.
The application should be resolution independet, so working with a canvas isn't possible I guess.
To give a general answer to that question without writing the code for you(, which is your task):
Create a Grid with the size of one image. Create a Canvas with the HeightProperty set to the height of the images and the WidthProperty to the sum of the width*amount of images.
Next thing, add two images for the arrows and the canvas as children to your grid and position them correctly.
Second last thing. Create an event for the grid MouseEnter to change the IsVisible property of the arrows to true and one for MouseLeave where it is set to false.
Last thing. Create events for LeftMouseButtonDown for the two arrow images that will trigger a animation that changes the Margin.Left property of the canvas by the width of one image.
The scenario is that i want the user to create a shape in a small panel that opens (the added shape can later be placed on the canvas), but for a better reference, i want the user to be able to move the semi-transparent panel somewhere on the canvas and then draw with the accurate reference.
Please tell me:
Which panel type to use
How to make it moving by clicking the mouse on the move button (not the whole panel as dragging will be used for drawing lines) and move it around.
How to make it semi transparent.
How to make it appear and disappear (this should be pretty simple)
How to somehow limit its movement inside the canvas so it cannot move on the ribbon
And I really really hope there will be something built-in in WPF that i'll be able to use, and i will not have to do it the hard way i.e. create a rectangle, and do customized hit testing on it to allow the user to draw on top of that rectangle, make that rectangle transparent, and add graphics items for the buttons and controls on that rectangle "panel".
I am asking this because i have never seen such feature in any Windows application and i have no idea what to use for this purpose and how to implement it. The closest thing to what i want is in Adobe Acrobat Pro, which is the small preview of the page that appears when i double click with the middle mouse button. It doesn't move, nor it is transparent or can be drawn upon, but scale and shape wise i want something similar.
You should be able to place a second Canvas inside of your main canvas, and place whatever UserControl you'd like with your "view" inside of it.
You'll have to handle the mouse click/drag for moving it around yourself, but otherwise, it should be very straightforward.
I want to display a very small image on the top left corner of the windows desktop, it will be a picture of a small note and when you mouse over it, the window will show.
How can I do this in C#?
There should be no borders or regular window graphics
The image will be partially transparent
When a mouse over event occurs a window will display
The image will always overlay other windows
Thanks
I'll try to point you to the right direction for each of those requirements, you can do more research on how to exactly achieve each one using google or stackoverflow.com
You need to create a widows form, and add the image as the background of the form, or add an image control to the form.
after you have that, you can use the following to get your desired effects.
No Border
Set form's FormBoarderStyle propery to None
Transparency
Set Opacity property of the Form to something less than 100%
Mouse over
Use MouseHover or MouseEnter events of the form
Overlay other windows
Set TopMost property of the form to true.