Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I programmatically position a canvas in Silverlight?
    primarykey
    data
    text
    <p>I'm using Silverlight 3/C#, and I'm trying to create some XAML objects programatically in response to a user clicking on a button.</p> <p>However, I can't seem to position a <code>Canvas</code> object that I have created - when I call <code>SetValue()</code> on the new <code>Canvas</code> with the <code>Canvas.LeftProperty</code> value, the browser window clears to an empty screen.</p> <p>I have a simple function that exhibits the problem (I started out with something more complex):</p> <pre><code> private Canvas MakeNewCanvas() { Canvas newCanvas = new Canvas(); newCanvas.Width = newCanvas.Height = 50; newCanvas.SetValue(Canvas.LeftProperty, 10); return newCanvas; } </code></pre> <p>and a simple button click handler that calls this:</p> <pre><code> private void MyButton_Click(object sender, System.Windows.RoutedEventArgs e) { myPage.Children.Add(MakeNewCanvas()); } </code></pre> <p><strong>NB</strong>: myPage is a Canvas object defined in my app's MainPage XAML file.</p> <p>I've traced this through in the VS debugger with the SL app executing in Firefox, and whenever it executes the <code>SetValue()</code> line, the browser goes white and starts trying to download data (according to the status bar). I tried calling <code>SetValue()</code> after I've put the <code>Canvas</code> in the XAML tree with something like:</p> <pre><code> myPage.Children.Add(newCanvas); newCanvas.SetValue(Canvas.LeftProperty, 10); </code></pre> <p>but it makes no difference - as soon as the <code>SetValue()</code> call is hit, the browser goes white.</p> <p>The <code>Canvas</code> class seems to have no direct method of setting Left/Top on itself, apart from the <code>SetValue()</code> function with dependency property enum values. There's also <code>Canvas.SetLeft()</code> and <code>Canvas.SetTop()</code> but I guess they're just shims onto <code>SetValue()</code>. Using them didn't help anyway.</p> <p>If I don't call <code>SetValue()</code>, then my canvas appears (and child objects I've added to it) in the SL app as you might expect, in the very top left.</p> <p>If I create and position a <code>Canvas</code> object in Expression Blend, then the XAML generated includes <code>Canvas.Left</code> and <code>Canvas.Top</code> property values on the <code>Canvas</code> itself, as I would expect, so it seems to me that what I'm trying in C# should work.</p> <p>But I don't seem to be able to set the left/top values myself from C# without the SL in the browser going all weird.</p> <p>Any ideas?</p> <p><em>Edit: my approach is correct, but canvas coords need to be floating point, not integer - see accepted answer for details.</em></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload