none
如何将加载到InkCanvas中的图片 在拖动后显示到最前面 RRS feed

  • 问题

  • 已经实现了将图片加载到InkCanvas中,然后能缩放 拖动  但都显示在InkCanvas后面, 如何在选中图片后 该图片能显示在最前面呢.高手指点

    2014年7月17日 10:32

答案

  • 你好,

    我们可以为InkCanvas中的控件指定ZIndex附加属性去调整展示顺序,使用的是Panel.SetZIndex() 方法:

    例如我在InkCanvas里面放了四个Image控件,均指定Panel.ZIndex为0,并且为MouseDown事件指定事件处理函数Image_MouseDown:

    <InkCanvas Name="inkCanvas" EditingMode="None">
                <InkCanvas.Resources>
                    <Style TargetType="Image">
                        <EventSetter Event="MouseDown" Handler="Image_MouseDown"/>
                    </Style>
                </InkCanvas.Resources>
                <Image Source="Images/1.ico" Panel.ZIndex="0" Height="150" Width="150" Margin="307,47,-307,-47" />
                <Image Source="Images/2.ico" Panel.ZIndex="0" Height="150" Width="150" Margin="234,118,-234,-118" />
                <Image Source="Images/3.ico" Panel.ZIndex="0" Height="130" Width="130" Margin="164,167,-164,-167" />
                <Image Source="Images/4.ico" Panel.ZIndex="0" Height="200" Width="200" Margin="36,29,-36,-29" />
            </InkCanvas>

    在Image_MouseDown函数中,我们先遍历所有Image控件,把最大的ZIndex值找到,然后为当前点击的图片设置最大的值,这样就会展示在最前面:

    private void Image_MouseDown(object sender, MouseButtonEventArgs e)
    {
                int maxIndex = 0;
                
                FrameworkElement element = e.OriginalSource as FrameworkElement;
    
                //Find the maximum index
                for (int i = 0; i < inkCanvas.Children.Count; i++)
                {
                    Image img = inkCanvas.Children[i] as Image;
                    maxIndex = Panel.GetZIndex(img) > maxIndex ? Panel.GetZIndex(img) : maxIndex;
                }
                // Adjust Z-order
                for (int i = 0; i < inkCanvas.Children.Count; i++)
                {
                    Image img = inkCanvas.Children[i] as Image;
                    Panel.SetZIndex(inkCanvas.Children[i], img == element ? maxIndex+1 : Panel.GetZIndex(img));
                }
    }

    效果见动图:


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    2014年7月19日 3:35
    版主