Canvas root = FindName("root")
as Canvas;
ScaleTransform scale = new ScaleTransform();
scale.ScaleX = _document.GetElementByID("someElement").getAttribute('width');
scale.ScaleY = _document.GetElementByID("someElement").getAttribute('height');
root.RenderTransform = scale;
ScaleTransform works the the percentage of the actual canvas scale (1 = 100%, 0.5 = 50%) and if you set the scale with getAttibute('Width') then it is going to multiply the canvas by that number (the actual canvas will be width times wider) I haven't tried
it (I dont use JavaScript) but I think it works that way.
ScaleTransform works the the percentage of the actual canvas scale (1 = 100%, 0.5 = 50%)
Yes, you are correct Cass (seems I forgat that). I usually use ScaleTransform to create a relative size canvas to an other canvas (not to HTML elements).
Thanks a lot. man.. For the time being, I'm facing the VS 2008 installation problem on Windows Vista. so, I can't continue learning... I spent the whole day to figure out what the problem is ...
Do you have any idea how to check whether my Vista is pre-released version or not? Actually, I got this OS (Vista Home Premium) when I bought a laptop (Sony VAIO). I tried to install the .NET 3.0 sp1 on that machine but it failed. I got the message that
this product is not supported on Vista Operation System.
(If this has answered your question, please click on "Mark as Answer" on this post. Thank you!)
I just come to know that .NET 3.0 sp1 doesn't support for Vista.. I just manged to install .NET 3.5 right now... (not sure why it works right now.) .. i hav to try to install VS 2008 again...
(If this has answered your question, please click on "Mark as Answer" on this post. Thank you!)
// Give the keyboard focus to the Silverlight control by default
document.body.onload = function() {
var silverlightControl = document.getElementById('SilverlightControl');
if (silverlightControl)
silverlightControl.focus();
}
When I try to do this I get an null string for the width. From what element did you manage to get the width? Did you modify the default generated test page to test this?
(From a default application auto-generated code)
public void Page_Loaded(object o, EventArgs e)
{
InitializeComponent();
HtmlDocument _document = HtmlPage.Document;
_document.GetElementByID("SilverlightControlHost").GetAttribute("id"); --> equal to SilverlightControlHost as expected
_document.GetElementByID("SilverlightControlHost").GetAttribute("width"); -> Is null
...
Did a few more,
.GetAttribute("style") is set to [object],
_document.GetElementByID("SilverlightControlHost")..ccsClass is silverLightHost
But I didn't figure out how to extract the width from the style neither...
Any hints?
What I want to do at the end, is to make the page full screen on the browser (using BrowserHost.IsFullScreen = true;) then adjust the size of all the various components according to the available space on the screen...
mchlSync
Star
14968 Points
2799 Posts
How to specify the height and width of Canvas by percentage.?
Dec 14, 2007 07:03 AM | LINK
The code below doesn't work. Can anyone tell me how to specify the height or width of Canvas by percentage? Thanks.
<Canvas xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="100%"
Height="280"
Background="Yellow"
>
</Canvas>
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
Aleho666
Member
93 Points
33 Posts
Re: How to specify the height and width of Canvas by percentage.?
Dec 14, 2007 09:27 AM | LINK
I guess the 100% should be related to some value.
you can specify the percentage of silverlight host in de createsilverlight function:
function
createSilverlight(xaml){Silverlight.createObject(xaml, document.getElementById("SilverlightControlHost"),
"SilverlightControl",
{width:'100%', height:'100%', version:'1.1'},
{onError:null, onLoad:null},null); }
Or you can calculate the size of the canvas in relation to the browser size or html element
(haven't tested this, but i think it should work):
public
void Page_Loaded(object sender, EventArgs e){HtmlDocument _document = HtmlPage.Document;
Canvas root = FindName(
"root") as Canvas;ScaleTransform scale = new ScaleTransform();
scale.ScaleX = _document.GetElementByID("someElement").getAttribute('width');
scale.ScaleY = _document.GetElementByID("someElement").getAttribute('height');
root.RenderTransform = scale; }
Anonymous Silverlight user
mchlSync
Star
14968 Points
2799 Posts
Re: Re: How to specify the height and width of Canvas by percentage.?
Dec 14, 2007 09:39 AM | LINK
Thanks. I will try and let you know.
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
Cass
Contributor
3157 Points
654 Posts
Re: How to specify the height and width of Canvas by percentage.?
Dec 15, 2007 08:16 PM | LINK
ScaleTransform works the the percentage of the actual canvas scale (1 = 100%, 0.5 = 50%) and if you set the scale with getAttibute('Width') then it is going to multiply the canvas by that number (the actual canvas will be width times wider) I haven't tried it (I dont use JavaScript) but I think it works that way.
I think, this should work
Double width = _document.GetElementByID("someElement").getAttribute('width');
root.SetValue(WidthProperty, width);
This will get better in Silverlight 2.0 with "{Binding }" property.
Correct me if I am wrong.
Imran Shaik - Vectorform
Old Blog | Silverlight 2.0 Quintessential Rambling |My Feed
Aleho666
Member
93 Points
33 Posts
Re: How to specify the height and width of Canvas by percentage.?
Dec 16, 2007 01:02 AM | LINK
Yes, you are correct Cass (seems I forgat that). I usually use ScaleTransform to create a relative size canvas to an other canvas (not to HTML elements).
Anonymous Silverlight user
mchlSync
Star
14968 Points
2799 Posts
Re: Re: How to specify the height and width of Canvas by percentage.?
Dec 16, 2007 04:24 AM | LINK
Thanks a lot. man.. For the time being, I'm facing the VS 2008 installation problem on Windows Vista. so, I can't continue learning... I spent the whole day to figure out what the problem is ...
Do you have any idea how to check whether my Vista is pre-released version or not? Actually, I got this OS (Vista Home Premium) when I bought a laptop (Sony VAIO). I tried to install the .NET 3.0 sp1 on that machine but it failed. I got the message that this product is not supported on Vista Operation System.
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
mchlSync
Star
14968 Points
2799 Posts
Re: Re: Re: How to specify the height and width of Canvas by percentage.?
Dec 16, 2007 04:36 AM | LINK
I just come to know that .NET 3.0 sp1 doesn't support for Vista.. I just manged to install .NET 3.5 right now... (not sure why it works right now.) .. i hav to try to install VS 2008 again...
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
mchlSync
Star
14968 Points
2799 Posts
Re: How to specify the height and width of Canvas by percentage.?
Jan 08, 2008 03:26 AM | LINK
I just tested and it doesn't work.
1. TestPage.html
.silverlightHost { width: 855px; height : 100%; }
2. TestPage.html.js
// JScript source code
//contains calls to silverlight.js, example below loads Page.xaml
function createSilverlight()
{
Silverlight.createObjectEx({
source: "Page.xaml",
parentElement: document.getElementById("SilverlightControlHost"),
id: "SilverlightControl",
properties: {
width: "100%",
height: "100%",
version: "1.1",
enableHtmlAccess: "true"
},
events: {}
});
// Give the keyboard focus to the Silverlight control by default
document.body.onload = function() {
var silverlightControl = document.getElementById('SilverlightControl');
if (silverlightControl)
silverlightControl.focus();
}
}
3. Page.xaml.cs
HtmlDocument _document = HtmlPage.Document;
ScaleTransform scale = new ScaleTransform();
scale.ScaleX = Convert.ToDouble (_document.GetElementByID ("SilverlightControlHost").GetAttribute ("width"));
scale.ScaleY = Convert.ToDouble (_document.GetElementByID ("SilverlightControlHost").GetAttribute ("height"));
this.RenderTransform = scale;
It shows nothing on the browser. Did I miss something? Thanks in advance.
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
mchlSync
Star
14968 Points
2799 Posts
Re: How to specify the height and width of Canvas by percentage.?
Jan 08, 2008 03:32 AM | LINK
Thanks. It works with Cass's code.
Double width = _document.GetElementByID("someElement").getAttribute('width');
root.SetValue(WidthProperty, width);
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
lud19
Member
2 Points
1 Post
Re: How to specify the height and width of Canvas by percentage.?
Jan 08, 2008 07:04 PM | LINK
When I try to do this I get an null string for the width. From what element did you manage to get the width? Did you modify the default generated test page to test this?
(From a default application auto-generated code)
public void Page_Loaded(object o, EventArgs e)
{
InitializeComponent();
HtmlDocument _document = HtmlPage.Document;
_document.GetElementByID("SilverlightControlHost").GetAttribute("id"); --> equal to SilverlightControlHost as expected
_document.GetElementByID("SilverlightControlHost").GetAttribute("width"); -> Is null
...
Did a few more,
.GetAttribute("style") is set to [object],
_document.GetElementByID("SilverlightControlHost")..ccsClass is silverLightHost
But I didn't figure out how to extract the width from the style neither...
Any hints?
What I want to do at the end, is to make the page full screen on the browser (using BrowserHost.IsFullScreen = true;) then adjust the size of all the various components according to the available space on the screen...