I see that there is a Markers Property on the MediaElement, but this seems to be available to the Silverlight MediaElement, not the WPF MediaElement?
Can you help me with what I'm missing?
I'm trying to add Markers to a WPF MediaElement, to play a video and show popups based on the timeline. What should I be using in place of the Missing Markers collection?
Thank you for your help.
There are two aspects to your question depending on what you actually intended - please note that the MediaElement.Markers Property is a read only collection of timeline markers associated with the currently loaded media file:
What's a timeline marker?
Here's the MSDN description of the TimelineMarker Class:
A timeline marker is metadata associated with a particular point in a media file. These markers are usually created ahead of time and stored in the media file itself. They are typically used to name different scenes in a video or provide scripting cues. By handling the MediaElement object's MarkerReached event or by accessing the MediaElement object's Markers property, you can use timeline markers [...]
So timeline markers may be a good fit for encoding your popups, but it is important to note that they are a property of the media file itself and not the collection of graphical tick marks on the typical media players timeline widget!
How do I create and handle timeline markers?
The only article summarizing this I could find right now is How to encode video markers for consumption in Silverlight and WPF from Steven Porter. (Don't get fooled by the registration demand, it's the infamous technique from the evil hyphen site that motivated the creation of Stack Overflow in the first place, i.e. you can read the article just fine without registering, just keep scrolling down.)
How do I create a timeline control with tick marks in WPF?
Assuming this is what you're actually trying to achieve and why you stumbled over the MediaElement.Markers collection the answer is roll your own:
It's pretty simple though, basically you will need to customize a Slider control to your liking, see this example from the Slider Class documentation on how to use the Ticks property to create tick marks along the Slider at irregular intervals:
<Slider Width="100" Value="50" Orientation="Horizontal" HorizontalAlignment="Left"
IsSnapToTickEnabled="True" Maximum="3" TickPlacement="BottomRight"
AutoToolTipPlacement="BottomRight" AutoToolTipPrecision="2"
Ticks="0, 1.1, 2.5, 3"/>
Related
I am struggling with a WPF MVVM problem using a control that has helper functions and exposing those helper functions to my viewmodels.
I am using the PDFTron viewer control that shows a PDFDocument object. Items in that PDFDocument are specified in terms of a PDFTron.Rect structure with the elements measured in points(1/72th inch) and a page number
To help convert the coordinate systems to and from screen position the PDFTron ViewerControl has various function on itself.
e.g. To convert from a screen point
Double x, y;
int page = Control.GetPageNumberFromScreenPt(x, y);
Control.ConvScreenPtToPagePt(ref x, ref y, page);
To convert to a screen point is from the object being examined
PDFTron.Rect r = Control.GetScreenRectForAnnot(embeddedObject, pageNumber);
What the best way of calling/exposing or binding to functions like this between the view model(s) and the PDF control as I would really like to databind to coordinates.
For instance I have an adorner defined in XAML that allows me to move an image I have read from the embeddedobject about the page by dragging and I can also resize the image. The viewmodel knows As my view model knows the image the embedded object its page and Rectangle on that page, but as PDF coordinates. But this needs to be translated to screen coordinates for the X, Y, Width and Height for binding to the XAML Attributes. I cannot quite see how to do this as it seems beyond a dataconverter.
So the control in the xaml has attributes measured in screen units
AdornerLeft="{Binding Data.X, Mode=TwoWay}"
AdornerTop="{Binding Data.Y, Mode=TwoWay}"
AdornerWidth="{Binding Data.Width, Mode=TwoWay}"
AdornerHeight="{Binding Data.Height, Mode=TwoWay}"
If the X and Y change I need the change to be reflected eventually as the page,x,y coordinates of the viewer as they are what are used by the underlying model.
I did wonder would it be wise to make a series of dependency properties so if I change one it ripples the change through the others as a conversion? So for example I have a property ScreenY When that changes it updates PDFY and PDFPage and vice versa but that seems overly complicated. Any suggestions?
Typically what is done, is that during user interaction, so while your user is moving and resizing the image, everything is drawn overtop of PDFViewWPF viewer.
You can get a Canvas object from PDFViewWPF.GetCanvas() and then you can draw your image on that if you like.
At this point, nothing relates to the PDF, you are just dealing with WPF coordinates.
Only once the user is done moving and dragging, and you want to add the image to the PDF page, perhaps as a Stamp annotation, or even injecting the image into the page content, only then would you erase all your graphics, and inject the image into the PDF. Only at this point would you need to translate between coordinate systems.
Please take a closer look at the PDFViewWPFTools project, and see how something like the Rectangle annotations are created.
This post might provide additional clarity for you.
I ended up using the Prism library and the eventAggregator to pass the details back to a the View and get the results, also using events to refresh the view. The PDFWPFViewer MVVM sample from PdfTron beside having some issues with incorrect bindings, essentially uses a tool library that is shared and acts like a windows forms library, no behaviors for controlling adorner drag etc.
I have a video playing of lines being drawn on the screen. Is it possible to create a pixel shader (for WPF) that turns newly colored pixels a certain color for N milliseconds?
That way, there can be some indication to the user to movement on the screen when the lines don't move often and the user isn't always looking at the screen.
You can use DirectShow. Its written in unmanaged code, so you need to use this wrapper DirectShow.NET in order to use it in your C# application which is running in managed environment (samples are included, even with EVR which stands for Enhanced video Renderer which means MUCH better video quality). And when you will be passing a control handle to wrapper method for setting the video output, you need a WinForms control, because only from them you can get your desired control handle. That WinForms control you can then host in your WPF application using the WindowsFormsHost control provided for such situations when you need to use some WinForms control(s) in a WPF application. Its just theory, so i dont know if its an ultimate solution for you.
BTW: The whole idea is based on fact, that DirectShow is just some query constructed from separated filters. Renderer is a filter (EVR, VMR-7, VMR-9). Sound player is a filter. And they are connected through their pins. Its like a diagram. Electronic schema or something like that. And you can put for example Grey scale filter in there. And voila, video output will be greyscale. There is a bunch of tutorials for that. And completed simple filters as well. Unfortunately, filters must be written in C++:(
PS: I never said its gonna be easy:D
First time working on a GUI project.. and first time doing work on Windows so apologies in advance if this is a really noob question.
I'm taking baby steps into windows programming starting with vb.net WPF. Working in Visual Studio Express 2012.
I'm trying to work out how I can scale all the elements in a window with the window itself.
So for example, I'd create a window, say 1280x720, and place some images in the window. Say one at the top and one in the corner. (this is a basic media based application)
When I resize that window, I want the entire window to scale with it, so image 1 & 2 will get larger if the window gets larger, however this has to happen proportionally so that if I make the window a lot bigger in one direction one image can't overlap the other. Imagine the window is an image and I'm trying to resize it. (The overlap thing is the closest I've gotten to getting this working in my current attempts).
The layout in produciton will be more complex, comprising of mediaelements (video), images, text etc and all must scale accordingly.
This isn't something the user interacts with and so there are no form elements etc, and so I don't need form fields etc to stay the same size throughout scaling. I just need everything to scale like I'm scaling a picture. If for example I displayed this 1280x720 (16:9) layout on a 1920x1080 screen, maximised it should look identical only larger.
Hoping someone can point me in the right direction with this.
What I've tried so far- the few articles I did find on google relating to this (I may well be searching the wrong things) lead me to put all the elements in a viewbox, this lead to the overlap I mentioned earlier.
Ideas ?
I think you could use ViewBox container. The basic idea is as follows: ViewBox scales its content just as if it was an image scaled. This seems to be the closest result to what you've described in your question. Just put a Grid with absolutely-sized columns and rows into the ViewBox and set its Stretch to be Uniform:
<Viewbox Stretch="Uniform">
<Grid>
<..>Your controls, MediaElements, etc
<Grid>
</Viewbox>
You could also combine it (or entirely replace) with (e.g.) Grid Container : it gives you an ability to specify cell width and size usign star-syntax which is similair to html's percent syntax.
Another way is to use the DockPanel.
All-in-all there are plenty ways to achieve something similair and the way to go largely depends on the nuances of your particulair requirements.
Have a look at This tutorial to see a good overview of WPF containers and how to use them.
I'm working on a module that displays DWG files in WPF. I've managed to use CadLib library but it's working very slowly and I want to make it faster. I found out that if I convert that DWG file to SVG format and then print it to my XPS printer and rename the file to ZIP, I can get .page file which is basically a XAML file that displays the original SVG object in XAML.
I want to display this XAML code on a custom control and be able to pan / zoom it around. I tried to place this XAML code in a Canvas and it did manage to show up there, but now I'm stuck trying to pan / zoom the shape that was drawn there. Also, the mouse events are fired only when you click the actual drawing itself, and not the Canvas, which will be hard for the user to click...
Any help would be highly appreciated :)
You could try creating nested Canvases : One that holds the vectors and is moved on demand, one that is fixed and serves as the viewport. Haven't tried that, but it should be feasible...
I know Windows Forms quite good but I'm new to WPF.
I'd like to create application similar to RSS reader - in main window every note will be displayed in Post-it like frame and all notes should be chained and scrollable up and down. I also want to include kind of fisheye view - single note will be displayed full size in the centre of the screen and will shrink and rotate on the edge.
I know custom control, transformation and databinding concepts but I'm not sure how to handle displaying and scrolling notes in the main window. The questions are:
what is the suggested way to arrange, display and scroll ordered chain of notes?
should single note discover own position on the screen or it should be notified by it's container?
how in such solution provide feature which will open related notes as a "multiple popups" notes connected by a line with original one? (like traversing correlated results in Google Wonder Wheel, adobe flash there)
are there any standard solutions for displaying and manipulating (moving, attaching, collapsing) such popup-widgets?
If there are any similarities in your proposal to other GUI frameworks (Forms, Swing, SWT), comparison are welcome too.
Thanks in advance!
It seems to me you are describing a "carousel control" or "element flow" or "cover flow". I've put some links at this answer.