I have HTML code something like -
<html>
<body>
<table><tr><td><h1>Heading</h1></td></tr></table>
</body>
</html>
In a specific requirement, I need to know in advance that how much height will this HTML will take to display in fullscreen. So that I keep that much space calculated specifically for that content.
What I thought was to render this code in WebBrowser control, and then take the height.
this.webBrowser1.Url = new Uri(htmlFilePath);
//The below code will force the webbrowser control to load the HTML in it.
while (this.webBrowser1.Document.Body == null)
{
Application.DoEvents();
}
int height = this.webBrowser1.Document.Body.ScrollRectangle.Height;
But in console application I can't use WebBrowser control. Is there any other way I can accomplish this?
Answering my own question -
All I needed to do was adding reference of System.Windows.Forms in my console application.
After that I was able to use WebBrowser in headless form directly without creating any form element.
After using WebBrowser, I set the height/width of reasonable number. Something like below -
WebBrowser wb = new WebBrowser();
//Setting the page height and width to a reasonable number. So that whatever the content loaded in it gets aligned properly.
//For me 3000 works fine for my requirements.
wb.Width = 3000;
wb.Height = 3000;
wb.Url = new Uri(htmlFilePath);
//the below code will force the webbrowser control to load the html in it.
while (wb.Document.Body == null)
{
Application.DoEvents();
}
int height = wb.Document.Body.ScrollRectangle.Height;
Related
I'm trying to add a Print function to a WPF Project. The user can add and delete text to textbox or other controls at runtime so the size of the xaml control is not fixed. If he clicks the print button i want to figure out the size of the control and print a (if neccessary multipage) document. this is my code so far
public void Print(FrameworkElement element)
{
System.Windows.Controls.PrintDialog printDlg = new System.Windows.Controls.PrintDialog();
if (printDlg.ShowDialog() == true) {
double height = element.ActualHeight;
double width = element.ActualWidth;
Size pageSize = new Size(printDlg.PrintableAreaWidth, printDlg.PrintableAreaHeight);
//element.Measure(pageSize);
//element.Arrange(new Rect(5, 5, pageSize.Width, pageSize.Height));
printDlg.PrintVisual(element, "this is a test");
}
}
My idea is to check the actual height and width of the control. If one of these is larger than the pagesize, I know i have to print multiple pages. I'm not quite sure how to do that, but i think i will have to make use of XPSDocument class. Can someone please help me, I dont know how I can split my document into multiple pages and print them and can someone also tell me how to create a FlowDocument from my xaml code.
thanks in advance!
By default, you can't print control on multiple pages, but you can do it manually.
Here's the GREAT article, which solves your problem:
http://www.codeproject.com/Articles/164033/WPF-Visual-Print-Component
I am using ASP.NET and C# and I am using window.open() for opening the window.Now i need to set the width of that page in that window.
I am using this code on buttonclick event.
ClientScript.RegisterStartupScript(this.GetType(), "oncl", "<script language=javascript>window.open('Print.aspx','PrintMe','width=900,resizable=1,scrollbars=1');</script>");
The width inside the script is only setting the widow width. But i want to set the width of the page.
Is it possible?
Thanks..
Edit:
Sorry I didn't mention it before.I am writing the content into print.aspx dynamically.That i am using this code for fill the page.
Page pg = new Page();
pg.EnableEventValidation = false;
HtmlForm frm = new HtmlForm();
pg.Controls.Add(frm);
frm.Controls.Add(ctrl);
pg.DesignerInitialize();
pg.RenderControl(htmlWrite);
string strHTML = stringWrite.ToString();
HttpContext.Current.Response.Clear();
HttpContext.Current.Response.Write(strHTML);
This is called on pageload event. So i am printing the .aspx page in print.aspx. So i want this content should be in the static page width.
Width specified inside window.open() function will only set width of the popup window. If you want to change the width of the page then you should try changing the width inside Print.aspx.
You cannot change width of the page using window.open, it only sets the window properties.
To change the width of the page you need to change the style of print.aspx
probably if you have to change the width of the wrapped div element or body of the page
var newwindow = window.open('Print.aspx');
var elem = newwindow.document.getElementById('my-id');
elem.style.width = 'XYZpx'
P.S. :- The above code will only work if the new window has the same protocol, domain and port. If it's on another domain, you can't do this for security reasons.
You can also use
window.resizeTo(x,y);
For Instance:
function resizeWindow()
{
// you can get height and width from serverside as well
var width=400;
var height=400;
window.resizeTo(width,height);
}
On onload() event of body call the function
<body onload="resizeWindow()" >
body of page
</body>
In case which you're using that page only with the window.open method then set the width of the page respectively hard-coded, otherwise, inject the size while opening the page using window.open.
How to inject while opening:
Access child window elements from parent window using Javascript
(Notice to security issues on Cross-origin resource sharing)
In short:
var childWindow = window.open('Print.aspx','PrintMe','width=900,resizable=1,scrollbars=1');
childWindow.document.getElementById('someDivId').style.width = '400px';
Or access it at the server-side:
HtmlForm frm = new HtmlForm();
frm.style = ; //
read here
How to set it hard-coded:
Width of which element in the window you want to change?
body?div?
I guess you you're taking about the margin left & right of your page's body.
try insert the following style block to your head tag:
<style>
body{margin: 0 10px 0 10px;}
</style>
where 10px is the left and right margin.
I'm working on a screen reader and till now I was successful to get the whole text of a page in IE. But I have no idea how to get the current visible part of page or to get the current paragraph that is under the cursor in IE.
I don't mean to give me the code, but just to recommend me if there is a way to do it using APIs or similar things.
from what I found I think it’s not doable using Accessibility APIs.
I GREATLY appreciate any ideas and helps.
If you're application is a WinForms app, you might want to look into using the Browser control. I'm still a bit unclear about what you're looking for, but I think the browser control is what you'll need.
Here's a similar question that may point you in the right direction:
C# WebBrowser control -- Get Document Elements After AJAX?
To access the contents of a paragraph when the cursor moves over it you could use javascript:
var oP = document.body.getElementsByTagName('p');
for (var i = 0; i < oP.length; i++) {
oP[i].onmouseover = function() {
var content = oP[i].innerHTML;
// Do whatever you want with content.
};
}
This will fire the onMouseOver event when cursor moves over a paragraph and you will then be able to read it's content.
Im writing a web site which has a page that must show an image. This image is created by an HttpHandler using querystring commands, how can I make this works without any kind of flickering?
Thanks in advance, if you need some code Im happy to share it!
You could use 2 UpdatePanels and switch them after each "reload":
Load Frame1 into Panel1 and hide Panel2 at Postback/Pageload
Load Frame2 into Panel2 per AJAX and after the Image is loaded show Panel2 and hide Panel1
Load Frame3 into Panel1 per AJAX and after the Image is loaded show Panel1 and hide Panel2
aso....
You then could even make a smooth fading from Panel1->Panel2 using JS (see HERE or easier with jQuery fadeIn() and fadeOut()).
I used the following code for a project, where I had a similar problem. Maybe this can help solve your issue.
(function($) {
var cache = [];
// Arguments are image paths relative to the current page.
$.preLoadImages = function() {
var args_len = arguments.length;
for (var i = args_len; i--;) {
var cacheImage = document.createElement('img');
cacheImage.src = arguments[i];
cache.push(cacheImage);
}
}
})(jQuery)
After preloading the images, the transition was very smooth.
p.s. I don't remember where I got this, so I can't give credit. Sorry.
I have a C# webbrowser that holds an html page that has several iframes. Each iframe holds an arbitrary html file, often with images. The img tags often don't have any width or height attributes (ie, it's often just <img src="someimage.jpg">).
I've read about how to size iframes based on their content, and have gotten it to work using jquery. The following jquery snippet is present in the iframe's html:
$(document).ready(function() {
$('img').each(function(){
$(this)
.bind('load readystatechange', function(e) {
var iframes = window.top.document.getElementsByName(window.name);
if (iframes.length == 1) {
window.top.DoResizeFrame(iframes[0]);
}
})
});
DoResizeFrame is defined in the parent html file (the one that the webbrowser is showing):
function DoResizeFrame(fr) {
if (fr && fr.Document && fr.Document.body) {
fr.style.height = fr.Document.body.scrollHeight + 'px';
fr.style.width = fr.Document.body.scrollWidth + 'px';
}
}
I also call DoResizeFrame from the parent document's $(document).ready event. This works great - if there are no images, the document's ready event triggers a resize. If there are images, each time an image is finished loading, the iframe is properly resized.
However, loading a large image causes the iframe to be improperly sized until the image is completely loaded. Since I rarely have the width and height attributes in the image tag to work with, I figured I could use jquery to listen to the readystatechange event of the image, and when it's "loading", pick up the size of the image and properly size the iframe even while the image is still loading. Unfortunately, at least in IE7, readystatechange=loading only happens after the image is done being downloaded.
Does anyone have any ideas how I can detect the size of an image referenced in my html simply by "<img src="someimage.jpg">" without waiting for the entire download to happen? I'm trying to provide the best user experience by sizing everything correctly, so that the user can read the rest of the iframe even if a large image is taking a while to download.
thanks!
jean
One dependable way to be sure is to ask the server the size of the image before downloading it. I've done this using .net, it's quite easy.