SliverLight2 Beta Quick Tip: Implement MultiScaleImage behavior like in Image Control

11 במרץ 2008

תגיות:
2 תגובות

Using MultiScaleImage control we get a vivid user friendly image manipulation experience in this quick tip I will demonstrate how to provide the same experience using Image control in SilverLight 2 Beta.

In the Expression Blend Blog we can find the source code on how to implement Zooming using MultiScaleImage I have used this code and replaced the MultiScaleImage with Image:

<Grid x:Name="LayoutRoot" Background="White">

    <Image Width="770" Height="570" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" x:Name="MainImage"/>

</Grid>

*Notice* I didn't provided source for our Image.

And in the Code file I have used ScaleTransform:

public Page()

{

    InitializeComponent();

 

    this.MouseMove += delegate(object sender, MouseEventArgs e)

    {

        this.lastMousePos = e.GetPosition(this.MainImage);

    };

    this.MouseLeftButtonUp += new MouseButtonEventHandler(Page_MouseLeftButtonUp);

    new MouseWheelHelper(this).Moved += delegate(object sender, MouseWheelEventArgs e)

    {

        if (e.Delta > 0)

        {

            zoom *= 1.2;

        }

        else

        {

            zoom /= 1.2;

        }

 

        ScaleTransform scaleTransform = new ScaleTransform();

        scaleTransform.CenterY = this.lastMousePos.Y;

        scaleTransform.CenterX = this.lastMousePos.X;

        scaleTransform.ScaleX = zoom;

        scaleTransform.ScaleY = zoom;

 

        MainImage.RenderTransform = sc;

    };

}

Using this code you will have the same experience.

In my next post I will try to provide Panning Behavior.

Source Code

Enjoy!  

הוסף תגובה
facebook linkedin twitter email

כתיבת תגובה

האימייל לא יוצג באתר. (*) שדות חובה מסומנים

2 תגובות

  1. Al Pascual22 באפריל 2008 ב 20:54

    Do you know how to override the source property on MultiScaleImage?

    להגיב
  2. Yogev23 באפריל 2008 ב 10:01

    Hey, could please explain a bit more about your requirements?

    להגיב