Best way to animate arrow levitating over notification area in WPF - wpf

At some point in my app the main window closes and the application continues to run as a system tray icon.
Whenever this happens, I want to show the user, that the app is now in the notification area as an icon. I could just show a tooltip, but it's not cool anymore.
Instead, I want to levitate a big arrow over an icon, to be sure that the user sees it.
Here is how it's done in DropBox application:
http://img59.imageshack.us/img59/9364/arrowva.png
What is the best way to create and animate this arrow in WPF:
A custom shape window? If so, what will do the animation. Can I apply storyboard animation to a window itself?
A transparent larger window, but with arrow as an Image, and animate it with storyboard? But than, I will have the window capture mouse clicks, which is not desired.
Some other approach?
Thank you.

You can use Popup with explicit position:
<Popup AllowTransparency="True" IsOpen="True" Placement="AbsolutePoint"
HorizontalOffcet="{x:Static namespace:TrayInfo.LocationX}"
VerticalOffcet="{x:Static namespace:TrayInfo.LocationY}" >
<views:YourViewWithAnimatingArrowImage DataContext="{Binding ifYouNeed}" />
</Popup>
TrayInfo

since u can't really animate a window, (it's a user32 thing, not a wpf element), I'd go with option 2.

Related

prevent wpf window render black background without allowstransparency=true

I have some animations on a window that should be overall transparent and stretched over multiple screens.
I dont need the title bar or the background.
I would like to save resources.
When I set allowstransparency(bad for performance) to false the transparent background is rendered black.
Is there some lighter alternative to even prevent the window to render the background?
I did not find any thing on alternative rendering or windows. I see the window class inherits from Window : ContentControl, IWindowService but I guess I shouldnt look into that.
I dont have code to show accept at least that im using
<WindowChrome.WindowChrome>
<WindowChrome
CaptionHeight="0"
ResizeBorderThickness="0"
/>
</WindowChrome.WindowChrome>
To disable transparency paddings on a loose window without allowstransparency=true.
One of the things WindowChrome gives you is the ability to add certain Windows window's abilities to a custom design window you make.
Not necessarily related to transparent background.
If you want your window to have round edges you will need to set AllowTranspareny to True, otherwise you will get the black background, no way around that.

WPF Control form resize

I have two controls on my form, i have two use case
When i drag from the right corner, i want to re size the form and all controls should be aligned appropriately
When i drag from the right edge, the right side controls should be hidden
I have already tried the Res size mode as can re size and i can handle the first user scenario.
I have used a View Box property which is enabling the re size of window when i drag and shrink it.
I am not able to find a control that can allow me to re size and hide a portion of the window at two different events
Some ideas for you.
You may handle the SizeChanged event for your window.
SizeChangedEventArgs has two propertis: HeightChanged, WidthChanged.
Maybe you can collapse the viewbox when only Widthchanged is ture.
Update:
After tested, Collapse viewbox will collapse the content in viewbox. So I write code like below to avoid this issue. But It's worked not very well. Just FYI:
<Grid>
<Viewbox>
<content/>
</Viewbox>
<content/>
</Grid>

How to create a UserControl with an irregular shape?

In my Silverlight 4 application I need to create a user control with an irregular shape. The "main display" of the UC is a standard rectangle but I need to have tabs (simple text blocks, where the user can click) that are outside of the main display rectangle.
Is this possible with Silverlight 4? If so, how?
Thanks in advance.
You can position elements of a control outside its normal layout in a number of ways. You could use Canvas but if most of the control is standard Grid rectangle then you can use a Grid. The trick is to use negative Margins.
<Grid x:Name="LayoutRoot">
<Border Margin="0 -22 0 0">
<TextBlock Text="I appear above the UserControl layout" />
</Border>
</Grid>
Note that if the Usercontrol is being used as the Visual root then this won't work because the Silverlight plugin will not render beyound its client rectangle.
It is, you can have transparent background behind the tabs which can let clicks through, effectively behaving as if the shape was different. The UserControl will still have a rectangular shape including the tabs, unless you wrap then into a Popup and float out of the UC with some offset.
Technically, you can have elements outside the UserControl's rectangle if you use a Canvas for your LayoutRoot instead of a Grid. Elements in a Canvas aren't clipped to the canvas size. I wouldn't recommend this, however, because you won't be able to use Margin to size and align your controls inside it. It would be better to have all child controls inside a Grid LayoutRoot.
Which brings us to the question of irregularity. If you want to 'see through' parts of the control and be able to click through them (i.e. click objects underneath it), all you need to do is keep the UserControl's and the LayoutRoot's Background to null or just not set it at all. Wherever there is a lack of any background, clicks will go through. Note that if you set the background to Transparent it will make the control behave as a rectangle (as if it's filled with solid color) with respect to mouse input.
Another thing is if you want to see HTML controls under the see-through parts of your app. Then, you'll have to use windowless mode, but that's another can of worms.

How can I overlay a control on a window?

Right now I have a normal window with a bunch of controls.
When the user hits a certain button I want to dim the entire window and then display a popup on top of it. Not a true dialog box, just something that is inside the window.
So this is my theory...
Every control is on layer 0.
There is a rectangle the same size as the form in layer 1. This has 50% transparency.
My popup is loaded into layer 2.
Clicking anywhere on the rectangle will do the same thing as pressing close on the pop-up.
Is this possible?
This is perfectly possible.
Put your entire UI in any panel inside of a <Grid>.
Then, in the same grid, put a <Rectangle Opacity=".5" Visibility="Collapsed" /> for the overlay and a centered panel for the popup.
Handle the rectangle's click event and hide the popup.

childWindow Full Screen Event tweak the Parent to also FullSCreen Mode

I have a ChildWindow which contains a ExpressionMediaPlayer inside it. When I click on the ChildWindow Media Player Full screen button it swiches the whole application to FullScreen Mode.
Is there a way to avoid it. I am not quite sure if this scenario is going to fall under SL security restrictions.
When I drag the ChildWindow(the position of ChildWindow changes) and click on the fullscreen
now the ChildWindow also changes it's position.
For example if I have dragged the ChildWindow 50px from Top and pressed the Full Screen button of of mediaPlayer (it contains) the Child Window also appears 50 pixels below the Screen Top.
But I want My ChildWindow to be FullScreen without having any Gap from LEFT,TOP,RIGHT or below.
Any help will be greatly appreciated.
Thanks,
Subhen
Silverlight only uses one of its two windows. The first is the normal window embedded in the Host application such as IE (or in windowless mode it co-operates with the host to draw directly on one of the host's windows in a give rectangle). The other window is a Fullscreen one.
When in full screen mode it moves all its rendering of its stack of content to the full screen window. You can't get Silverlight to render only some controls on the Fullscreen window, its an all or nothing proposition.
Creating a "fullscreenable" ChildWindow would be an interesting exercise. Probably a new templated control based on Childwindow with a new "Fullscreen" visual state (in a new state group) that hides the chrome and causes the content grid to stretch with Auto Width and Height.

Resources