I've got a custom composite WPF control (AvalonEdit) in my application that I'd like to animate whenever its Text property is changed. What I intend to do is:
Create a copy of the control's visual representation before the text is changed and paint it over a rectangle.
Fade out the above rectangle, update the text property and fade in the control using the DoubleAnimation and Storyboard classes.
I've got #2 figured out but haven't got a clue about how I'd achieve #1. Any help would be appreciated.
For (1) there are a couple of approaches that spring to mind:
VisualBrush - A visual brush is a brush which is defined by a complex UI element. In other words, you can create a visual tree of elements and use this to create your brush. See the tutorial here. I think in your case you would have to define your UI twice, i.e. have an instance of your AvalonEdit control as the 'visual' for you VisualBrush, so perhaps not ideal
WriteableBitmap - A writeable bitmap allows you to copy part of your UI into a bitmap where you can manipulate he pixel data. Whilst you do not need pixel-level manipulation it is still a convenient mechanism for cloning your UI. See this tutorial I wrote here.
Related
I am using Xceed's MessageBox and, as you may know, in order to customize its display image you have to use its ImageSource property which is of type ImageSource.
Now, I have some cool icons in XAML (taken from here, here and some that I've made by myself). So I want to use them in an ImageSource in order to have them on the MessageBox.
I have searched the web, but the closest I came was with the DrawingImage class:
http://msdn.microsoft.com/en-us/library/system.windows.media.drawingimage%28v=vs.110%29.aspx
But this uses geometries, not normal XAML elements (like Canvas, Path, Rectangle, etc) that my icons use.
I have found a similar question here, but it doesn't seem to help much.
So, is there a way to put my icons (as they currently are) inside an ImageSource?
And if not, is there a way to convert my icons into geometries (using simple C# code or tools like Blend)?
I don't think it's possible to do it in pure XAML (unless you want to manually convert your XAML image to a DrawingImage). However, you could render the image to a bitmap using the RenderTargetBitmap class, then use that bitmap as the image source.
My situation is something like this:
I have a class called MediaElementPlayer which represents a video player, and acts as a ViewModel for a DataTemplate. It is based on this idea with adjustments to WPF and MVVM light instead of Silverlight.
It works great, but I need to be able to maximize the video too.
For that I created a different window called FullScreenWindow, which holds a single ItemContainer to draw the video player. When I create this window, I pass it the MediaElementPlayer object from the main window. This works too.
The problem is that when the full screen window is opened, the media's position is not retained, that's because it creates a new MediaElement.
Is there a way I can take the MediaElement object I already have in mt MediaElementPlayer(VM) and draw it on the view, instead of creating a new one? That will help me retain media position across windows.
Thank you very much in advance.
You can create a new MediaElement UserControl in your FullScreenWindow then use Binding to set its size: you can bind the MediaElement object actual Size to a property of the ViewModel MediaElementPlayer (you can update these values by creating a behaviour attached to SizeChanged event of the UserControl).
Then, the ViewModel of the FullScreenWindow can set the Size of the its MediaElement basing on the property of the ViewModel.
I am completely new to wpf and the question is this.
Is there available xaml for the control like on attached image?
As you can see, when we click on a control the image on the left becomes larger and all the text slides to the left. Or how could I create similar control?
The easiest way to accomplish that is a Storyboard.
Open Expression-Blend, build a Control. Hide all Elements you dont see first so its small. Create a new Storyboard, make a Keyframe and change the Properties of the elements you then want to change, create a new Keyframe.
Its like an Animation now. You can now start the Storyboard any time, on any event to expand your control.
If you dont know how to use Expression Blend and the Storyboard, there are some fine Tutorials and Videos.
Good luck!
I want to have an animated panorama control background in Windows Phone application.
I have an algorithm that constantly draws onto the WritableBitmap the desired image.
I have bound the Panoramas' background property to ViewModels' BackgroundImageBrush property.
Then at construction time of my ViewModel I assign
BackgroundImageBrush = new ImageBrush {ImageSource = _outputWriteableBitmap};
I get no Binding errors in output and when I check the binding at with the debugger, I get the correct linkage of BackgroundImageBrush.ImageSource to a WritableBitmap.
Every time I redraw the _outputWriteableBitmap I do call Invalidate.
Still my panorama background is blank!
What am I doing wrong in theory? Is it even possible to have an animated background in Windows Phone's Panorama?
Thanks.
The first step here is to make sure that the binding is actually working. Try creating a static image brush and binding your panorama background to that. If that works, then the issue is with the way you're updating the image--either the image isn't rendering properly or you're not calling PropertyChanged correctly.
I've bound a panorama background image to a property in a viewmodel before, so it is doable.
Incidentally, how often will you be updating this image? It could be brutal on your performance if it happens frequently.
A way offered in the comments below the question has the potential answer.
This blog post shows how to at least change the panorama background at runtime, tough I didn't manage get it to play animation generated at runtime.
I currently try to create classes for a paint-like WPF application. I have to base classes LineMovement (line from StartPoint to EndPoint) and PathMovement (line going through all points specified in a property Points of type PointCollection). These classes inherit from Control and get their looks through a ControlTemplate.
The ControlTemplate also adds an Adorner to the AdornerLayer of the Movement objects containing a little visual marker for every moveable point of the specific line. These markers support dragging with a mouse.
The problem I have is that somehow my Movement classes don't repaint when their points are moved. I debugged my code with Mole and found out that the Polyline used to visualize the line gets the changed point values (visible in its Points property) but it just doesn't repaint.
How can I force a repaint of a WPF control?
TemplateBinding doesn't support two-way data binding (i.e. updating the Points collection with the new values of the Polyline). It's meant only for one-way data binding for use in control templates. See Bea Stollnitz's blog entry: http://bea.stollnitz.com/blog/?p=38
Turns out that TemplateBinding is pure evil.
When I bind the Points of the Polyline by {TemplateBinding Points} it doesn't update itself, whereas when I bind it with {Binding RelativeSource={RelativeSource TemplatedParent}} it works perfectly.
Note to myself: Never use this goddamn TemplateBinding again.
You need to make your Movement objects' DPs have the AffectsArrange metadata property (http://msdn.microsoft.com/en-us/library/system.windows.frameworkpropertymetadataoptions.aspx) - that way when the property changes, WPF knows it should redraw