Can i do the following in a silverlight page/app? (Note: the silverlight app will be embedded on an ASP.NET MVC website page) :-
Display an image from a resource: eg. www.someDomain.com/image.png
Url of the image to display is passed into the control (ie. it's not hardcoded, but .. say .. entered into a textbox via the user, on the page).
Resize the image.
Add layers to the image. A layer could be .. i donno .. some basic text or another image or icon
change the font or font-size of a layer font.
'Save' the modified image to another url, via an HTTP-POST. So if i've resized the image or added some text-layers these are all rendered into a single bitmap (png/jpg/whatever) which is then POST'ed to a url as binary. (ie. multipart/form-data)
Note:
I've asked this question before but that was for Flash (flv/swf). I'm now interested if this can be done in silverlight.
Updated Question
Also, what software is required to create these silverlight apps? VS2008? Expression blend? I know u can use notepad .. but i'm so new to this I would need some WYSIWYG app, I expect.
The Writable Bitmap API Silverlight 3 sounds pretty much what you're after. You can use the standard Silverlight controls such as TextBlock and Image to lay the image and layers out and then use the API to take a "screenshot" of that layout to upload to a server.
Hope this helps.
Yes it can, but it has similar crossdomain restriction as flash. You'll need a crossdomain.xml or clientaccesspolicy.xml in place on the remote servers to allow silverlight to communicate with them. There is an ms article here which gives some more information on the restrictions on using silverlight to talk to other servers.
Once you have the image then you can manipulate it on the client side using the normal .net libraries for such purposes.
So you might load it with
Bitmap bitmap = new Bitmap(<some stream>);
Graphics g = Graphics.FromImage(bitmap);
and then you can play with it in any way you wish.
g.DrawString("Silverlight image",
new Font("times", 32),
SystemBrushes.WindowText, 0, 0);
Related
I'm currently trying to implement some reporting functionality which requires me to transform some Silverlight XAML content into images without the UI actually being generated on the Silverlight client.
The problem I'm trying to solve is this - how can I render the Silverlight XAML as an image without it being first displayed on the Silverlight client? The only time I've done this before was by using the WriteableBitmap API to render a currently displayed UI as an image and then converting to PNG/JPEG as appropriate. As I have the option of rendering the XAML server side, I was hoping to use WPF functionality to render the XAML - but as it's Silverlight XAML will this work?
If there's no nice way to do this, the other option as far as I can see is to try and render the UI hidden in the background of the PDF viewer Silverlight client control, pull the writeable bitmap and generate it that way - but obviously there's an overhead with this approach and it's not ideal...
Any thoughts on this appreciated, it has me scratching my head for the past couple of days!
I would try using the WPF runtime to render the XAML and generate a BMP from that. Typically, XAML that works in Silverlight will work in WPF, though the opposite is not always true.
WPF should let you programmatically instantiate the controls or load up loose XAML. Then you can tell it to update the layout and finally capture the visual to a bitmap.
EDIT
To get the xaml on the server, I'd recommend that you create a new WPF class library project in your solution. Then "Add Existing" items to that project and select to add the desired xaml files as a "linked" file, rather than copying them in. That way you can share a single file between the silverlight and the wpf projects.
Compile that DLL and use it on the server within a service or page that will return the image output. In that page, create an instance of the user control , set the datacontext, and output the image. To capture an image from a visual, you can use RenderTargetBitmap.
Here's a snippet:
var arrangeSize = new Size(300, 300);
var arrangeRect = new Rect(new Point(0, 0), arrangeSize);
var control = new MyControl();
control.DataContext = new MyViewModel();
control.Measure(arrangeSize);
control.Arrange(arrangeRect);
control.InvalidateVisual();
control.UpdateLayout();
RenderTargetBitmap renderTarget =
new RenderTargetBitmap(
arrangeSize.X,
arrangeSize.Y,
96,
96,
System.Windows.Media.PixelFormats.Default
);
renderTarget.Render(control);
var encoder = new PngBitmapEncoder();
encoder.Frames.Add(BitmapFrame.Create(renderTarget));
using (var pageOutStream = new FileStream(targetSavePath + ".png", FileMode.Create, FileAccess.Write))
{
encoder.Save(pageOutStream);
pageOutStream.Close();
}
An unusual request... what may suit your purpose is Chromium, and specifically some of the .Net wrappers for it. You can instantiate it in memory, render an HTML page (including Silverlight) to it, then render that out as an image (that functionality is built into the wrappers). Now this means you are still "downloading" and "rendering" the page, but you also state that doing this server side is okay.
The two Chromium wrappers that i'm familiar with are Awesomium and Troymium. Awesomium is professionally developed and has a reasonably attractive indie licencing model, while Troymium is still in beta and is possibly not quite as mature but has a more extensive wrapper (and is currently free). Awesomium has a sample included of downloading a web page then rendering it to an image.
Note that you won't be able to use any WPF functionality, Silverlight uses a separate runtime.
After much trying and failing I've decided to just go with rendering the UI using GDI in on the server side.
Spent way too much time trying to force this with Silverlight, thanks for all the suggestions guys.
for my final project in university i am developing in asp.net mvc3 and using silverlight for vector graphics.
I store silverlight code as string/xml in a database, and i want the ability to manipulate it dynamically (change proportions etc..) and display it in my aspx view. i don't want and can't use files because of scalability issues (there will be a lot of them) and because of possible porting of the application to the cloud (Azure).
basically i want to build a controller that will take raw xaml code from the DB and display it. all the solutions i found on the web are about two options which is not helpful for me:
http://msdn.microsoft.com/en-us/library/cc189044(VS.95).aspx - which involves manually creating the entire dom object and integrating it in an existing silverlight page, which i don't have
http://visualstudiomagazine.com/articles/2008/01/21/using-inline-xaml-with-silverlight-listing-2.aspx - using embedded header in the html itself - again not pracrtical..
maybe someone can suggest me a practical solution for my problem
I would suggest the you spend sometime examining in detail how the Silverlight navigation framework can be used.
I'm think you should be able to use the Frame element with your own implementation of INavigationContentLoader assigned to its ContentLoader property and possibly your own derivative to UriMapperBase assigned to its UriMapper property.
You would then use a URL like this:-
http://yoursite.com/yourHostController#/yourXamlController/someReference
You would have two views, "yourHost" would simply generate the HTML nececessary to host the Silverlight application you will build. The "yourXaml" view would simply serve up the raw Xaml.
Your Uri mapper will take the relative url supplied after the # (this is how silverlight intra-application navigation works) and create a Uri that can points at yourXaml controller.
Your implementation of INavigationContentLoader will then fetch the Xaml from the Uri and load it up.
Assuming the Xaml contains hyperlinks to using urls like "/yourXamlController/otherReference". You should be able to navigate around your stored Xaml without reloading the Silverlight app. Everything will be about referencing and downloading new chunks of Xaml.
The requirement is below:
--> The version of Silverlight is 3.0
--> I don’t want to convert it to jpg, png etc. since I want end user to copy data from the displayed data.
--> I am currently using IFrame to display pdf but it has some problems like IFrame not supported consistently across different browsers.
--> I could not find any control (third party) that displays pdf with SL 3.0 Most of the controls that I came across are either for 4.0 or does conversion into some png kind of format which doesn’t allow user to copy data. If there is nothing that can be done from SL easily then I am ready to use 3rd party controls that are meant to work with SL 3.0 and allow end user to copy data.
--> I thought about reading data from pdf and displaying again over some control like text block but this would eventually become complicated for scenarios where I have to maintain formatting and displaying images etc.
Please suggest on this.
I think you gonna lose this one. I don't know of anything that renders PDF well in Silverlight 4 let alone Silverlight 3.
Whilst this comment "IFrame not supported consistently across different browsers" may be true IFrame is generally supported by the all major browsers.
Hence your best bet is to test and tweak your IFrame solution with these browsers.
Alternatively launch an independent browser window to display the PDF or let the users local system use whatever it has installed to display the PDF.
I am embarking on development of a Silverlight based website. I am the lone developer and am doing it on my own (ie, not for any company).
Now I want to load a lot of textual content on the website along with animations and rich user interfaces that can be created using Silverlight. The text content may change from time to time and when that happens, I don't want to do a lot of rework. So I m thinking to load the text from a Word/text file into controls and whenever new content arrives/existing content is modified, I just have to append it to the Word/text file.
This way the application itself remains untouched, only the file contents keep changing. Silverlight doesn't support FlowDocument. RichTextBox doesnt have a Load or LoadFile property. So how do I go about this? Should I make use of Frame, Downloader and similar other controls as well? What do you suggest? What would be the best approach to this?
The RichTextBox does have a Xaml property so you could download Xaml files containing the restricted set of textual elements that RichTextBox supports. You could also create a Silverlight editor around which you could create and upload this Xaml text content.
However have you considered whether Silverlight is the right platform to deliver primarily textual content? HTML is pretty good at that and with frameworks such as JQuery you can create quite interactive experiences that work well across browsers.
Is it possible to do image processing in silverlight 2.0?
What I want to do is take an image, crop it, and then send the new cropped image up to the server. I know I can fake it by clipping the image, but that only effects the rendering of the image. I want to create a new image.
After further research I have answered my own question. Answer: No. Since all apis would be in System.Windows.Media.Imaging and that namespace does not have the appropriate classes in Silverlight
I'm going to use fjcore. http://code.google.com/p/fjcore/
Thanks Jonas
Well, you can actually do local image processing in Silverlight 2... But there are no built in classes to help you. But you can load any image into a byte array, and start manipulating it, or implement your own image encoder.
Joe Stegman got lots of great information about "editable images" in Silverlight over at http://blogs.msdn.com/jstegman/. He does things like applying filters to images, generating mandlebrots and more.
This blog discuss a JPEG Silverilght Encoder (FJCore) you can use to resize and recompress photos client size: http://fluxcapacity.net/2008/07/14/fjcore-to-the-rescue/
Another tool is "Fluxify" which lets you resize and upload photos using Silverilght 2. Can be found over at http://fluxtools.net/
So yes, client side image processing can definetly be done in Silverilght 2. Happy hacking!
I know this doesn't directly answer your question, but what if you do all of the clipping on the client side to crop the image, then send the server the original image and the coordinates for clipping. Then on the server side, which will probably more suited for image manipulation like this (e.g. PHP it's very easy) you'll do the actual cropping of the image and storing the cropped version.
There is first-class support for bitmap surfaces in Silverlight 3: http://blogs.msdn.com/kaevans/archive/2009/03/20/some-silverlight-3-goodness-using-writeablebitmap.aspx