I'm designing a Windows 8 Reader App, and I have to use a control to show the HTML content, which is fetched from some website feeds. Cause those HTML content may contains images or some other formatted text, now I'm using a richtextblock to show the HTML content, but it costs a lot of time to parse the HTML content.
So I'm wondering if there is any controls that can handle the HTML content except the WebView.
Thanks.
Updated:
The reason I can't use WebView is that I need to implement pagination, like the image belowed:
As JP Alioto mentioned you should use the WebView control.
You can use the NavigateToString method to load the HTML. Or use Navigate to request a URI.
There are issues however with using the WebView control, specifically it is rendered differently and is not a standard control, this means things like your app bar or settings pane will not render on top of the WebView, there is a workaround by using the WebViewBrush to "paint" the WebView to standard control such as a rectangle when needed.
Also you can make a screenshot of the webpage you want to display. But to make a screenshot of webpage it's also not easy to do, but I offer you to make it with some special sites wich are created to take screenshot of other websites. Then you can download an image this sites return and open and display it in your windows 8 app. I show You some example how to I did that:
StorageFolder screens = await Windows.ApplicationModel.Package.Current.InstalledLocation.CreateFolderAsync(#"Screens\" + folderName, CreationCollisionOption.GenerateUniqueName);
var downloader = new BackgroundDownloader();
IStorageFile file = await screens.CreateFileAsync(fname, CreationCollisionOption.GenerateUniqueName);
string my_uri = "http://api.snapito.com/web/e3c351d5994134eb1aea855ce78e296c3292d48a/lc/" + url + "?type=jpeg";
DownloadOperation download = downloader.CreateDownload(new System.Uri(my_uri), file);
await download.StartAsync();
I think there are only two options but none of them are really good:
Use WebView and transform your HTML with CSS and other techniques to look native. Use the ScriptNotify and NavigationStarting and other events to navigate to another page. In W8.1 the WebView is much better (eg. treated as regular control not floating over all other controls,...)
Parse your HTML and generate native elements. I started such an implementation and created a XAML control to display HTML with native controls (see https://mytoolkit.codeplex.com/wikipage?title=HtmlTextBlock). However if you have complex HTML (eg iframes, etc.) this may not work and you have no other choice than to use the WebView control.
Related
I need to create a pdf preview that should be displayed on a web page as an image. The pdf file is just a simple report build on almost plain HTML. Essentially I had a problem with displaying checkboxes, now I replaced them with pics of checkboxes but the issue remains the same.
Here how I create the pdf report from my HTML view with help of groovy and grails:
def html = htmlRenderService.getReport(info)
ByteArrayOutputStream out = new ByteArrayOutputStream()
HtmlImageGenerator htmlImageGenerator = new HtmlImageGenerator()
htmlImageGenerator.loadHtml(html)
BufferedImage bi = htmlImageGenerator.bufferedImage
ImageIO.write(bi, "PNG", out)
byte[] bytes = out.toByteArray()
String base64bytes = encoder.encodeToString(bytes)
String src = "data:image/png;base64," + base64bytes
out.flush()
def getReport(Info info) {
return groovyPageRenderer.render(view: REPORT_VIEW,
model: [info: info])
}
Then I send the src string to my view and render it as:<img src="${src}" alt=""/>
Then my checkbox pic looks like this: <div style="/*style stuff*/ background-image: url(data:image/png;base64,LINK_TO_THE_IMAGE"></div>
In the end, I received a picture of my pdf report rendered pretty well displaying as an image on my page, BUT without checkboxes. Here is the picture of one part of it:
And here is the same part but from the pdf document which I rendered all the same way, but just downloaded directed from my webapp:
Here is an example where I combined both options(input checkbox and image checkbox) and rendered it as an image:
So what could cause this issue? Thank you in advance.
UPDATE: I came across today to this comment under another issue with HtmlImageGenerator:
HtmlImageGenerator seems to use a JEditorPane for rendering the HTML. Swing HTML support does not extend to the ability to render data images. It might be possible by digging into the HTMLEditorKit and changing the image loading element to support data images, but then you'd need to find a way to get HtmlImageGenerator to use the altered editor pane.
Seems that HtmlImageGenerator doesn't work well with images inside HTML files, but it's still unclear why it doesn't render checkbox inputs as well.
Without seeing the code you end up with after page load, check the chrome dev tools panel to see if the image has actually loaded correctly to the page which will tell you it's at least accessible to use. Then check if the url is output correctly to the div as the background-image. If it looks correct and there aren't related errors in the console, it is likely a css setting.
With background images, your container will need to contain content or else you will need to specify:
width
height
a display setting
background-position, and a
background-size
If you can upload more info, I might be able to be more specific.
in Blackberry Cascades (C++, QT, QML), I am trying to read the html of a webview - but it is returning blank. This webview uses "setUrl(url") to set the url, and does not use "setHtml(html)". Anyway - I have this code:
WebView {
id: loginView
objectName: "loginView"
onMicroFocusChanged: {
console.log("html: " + html);
}
}
And the webview url has two textfields, and when I put my cursor into those text fields or when I type in them, the html of the webview shows up as blank - but I need to see the html, because I am trying to be able to parse that html to get the content of those textfields.
How come the html is blank - and how can I get access to this html?
The Html property of the WebView only returns the code that was inserted with setHtml. (Documentation)
Even if it did report code loaded from a web address, I doubt it would be updated with the current value of textboxes.
To read their content, I recommend you look into the messageReceived signal of the WebView. If you can change the html-code that contains your text boxes, you can use javascript navigator.cascades.postMessage() to send the data to your application.
If you do not control the html, you can still use the evaluateJavaScript method to extract the values of the textboxes with DOM functions from inside your app.
i have a html file that contains some data,since i display this in a webview the user has to scroll down to view the information,what i want to know is whether i can provide a page curl animation to view the contents of the html so that it becomes easier for the user to read the information by swiping across pages,
should i use pageviewcontroller? or are there any other libraries that let me have the page curl effect on a custom(webview)? how do i proceed? is it possible to show some amount of html information on one page and then user turns to the next page? how do i achieve that,its a single html file
If you want that sort of paging, then maybe you could try the leaves library https://github.com/brow/leaves You can use it to page through various UIWebView's
As you can see in the leaves sample you have to render the page in the renderPageAtIndex.
You can then use something like:
- (void) renderPageAtIndex:(NSUInteger)index inContext:(CGContextRef)ctx {
CGSize screensize = CGSizeMake(320,480);
UIGraphicsBeginImageContext(screensize);
CGContextRef context = UIGraphicsGetCurrentContext();
CGFloat scalingFactor = screensize.width/webView.frame.size.width;
CGContextScaleCTM(context, scalingFactor,scalingFactor);
[webView.layer renderInContext: ctx];
}
You do have to load the webview first.
I want to ask how to embed DWG file in HTML Page.
I have tried using tag with Volo Viewer but this solution run only in IE not in Firefox and Chrome.
Dwgview-x can do that, but it will need to be installed as a plug-in on client computers so that anyone can view the dwg file that you embed online.
There may be third party ActiveX controls that you could use, but I think ultimately you will find that it's not practical for drawing files of even average complexity. I recommend to create DWF (if you need vector format) or PNG files on demand (using e.g. the free DWG TrueView from http://usa.autodesk.com/design-review/ ) and embed those instead.
I use DWG Browser. Its a stand alone program that is used for reporting and categorizing drawings with previews. It saves exports in html too.
They have a free demo download available.
http://www.graytechnical.com/software/dwg-browser/
You'll find what I think is the latest information on Autodesk's labs site here: http://labs.blogs.com/its_alive_in_the_lab/2014/01/share-your-autodesk-360-designs-on-company-web-sites.html
It looks like a DWG can be embeded there is an example on this page, but clearly DWF is the way to go.
You can embed DWG file's content in an HTML page by rendering the file's pages as HTML pages or images. If you find it an attractive solution then you can do it using GroupDocs.Viewer API that allows you to render the document pages as HTML pages, images, or a PDF document as a whole. You can then include the rendered HTML/image pages or whole PDF document in your HTML page.
Using C#
ViewerConfig config = new ViewerConfig();
config.StoragePath = "D:\\storage\\";
// Create HTML handler (or ViewerImageHandler for rendering document as image)
ViewerHtmlHandler htmlHandler = new ViewerHtmlHandler(config);
// Guid implies that unique document name
string guid = "sample.dwg";
// Get document pages in html form
List<PageHtml> pages = htmlHandler.GetPages(guid);
// Or Get document pages in image form using image handler
//List<PageImage> pages = imageHandler.GetPages(guid);
foreach (PageHtml page in pages)
{
// Get HTML content of each page using page.HtmlContent
}
Using Java
// Setup GroupDocs.Viewer config
ViewerConfig config = new ViewerConfig();
// Set storage path
config.setStoragePath("D:\\storage\\");
// Create HTML handler (or ViewerImageHandler for rendering document as image)
ViewerHtmlHandler htmlHandler = new ViewerHtmlHandler(config);
String guid = "Sample.dwg"
// Get document pages in HTML form
List<PageHtml> pages = htmlHandler.getPages(guid);
for (PageHtml page : pages) {
// Get HTML content of each page using page.getHtmlContent
}
Disclosure: I work as a Developer Evangelist at GroupDocs.
I want to display an HTML formatted content in my application preferably inside a Web Browser control.
I could create an HTML document first and then load it in the Web Browser control, but that is just too clumsy.
Is there any way I can load a string that contains HTML code directly into the Web Browser?
String = "<b>Hello</b> World"
Expected output: Hello World
I'm using Visual Basic 9 (VS2008).
You can do this by dragging a WebBrowser control onto your application and then adding the following code:
webBrowser1.DocumentText = "<b>Hello</b> World";
You can open the document object in the Web Browser control then:-
document.write("<b>Hello</b> World");