I have a Popup in vertical center of the screen (it fills about 1/3 of it) and stretched horizontally with custom content to interact with user. I want to make current frame fade into gray when popup is shown just like MessageDialog does (still can't post image for example)
There is some workaround with DoubleAnimation object applying to Windows.Current.Content but the result is slightly different from MessageDialog's fogging.
Is there a standard way to achieve graying out current frame when showing Popup like MessageDialog does?
Thanks in advance
Yeah - make the popup take the entire screen and put a Grid below your actual popup that's black and has opacity =~0.5.
Take a look here - full source code for a popup that handles all that (and animation) for you:
http://socialeboladev.wordpress.com/2012/10/14/turn-any-usercontrol-into-a-pleasing-dialogflyout-in-windows-8/
Related
I want to emulate modal dialog in XAML Metro App.
So I was going to set .IsEnabled = false on all controls apart from the one which will pose as a modal dialog.
Apparently IsEnabled not in Grid not in Panel not in FrameworkElement. How to disable it not making a user control out of it?
I guess Sinofsky cut so many corners that the whole thing is now more like an Escher staircases. I am loosing my faith. Please help
Sorry, I am a little late to the party...
Here is how I created a modal popup - I used a popup dialog where the top and bottom portions are transparent so that anything behind it will show through. When the popup is opened, I set its size to cover the entire screen.
The top and bottom portions of the popup also are set to autosize (height = *), so that they fill up the entire top and bottom of the screen. This prevents any input from going into the grid underneath.
Here is a screen shot of my popup in Visual Studio:
The popup is a grid with 5 rows, 3 for the dialog itself and 2 for the transparent top and bottom.
Here is how the popup looks in my app. Obviously the grid shows through the transparent top and bottom. Since the popup fills the entire screen, any input (keyboard or mouse) goes to it rather than the grid underneath, making the popup act like a modal dialog.
Be warned though that with this strategy, you have to handle these events:
Screen resizes (full screen, snapped view, filled view) - you need to resize the popup to fit within each of the view states
Screen rotation - again, you have to handle resizing here
Keyboard popup - you need to shift the popup up so that the onscreen keyboard does not interfere with it.
Set IsHitTestVisible = false on the background content.
Additionally you could set focus to something in your modal layer root and set TabNavigation to Cycle on the modal layer root to make sure that users can't tab/shift+tab out of it. Also make sure the modal layer is all hit test-solid - e.g. Transparent or has some other fill so users can't click through it.
Also make sure no Popups show while your modal layer is visible.
Unfortunately no one seems to know (except Mr Skakun who gave wrong answer and never bothered to revise it).
Hence my solution (the simplest) is to make the element in question Hidden - I cant find any other ways to 'disable' a grid.
If I wanted to disable it correctly I would have to write a recursive function to find all FrameworkElements in the grid children and set IsEnabled = false though.
I want to fade a WPF window in, but I can't do that unless the window is set to transparent and window style is set to none, and I don't want that. Instead I want to create the illusion that the window is fading in by putting on top of it whatever is under it and then gradually reduce the opacity so it is brought into view.
I know that in order to to this another window with transparency and no borders must be used as the object that holds the captured image and performs the fade.
So in theory I know what I want, but I have no idea of how to capture as an image whatever is under a WPF window. Of course, the interface that I want to reveal will be hidden until the capture is performed, so the window on top doesn't capture the actual interface, and I will show the GUI only after the image has been captured, so it can be revealed after the image starts losing opacity.
That was just an explanation for what I need this. The basic question is: how do I capture to an image whatever is under a window (even if it requires the window to be transparent)?
Found an article here describing a couple of ways to do what I need: http://www.codeproject.com/Articles/91487/Screen-Capture-in-WPF-WinForms-Application
I'm working on a simple application with text animations and videos as background.
It's really similar to a simple LED scrolling text and I'm using the animations framework of WPF for this (Storyboards and timelines).
My text comes from the right side and finishes animation to the left side, thus it is visible for the entire width of the window.
Now, what if I want to display this text only in a specific rectangle of the window? The text would normally come from the right and finish to the left, but should be visible only when passing through this rectangle. Imagine it like a "rectangle hole" in the background where the text is shown.
I hope I have been straightforward in my explanation!
Thank you.
Is it an opacity mask you're after?
http://www.c-sharpcorner.com/uploadfile/dbeniwal321/implementing-opacity-masks-in-wpf/
Obviously you won't be using gradients of opacity as seen in the article - you'll use a more strict rectangle outline and play your animation as usual - using the bounds of the mask as the boundaries of your animation.
Text in a Canvas. Set the size and position of your Canvas to be your rectangle hole. With clipping on, when the text is outside the Canvas, it will not show. You just animate Canvas.Left attached property on your text.
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.
Ok, I have googled, but maybe I put my search in weirdly. :/
I have a VB.NET WinForms application. I have the anchor properties set for all the controls so that it will resize all the controls to look decent when the form is maximized. (Haven't gotten around to manual resizing yet however).
Anyway, the problem:
I go to set the same properties for a button (testing with a single button for now) on the main GUI form/picture. When I go to run the program via F5, it looks decent. But when I maximize the form, the entire button covers up more than it should.
I've taken screenshots of the form so you can see a visual of what I'm talking about. :/
Before: http://zack.scudstorm.com/before.png
After: http://zack.scudstorm.com/after.png
What other propert(y|ies) do I need to set for the buttons to show up correctly? :/ (The buttons go over the boxes that say, for example, "1-1", "2-3", etc.
Thanks,
-Zack
Seems like you have anchored top-left and bottom-right when what you want is just top-left.
Edit: If it's just an image that does not change when the winform changes, then don't anchor your buttons at all. Just put them where they go. If you are scaling the image, then I would either detect the clicks on the image and do the scaling math or do the scaling math and set my buttons in code in the Form.OnResize event.
As it appears that your goal is just to be able to handle clicks on the "computers"...
One option that can be useful for this sort of task is to create an "overlay" bitmap (not displayed, but which is the exact same size as your source bitmap) which uses different colors to represent all the clickable regions. (e.g. (R=0,G=0,B=0) for computer 0, (0,0,1) for computer 1, etc)
You could even generate this bitmap somewhat automatically without too much trouble (If you have a mode where you can click the top left and then bottom right corners of the image to define a new region)
When the mouse is clicked, you can check the pixel at the scaled coordinates of the mouse position in the overlay and determine what their click corresponds to. This can be a lot easier than creating loads of controls, and makes it a lot easier to have clickable regions that aren't rectangular.