WPF: Slide Grid left with fade - c#

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).

Related

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.

WPF Window content navigation with slide in transition

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.

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,

How can I implement an interactive tutorial inside an app?

I have C# add-in for Word and would like to implement an interactive tutorial like games usually have. I'd like to somehow highlight (maybe by circling) certain visual elements and display text boxes that describe what the element does. For example, say the add-in is a generic workflow editor. I'd like to show to the user, step by step, what needs to be done by visually selecting elements and explaining what they do and what options (s)he has. My first question is: can this be done in C#? My second question is how? :) I suppose I'd have to get the positions of said visual elements and then draw an image on top but I don't know how that could be done.
I'm a bit disappointed that not even a single member of the Stack Overflow community took the the time to at least give a hint about this. But such is life and I'm just going to share my findings here because I'm certain someone else will benefit from them.
To be able to do an interactive tutorial you need three things:
a method to find where a control is located in terms of screen coordinates
a method to point the user to the control by highlighting it or
surrounding it with a red line for example.
a method to do its default action (ie: click a button).
In other words, the idea is to have some sort of window with text describing a control and some graphical way of indicating the control in the app. Optionally, the window could provide something like a ShowMe button which shows the user how to use the control by taking control of the mouse and keyboard.
This is trivial when the controls are made by yourself and thus have source code access. However, when doing such a thing for a black box app such as Word you can use the Windows IAccessible interface. Searching for that with your favorite search engine will yield everything you need to understand it and use it. IAccessible allows one to do many things but most importantly it can get a control's position and can also do the default action.
Having sorted out these things the next step is to figure out how to graphically point out the control. There are many ways to do this but in my case I chose to surround it with a red rectangle. I did this by creating an invisible, borderless form with an empty red rectangle on it. Having the control's position and size, I had no problems placing the aforesaid form over the control.
So there you have it. I laid out the building blocks that one needs to make an interactive tutorial for any app.

Difference between Panorama and Pivot Control

What is the difference between the winphone 7 Panorama and Pivot Controls? To me they seem very similar, apart from the slightly different visual appearance.
In which situations should one or the other be used?
There is a video on Channel 9 with Amy Alberts and Chad Roberts that talks about the differences between the Panorama and Pivot controls and when you should use each.
In my opinion, the Panorama control is for when you need to create a "hub"-type application (like the Games hub) that acts primarily as a jumping point and offers summary information for the rest of the application. The Pivot is used in much the same way that you would use a tab control on other platforms.
As said above, the Panorama control is really meant for rich Hub type look .. smooth multi-screen scrolling with Parallax effect, ideally including images in the views. The Pivot control is more for presenting slices of the related data to the user or categorizing the content .. the in-built emails & calendar are examples. Both controls are very suited for dynamic data-binding.
Jeff Blankenburg, one of the MSFT evangelists wrote two nice posts explaining their use:
http://www.jeffblankenburg.com/post/31-Days-of-Windows-Phone-7.aspx
Hope this helps!
I would use the Panorama control if the content of your application lends itself to being presented in a format where you think of the screen as being a window into a larger page...one that can loop back around to the beginning. Also, consider whether that content needs to support gestures, especially swipes, because those will cause conflicts between some action intended to take place in a control, for example a map with panning, and the "outer" Panorama control's behavior of scrolling.
I'm also reconsidering using the Pivot control. It has a more distinct division between sections of content than Panorama does and I like both the gesture swiping to switch between pivots and the animation. However, it has caused some tombstoning problems and with the advent of copy-and-paste there could be a conflict between the user trying to select content to copy and the triggering of the swipe gesture to switch pivots. Disabling the Pivot Control swipe gesture talks about a possible work-around, although I haven't tried it and see from the comments below that article that there may be some other issues.

Categories

Resources