locked
Image Viewer View Problem ? RRS feed

  • Question

  • Hello World

    I have a Canvas Control in my page and as a Background of that Canvas control i have placed a ImageBrush.  Canvas Control is a child of ScrollViewer Control. I want to add some functionnallity in my Page

    Fit To Height

    Fit To Window

    <ScrollViewer VerticalScrollBarVisibility="{Binding Path=VerticalScrollBarVisibility}" Cursor="{Binding Path=ControlCursor}" Style="{Binding ScrollViewerStyleEXEGO}" UseLayoutRounding="True"  HorizontalScrollBarVisibility="{Binding Path=HorizontalScrollBarVisibility}" x:Name="Scroller">
                        <ScrollViewer.Resources>
                            <!--don't use that ViewModel:ElementSize for your code. this class specially design for this ImageViewer-->
                            <!--Height="{Binding Converter={StaticResource SizeConverterKey}, Path=ImageHeight}" Width="{Binding Converter={StaticResource SizeConverterKey}, Path=ImageWidth}"  -->
                            <ViewModel:ElementSize Element="{Binding ElementName=Scroller}" x:Name="ScrollerSize"></ViewModel:ElementSize>
                            <!--<Conv:ActualSizePropertyProxy Element="{Binding ElementName=Scroller}" x:Name="ScrollerSize"></Conv:ActualSizePropertyProxy>-->
                        </ScrollViewer.Resources>
                        <!--<Canvas Height="{Binding ElementName=ScrollerSize,Path=ActaulHeightValue,Converter={StaticResource SizeConverterKey}}" Width="{Binding ElementName=ScrollerSize,Path=ActaulWidthValue,Converter={StaticResource SizeConverterKey}}" RenderTransformOrigin="0.5,0.5">
                            <Canvas.RenderTransform>
                                <ScaleTransform x:Name="ScaleFactor" ScaleX="1" ScaleY="1"/>
                            </Canvas.RenderTransform>-->
                        <!--<Image x:Name="ImageTiff" Source="{Binding Path=Image}" RenderTransformOrigin="0.5,0.5" Margin="2" Stretch="{Binding Path=ImageStretch}">
                                    <Intr:Interaction.Triggers>
                                        <Intr:EventTrigger EventName="ImageOpened">
                                            <Custom:EventToCommand Command="{Binding ImageOpenedCommand,Mode=OneWay}" PassEventArgsToCommand="True"></Custom:EventToCommand>
                                        </Intr:EventTrigger>
                                    </Intr:Interaction.Triggers>
                                    <Image.RenderTransform>
                                        <TransformGroup>
                                            <CompositeTransform Rotation="{Binding Path=RotationValue}"></CompositeTransform>
                                            <ScaleTransform x:Name="ScaleFactor" ScaleX="{Binding ElementName=ZoomSlider,Path=Value}" ScaleY="{Binding ElementName=ZoomSlider,Path=Value}"/>
                                        </TransformGroup>
                                    </Image.RenderTransform>
                                </Image>-->
                        <Viewbox RenderTransformOrigin="0.5,0.5">
                            <Canvas Margin="2" RenderTransformOrigin="0.5,0.5" Height="{Binding Path=ImageHeight}" Width="{Binding Path=ImageWidth}">
                                <Canvas.Background>
                                    <ImageBrush ImageSource="{Binding Path=Image}" Stretch="{Binding Path=ImageStretch}" >
                                        <Intr:Interaction.Triggers>
                                            <Intr:EventTrigger EventName="ImageOpened">
                                                <Custom:EventToCommand Command="{Binding ImageOpenedCommand,Mode=OneWay}" PassEventArgsToCommand="True"></Custom:EventToCommand>
                                            </Intr:EventTrigger>
                                        </Intr:Interaction.Triggers>
                                    </ImageBrush>
                                </Canvas.Background>
                                <Canvas.RenderTransform>
                                    <TransformGroup>
                                        <CompositeTransform Rotation="{Binding Path=RotationValue}"></CompositeTransform>
                                        <ScaleTransform x:Name="ScaleFactor" ScaleX="{Binding ElementName=ZoomSlider,Path=Value}" ScaleY="{Binding ElementName=ZoomSlider,Path=Value}"/>
                                    </TransformGroup>
                                </Canvas.RenderTransform>
                                <Intr:Interaction.Behaviors>
                                    <Beha:ControlReference ControlType="Canvas" AttachedProperty="CanvasControl" SetControlToProperty="True"  ViewModelAddress="ImageViewerViewModel"></Beha:ControlReference>
                                </Intr:Interaction.Behaviors>
                                <Intr:Interaction.Triggers>
                                    <Intr:EventTrigger EventName="MouseMove">
                                        <Custom:EventToCommand Command="{Binding Path=ImageViewerViewModel.MouseMoveCommand, Source={StaticResource Locator}}" PassEventArgsToCommand="True"></Custom:EventToCommand>
                                    </Intr:EventTrigger>
                                    <Intr:EventTrigger EventName="MouseLeftButtonDown">
                                        <Custom:EventToCommand Command="{Binding Path=ImageViewerViewModel.MouseLeftButtonDownCommand, Source={StaticResource Locator}}" PassEventArgsToCommand="True"></Custom:EventToCommand>
                                    </Intr:EventTrigger>
                                    <Intr:EventTrigger EventName="MouseLeftButtonUp">
                                        <Custom:EventToCommand Command="{Binding Path=ImageViewerViewModel.MouseLeftButtonUpCommand, Source={StaticResource Locator}}" PassEventArgsToCommand="True"></Custom:EventToCommand>
                                    </Intr:EventTrigger>
                                </Intr:Interaction.Triggers>
                            </Canvas>
                        </Viewbox>
                        <!--</Canvas>-->
                    </ScrollViewer>
    Thursday, May 24, 2012 1:21 AM