It was a relatively straightforward exercise but one thing I noticed is that msi.Width/Height doesn't work properly in Beta 2, but luckily msi.ActualWidth/ActualHeight works! I also used the new tagging format (Metadata.xml) that the latest DeepZoom Composer generates.
The source code has been uploaded and can be found here. Note that the disclaimer from this post still holds!
Posts
13 comments:
Can you please post the code to this greate control. I would like to use it on my site.
Regards,
David
I've noticed that Full Screen does not work properly. This happens in my project too. Do you have a fix for this?
Donavon,
Full Screen works great for me, both on Firefox v2.0.0.14 and IE 6 SP2 (Windows XP). In fact, it seems like they fixed the full screen issue that I noticed in Beta 1.
What issues are you seeing? Can you try a different browser? If it doesn't work for you, I recommend posting this issue on the silverlight.net forums.
Regards
Wilfred
hi wilfred!
would you be so kind and send me a code of this sample? i am having some hard time trying to arrange subimages...
also, have you tried rotating subimages in msi? that would be a great feature.. i am trying to get it work by rotating the entire border of msi.
thank you!
-matija kancijan
The source code is now available. Let me know if there are any issues.
Matija,
It is currently not possible to rotate sub images in the MultiScaleImage control. I tried to apply the rotate transform to the entire msi (since it is possible!) to see how it behaves and the images didn't show up. It didn't throw an error though.
Sorry I couldn't help you here.
Wilfred
Hi wilfred!
I have also tried to rotate the entire msi and images disappeared, so i got around this by using border.
<Border x:Name="msiborder" BorderThickness="0,0,0,0" Margin="0,0,0,0" BorderBrush="#FF9F9F9F" Background="#FF000000" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Width="Auto" RenderTransformOrigin="0.5,0.5" Grid.RowSpan="2" Grid.ColumnSpan="1">
<Border.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform x:Name="msiborderkut" Angle="0"/>
<TranslateTransform/>
</TransformGroup>
</Border.RenderTransform>
<MultiScaleImage x:Name="msi" MinHeight="480" MinWidth="640" RenderTransformOrigin="0.5,0.5" Margin="0,0,0,0" >
<MultiScaleImage.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform x:Name="msirkut" Angle="0"/>
<TranslateTransform/>
</TransformGroup>
</MultiScaleImage.RenderTransform>
</MultiScaleImage>
</Border>
so the in c# code i do this:
void rotateright()
{
this.msiborderkut.Angle += 90;
this.msiborder.Margin = new Thickness(370, -370, 370, -370);
}
(hard coded for now, but it works)
but i am having some problem with adjusting mouse position i guess coordinates are messed up after rotate..
can you help me with this?
thank you!
-matija kancijan
Matija,
I am assuming the issue you are alluding to is that dragging the images doesn't quite work right. If this is true, try this
Replace
dragOffset = e.GetPosition(this);
with
dragOffset = e.GetPosition(this.msi);
in
msi.MouseLeftButtonDown += delegate(object sender, MouseButtonEventArgs e)
Looks like you just discovered a bug!
Let me know if this works for you. If not, let me know exactly what doesn't work and I will investigate...
Regards
Wilfred
Hi Wilfred!
thank you for your response,
yes i was having problems while draging images. this is my solution. will try your suggestion..
-matija kancijan
//globals
double offsetx = 0;
double offsety = 0;
//-------------------------------
this.MouseLeftButtonDown += delegate(object sender, MouseButtonEventArgs e)
{
offsetx = this.lastMousePos.X;
offsety = this.lastMousePos.Y;
}
//-------------------------------
this.MouseMove += delegate(object sender, MouseEventArgs e)
{
if (mouseIsDragging)
{
//---------------------------------------------------------------
Point newOrigin = new Point();
if (this.msiborderkut.Angle == 0)
{
newOrigin.X = currentPosition.X - (((e.GetPosition(msi).X - dragOffset.X) / msi.ActualWidth) * msi.ViewportWidth);
newOrigin.Y = currentPosition.Y - (((e.GetPosition(msi).Y - dragOffset.Y) / msi.ActualHeight) * msi.ViewportWidth);
}
if (this.msiborderkut.Angle == 90)
{
newOrigin.X = currentPosition.X - (((e.GetPosition(msi).X - offsetx) / msi.ActualWidth) * msi.ViewportWidth);
newOrigin.Y = currentPosition.Y - (((e.GetPosition(msi).Y - offsety) / msi.ActualHeight) * msi.ViewportWidth);
}
if (this.msiborderkut.Angle == 180)
{
newOrigin.X = currentPosition.X - (((e.GetPosition(msi).X - offsetx) / msi.ActualWidth) * msi.ViewportWidth);
newOrigin.Y = (currentPosition.Y - (((e.GetPosition(msi).Y - offsety) / msi.ActualHeight) * msi.ViewportWidth));
}
if (this.msiborderkut.Angle == 270)
{
newOrigin.X = currentPosition.X - (((e.GetPosition(msi).X - offsetx) / msi.ActualWidth) * msi.ViewportWidth);
newOrigin.Y = currentPosition.Y - (((e.GetPosition(msi).Y - offsety) / msi.ActualHeight) * msi.ViewportWidth);
}
msi.ViewportOrigin = newOrigin;
}
}
//-------------------------------
void rotateright()
{
double sirina = this.msiborder.Width;
double visina = this.msiborder.Height;
double pozx = this.msiborder.RenderTransformOrigin.X;
double msix = this.msi.ViewportOrigin.X;
double msix2 = this.msi.Margin.Left;
double actualh = this.msi.ActualHeight;
double actualw = this.msi.ActualWidth;
this.msiborderkut.Angle += 90;
if (this.msiborderkut.Angle == 360)
{
this.msiborderkut.Angle = 0;
this.msiborder.Margin = new Thickness(0, 0, 0, 0);
}
if (this.msiborderkut.Angle == 90)
{
this.msiborder.Margin = new Thickness(370, -370, 370, -370);
}
if (this.msiborderkut.Angle == 180)
{
this.msiborder.Margin = new Thickness(0, 0, 0, 0);
}
if (this.msiborderkut.Angle == 270)
{
this.msiborder.Margin = new Thickness(370, -370, 370, -370);
}
_lastMousePos = new Point(0, 0);
msi.ViewportOrigin = new Point(0, 0);
msi.ViewportWidth = 1.0;
}
Hi Wilfred:
Would like to try this out! Any chance you could update the code to Silvelight's 2.0 release?
Cammer, Check out the newer posts. You will find the link to the updated source code.
Wilfred:
I have the most current version of Silverlight but am not able to view this sample in the browser. I receive a Silverlight download dialog in the upper left-hand corner. Is there a security setting I should be checking?
Thanks -
Cammer, I tried it on a computer which didn't have Silverlight installed and it worked fine. I did get the Silverlight download dialog but after I downloaded Silverlight and installed it, the page rendered fine! Are you able to access any other sites like http://silverlight.net/showcase/? You might also want to post your issue to the Silverlight.net forum in case this issue persists. There are a bunch of really nice people out there who are eager to help.
Regards
Hi All,
Is anyone able to type into the Filter textbox in full screen mode? I am not able to do so on any browser.
Wilfred, any pointers on how to fix that issue for full screen mode?
Thanks a lot for the great sample.
Post a Comment