WPF Window content navigation with slide in transition - c#

I have been having a hard time trying to implement content navigation (with slide in effect) inside a window just like the one in Visual Studio Ultimate Setup.exe using Microsoft Blend for Visual Studio 2013.
The installer is a available from here and demonstrates the effect I'm looking for:
http://www.microsoft.com/en-us/download/details.aspx?id=40778
Please let me know if you know how to slide in another window content inside the same window as exhibited in the above setup file.
I would really appreciate it if you can show me how to do that in Blend editor visually instead of code. (I already tried displaying different pages inside a frame but I couldn't change the source of the frame inside the visualstate storyboard)
Thanks in advance!!!!

I think the way to do this is to use more than one navigation object. You have both on the page, but invisible. Then when they click NEXT, you use a storyboard to animate one off the screen and the next into the screen.
http://snsatyendra.wordpress.com/2011/12/30/create-navigation-using-fluid-ui-and-behaviors-in-wpf-and-silverlight/
I did something like this in Silverlight once. I had multiple usercontrols and just slide one off the screen and the other onto the screen. I had a reverse animation too. After the animation is finished, you can reset everything for the animation, setting the previous/next page contents ahead of time for the next animation trigger.
Also, check out http://msdn.microsoft.com/en-us/library/ff723946(v=Expression.40).aspx for the FluidMoveBehavior. That might help with animating.

Related

(UWP) When SplitView pane is open, interaction with the rest of UI is not allowed

The PERFECT example of what I need is in the Groove Music app. When the SplitView pane is open (in overlay mode), you are still allowed to interact with the rest of the UI (clicking other buttons, etc., and even when you hover your mouse over controls that are outside of the pane, they are highlighted as normal).
In my app, NOTHING is clickable outside of the pane area (besides the 3 system buttons in the top right area of window). But once you click outside the area of the pane, it closes. ONLY at that point can you interact with the UI as usual again.
I searched through the SplitView's property list to see if I was missing something, but still haven't figured out what I'm doing wrong here. Any help would be greatly appreciated. :]
The behaviour you're describing is by design. If the DisplayMode property of a SplitView is set either to SplitViewDisplayMode.Overlay or SplitViewDisplayMode.CompactOverlay and when the SplitView is opened, rest of the UI is inaccessible. To have it opened all the time and let user interact with the rest of the UI, you have to use either SplitViewDisplayMode.Inline or SplitViewDisplayMode.CompactInline.
For more info, see the Split​View​Display​Mode enumeration.

Adding Click Event to AxVlc Control?

I am trying to make a program which plays video and receives user input on specific frames. i need to make a click event for the axvlc video player. Is this possible?
my program contains an instance of the VLC ActiveX Plugin in a windows form in visual studios.
I want, while the program is paused, for the user to be able to single click a point on the frame, trigger an event, add the location of the mouse to a list.
otherwise, i have considered rendering a bitmap of whatever frame it is on while paused so that i can add click events to that. but i would very much like to avoid that solution as it would complicate what i am doing.
I found a tremendously helpful control in this question.
Making a control transparent
the top answer has code for a control that supports real transparency even on top of video. this is perfect.

Add animation in the button

I want to create animation on the button.
Button has its image. When clicking on the button should work animated image. Once the animation is complete - show previous image.
Something like the following algorithm:
Closed shutter > Click > PLAY ANIMATED SHUTTER > Show image
I already have ready animation "Animation.gif". It needs to be run when you click on the button.
How can this be organized?
thank you
You need to port something like this to Mono for Android - How to make Android Buttons show animation on itself when clicked
I would probably tackle this first by getting the animation working, and then second by building a custom view that wrapped the animation and the button together - and exposed a single Click event which could be used by MvvmCross for binding.
It's also worth looking around for blog posts and other questions about 'animating buttons in Android' - e.g. one of the first hits for me was http://android-er.blogspot.co.uk/2012/02/apply-animation-on-button.html - most of these will be Xml and Java and should port very quickly to Mono for Android

Buttons mouse effects in windows store apps / WinRT?

I have some tiles layed out as buttons in my app. Im not that good at xaml and hope someone here can guide or show how i come around making them behave alittle like the tiles in the start screen of windows.
I have with some template set. How can i add the little border when mouse is moved over it and how do i make it look like it gets pushed down when clicked.
my button is just a sqare box with a background color.
You have to edit the Control template for Button. And add an additional border which should appear on Pointer over state. Write your own animation in Visual State manager to achieve this. To make this more easier just open your project in Expression Blend. Right click the button and choose edit template. the default template will fell into resources, so that you can just modify.
http://msdn.microsoft.com/en-us/library/cc294908.aspx
To perform a push effect, need to animate Scale Transform in pointer pressed state.
Regards,

WPF: Slide Grid left with fade

What I want is for a user to click "Next" and then the current "page" of content (actually just a grid) slides left (off screen) and fades out whilst the new content slides in left from off the screen whilst fading in.
How can I achieve this as easily (and reusable) as possible?
Kevin's Bag-of-Tricks has a TransitionPresenter sample with a bunch of different transitions. It includes a wipe transition and a fade transition, but not a "wipe and fade". You can download the source, so you should be able to combine the two transitions.
Check FluidKit library from Pavan Podila (blog). It has exactly what you need (TransitionPresenter more specifically).
There is a project called Transitionals (it hasn't been updated in a while) that provides packaged transitions for WPF. You can extend it to include a Wipe and Fade transition for your needs. If you wanted to build it for yourself, it's not difficult if you have Blend (animations are not something at which the Visual Studio designer excels and I wouldn't want to code them by hand).

Categories

Resources