wpf custom control: audiowaveform rectangle with selection slider - c#

I'm working on a c# wpf app in which I want to do something with audio. the irrklang audio library provides me with a pcm decoded 16 bit byte array.
I want to create a timeline control which shows the waveform along the timeline with an overlaying rectangle which the user can drag and click/drag the left and right side to increase or decrease the selection.
It is used to the trim the audio track. I would like the selected min and max to be databindable, the minimum and maximum value of the total track to be bindable.
To clarify here is an image mockup:
I'm not asking for a complete control but tips and suggestions on how to tackle this are more than welcome. Perhaps solutions like this already exist but so far I haven't been able to find it.
I think I need to tackle: the control (zooming, panning and changing the selection) and drawing the waveform in the control
Thanks in advance,

I think you should check out this codeplex project
http://wpfsvl.codeplex.com/

Refer to Audio WaveForm Drawing Using WPF.
Something based upon WaveFileTrimmerControl.xaml would be useful, it uses related controls PolygonWaveFormControl.xaml & RangeSelectionControl.xaml (links are to the XAML but refer to the CS also). In any case it'd be a good starting point for building a control that exactly meets what you want.
You could override the render method and use primitives which will give possibly better performance; but like anything related to performance I'd try the above approach first which is almost certainly good enough.

Related

Detection of defacts during video rendering ( which algorithm to use)

I would like the system to pin point/highlight the deformed area to the user during video rendering. Lets say currently I have an image with a list of squares as shown in the image below, this is the original image without defects.
In the following image, is the sample image that consist of a defect, whereby there is an extra line in between the squares.
I would like to have something as shown in the sample image below where by it will have a red square to highlight the "extra line" to inform the user that there is a defect and will pin point the defect to the user.
The defects may appear in any kinds of shapes or forms, and I would like to pin point the defects to the user. So what kind of algorithm I should use in order to achieve this?
Also, is machine learning required in order to achieve this?
Currently I am using Emgucv in C#, but I am not sure what algorithm I should use that can achieve this. Any suggestions are appreciated.
Thank you.
You could just to an cv::absdiff to find the changed areas. After that, use findcontours to group the defects and draw an outline around them.

Animate a sprite by using two images

I would have thought this was a common desire, but I'll be damned if I can find this.
I simply want to Animate an image by swapping two images back and forth. I tried StoryBoard, but apparently you can't change the source in a storyboard. The only answer I can come up with is a Timer, which I don't think is the best way.
Edit: How do I animate image content in WPF? Came up in the "Similiar Questions" window. And while this will do what I want, it is "hackish" as the OP of it says, and it only swaps two images, what if I wanted a whole sequence of 10 or 20 or 100.
I found another post here on SO whose answer sounds like it could solve your problem: Change an image during animation using storyboard
The problem with this approach is that it also doesn't satify your request for supporting an arbitrary number of images.
I was going to propose a different method that involves databinding the Image Source to the image path, and then in code behind simply changing the path, but I haven't gotten it to work yet.
Here's an article that seems to have an elegant way to handle your requirements: http://www.codeproject.com/Articles/364529/Animation-using-Storyboards-in-WPF
Hopefully that will work for you.

High performance plot control in WPF

I am doing some work for which I need to develop a control, it should be a simple graph that shows several points and two edges.
My problem is that I need to show up to 16k points, with an update rate of 30 Hz. Has anyone done something similar?, and has any advice?.
For example whether to inherit from FrameworkElement or Control (ItemsControl in this case). If the control inherits from FrameworkElememt it may have a better performance drawing the points in the OnRender method but I would miss the Templating feature that comes from inheriting from Control.
Or does there exist another control that can do this out there?
Thanks in advance for your time.
I ended up using InteropBitmap, it is the fatest bitmap rendering class from WPF.
It allows you to map the image that you want to paint (in memory) and then reder it as a Image. This was perfect as i needed to plot points on the screen.
I got great performance (almost 50Hz for 20k points), i also use PLINQ to update the points in memory.
check this article for more details...
Try and read about ZoomableCanvas. I believe it can solve your problem. You can render all the points as small rectangles/ellipses inside the ZoomableCanvas.

Image OCR - Filtering unwanted data

Basically I'm reading vehicle license plates using tessract OCR, however despite being able to emphasise text easily enough via changing contrast, reducing noise an so on, some 'parts' of the vehicle remain on the image which does cause the OCR to throw bad results.
For example take:
I can change this easily enough, such as:
I'm looking to eliminate the edges off each plate, here's another example:
I could remove the edges using pixel manipulation algorithm, however I don't feel it's the right method, and would cause quite a lot of problems.
I've been using the following application to test various methods such as morphology and eliminating the unwanted data, so far I haven't been successful.
http://www.codeproject.com/KB/GDI-plus/Image_Processing_Lab.aspx
However someone with knowledge of this could use the application on the article above to achieve want I'm trying, so feel free to give it a try.
Thanks
Please try to use stroke width transformation concept.
This concept use to segment text from natural images.....
I already did such an algorithm. I just can say that it works great. The secret is, that you need to know that the light is coming just from one side perhaps. You cannot set the image to "black/white" just by using ONE threshold.
Detect the average luminance of parts of the image and use this luminance calculation to set the threshold for each region.
For example, if the left top is lighter, you need a lower threshold to make these parts not to bright. And if the bottom right has low light, you need to set the threshold higher to receive all existing light information.
Then, you need just to drive into the image from each side by using the method:
IsPixelAboveThreshold ?
If it is below, you are on the border, if it is above, you can say you are on the middle of the image with more brightness.
Regards

WPF - Dynamically rearrange control hierarchy

How is it possible to dynamically fill a container? Let's say to fill a big circle with small circles, recursively. Just fill the space fine.
I would like to use it for data hierarchy display.
To make it clear:
If you want something off the shelf, have a look at Graph#
http://graphsharp.codeplex.com/
videos here:
Simple usage scenario
http://www.youtube.com/watch?v=VTbuvkaPGxE
Data Visualization with Graph#
http://www.youtube.com/watch?v=agDPDzqB4o0&feature=related
It does dynamic graph layout and is fairly easy to use. There are a choice of layout algorithms [see sample app] each of which are configurable.
however filling until an area is "full" is not something that'll work out of the box. Although you could for example create a graph, lay it out & then measure the ratio between the size of a vertex and the size of the whole graph, then add or remove vertexes until you hit upon your desired density. I would hazard you could pretty quickly by trial and error come up with a quick and dirty forumula between the size of canvas to fill & the number of vertexes you should add.
Note that you can customise the vertex templates pretty easily to be any kind of data [this is standard wpf but Graph# specific examples can be found on http://graphsharp.codeplex.com/discussions ]
if you wanted to code your own layout you might like to have a look at some of the techniques Graph# use... for example a dynamic zoom component the source for which is available here: http://wpfextensions.codeplex.com/
hope that helps a little

Categories