Skip to main content
Home Forums Silverlight Programming Silverlight Controls and Silverlight Toolkit Scrolling and Zooming in SL 2.0
8 replies. Latest Post by pragati_sd on June 2, 2009.
(0)
PaulM360
Member
14 points
13 Posts
03-11-2008 1:08 PM |
Hi All
In WPF I have a Canvas of fixed size sitting inside a ScrollViewer. Elsewhere I have a Slider and the Value of the slider is bound to a ScaleTransform which I use as the LayoutTransform of the Canvas. This is all good.... as I zoom in or out, the scroll bars change appropriately.
Now, in Silverlight, what to do.... there is no LayoutTransform! I can set the RenderTransform of the Canvas to the ScaleTransform, but the scroll bars do not update to reflect the new scale.
Any ideas?
Thanks
David Anson
Participant
1718 points
212 Posts
03-11-2008 6:02 PM |
As you say, this is a scenario for LayoutTransform; I don't believe RenderTransform is expected to update the ScrollBars (even on WPF). Maybe if you can tell us more about the scenario itself, people might have some alternate ideas for you.
03-11-2008 7:27 PM |
As I said, I have a fixed-size canvas inside a scrollviewer, and a slider:
<
<Canvas x:Name="canvas" Width="1056" Height="816">
When I change the slider, I create a ScaleTransform based on its value and use that to change the scale of the canvas:
ScaleTransform st = new ScaleTransform(); st.ScaleX = val; st.ScaleY = val; canvas.RenderTransform = st;
ScaleTransform st = new ScaleTransform();
st.ScaleX = val; st.ScaleY = val; canvas.RenderTransform = st;
Unfortunately the scroll bars don't change size to indicate changes in the needed size of the canvas.
Yi-Lun L...
All-Star
25052 points
2,747 Posts
03-12-2008 11:55 PM |
Hello, one work round is to add another Canvas with the same size, and manually set its size when the Slider's Value changes. So everything inside the inner Canvas will be affected by its RenderTransform, and the ScrollViewer will be affected by the outer Canvas's size:
st.ScaleX = slider.Value;
st.ScaleY = slider.Value;
canvasIn.RenderTransform = st;
canvasOut.Height = 816 * slider.Value;
canvasOut.Width = 1056 * slider.Value;
ashraful...
2 points
1 Posts
06-25-2008 8:31 AM |
thanks. Its really a simple but quite good solution
cozyshri23
8 points
4 Posts
07-10-2008 5:30 AM |
<ScrollViewer x:Name="scroller" Height="Auto" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" Width="Auto" Grid.Row="1" TextWrapping="NoWrap" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" > <Grid x:Name="ZoomArea"> <Grid Height="Auto" Width="Auto" x:Name="gd"> <Grid.RenderTransform> <TransformGroup> <ScaleTransform x:Name="scaleTransform"></ScaleTransform> <TranslateTransform x:Name="translateTransform"></TranslateTransform> </TransformGroup> </Grid.RenderTransform> <Image Source="Project Resources/badge_1280.jpg"/> </Grid> </Grid> </ScrollViewer>
This is my xaml code and below is the c#
Binding b = new Binding("ActualWidth"); b.Source = centerCanvas; zoomArea.SetBinding(Grid.WidthProperty, b); zoomArea.SetBinding(Grid.HeightProperty, b); scaleTransform.CenterX = currentMousePosition.X; scaleTransform.CenterY = currentMousePosition.Y; scaleTransform.ScaleX *= 1.5; scaleTransform.ScaleY *= 1.5; zoomArea.Width *= 1.5; zoomArea.Height *= 1.5
but it does not work properly, the height of the grid increases but is not proportional to the scaling of the image.
07-14-2008 6:03 AM |
scaleTransform.CenterX = currentMousePosition.X; scaleTransform.CenterY = currentMousePosition.Y;
basically this what is causing the problem, if I comment this line...everything works fine but after zooming the focus is not to the portion of canvas where user had clicked for zoomed view...
how can I solver this ?
ArneHB
18 points
20 Posts
01-20-2009 4:26 AM |
This was most helpfull to me, thanks!
pragati_sd
52 points
24 Posts
06-02-2009 6:37 AM |
Hi!!
This works fine. But, I need something different, I need the inner canvas to be zoomed, but the outer canvas should remain of same dimentions. Please check this one, with mouse wheel, you will get the idea.
http://finviz.com/map.ashx?t=sec_all
Waiting for your reply.
Pragati