Как сделать, чтобы ограничить область перетаскивания изображения в приложении?

Question

Теперь я разрабатываю приложение для фотографий (Windows Phone 8.1 runtime), но проблема в том, что не ограничивать область перетаскивания изображения во время масштабирования фотографий.

Здесь ниже код:

<Canvas Name="zoomgrid" Visibility="Collapsed"> 
    <Image x:Name="zoomimages" 
      Stretch="Fill" 
      Width="480" 
      Height="800" 
      ManipulationDelta="img_intro_ManipulationDelta" 
      RenderTransformOrigin="0.5,0.5" 
      ManipulationMode="All"> 
     <Image.RenderTransform> 
      <CompositeTransform/> 
     </Image.RenderTransform>     
    </Image> 
</Canvas> 

double mincale = 0.5; 
double maxscale = 10.0; 

private void Image_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e) 
{   
    Image elemt = sender as Image; 
    CompositeTransform transform = elemt.RenderTransform as CompositeTransform; 

    transform.ScaleX *= e.Delta.Scale; 
    transform.ScaleY *= e.Delta.Scale; 

    transform.TranslateX += e.Delta.Translation.X; 
    transform.TranslateY += e.Delta.Translation.Y; 

    if (transform.ScaleX < mincale) transform.ScaleX = mincale; 
    if (transform.ScaleY < mincale) transform.ScaleY = mincale; 
    if (transform.ScaleX > maxscale) transform.ScaleX = maxscale; 
    if (transform.ScaleY > maxscale) transform.ScaleY = maxscale; 

    //To limit the images dragging but did not success. 
    double scalewidth = Zoomimages.ActualWidth * ct.ScaleX; 
    double scleheight = Zoomimages.ActualHeight * ct.ScaleY; 

    double xdiff = Math.Max(0, (scalewidth - this.content.ActualWidth)/2); 
    double ydiff = Math.Max(0, (scleheight - this.content.ActualHeight)/2); 

    if (Math.Abs(ct.TranslateX) > xdiff) 
     ct.TranslateX = xdiff * Math.Sign(e.Delta.Translation.X); 
    if (Math.Abs(ct.TranslateY) > ydiff) 
     ct.TranslateY = ydiff * Math.Sign(e.Delta.Translation.Y);    
} 

Answer 1

Я достигнута это с помощью вспомогательного метода, чтобы проверить, является ли изображение в настоящее время в рамках другого элемента.

В вашем случае элемент, который вы хотите проверить, - это изображение, и вы хотите проверить его в пределах холста.

private bool IsElementVisible(FrameworkElement element, FrameworkElement container) 
    { 
     if (!element.IsVisible) 
      return false; 

     Rect bounds = element.TransformToAncestor(container).TransformBounds(new Rect(0.0, 0.0, element.ActualWidth, element.ActualHeight)); 
     Rect rect = new Rect(0.0, 0.0, container.ActualWidth, container.ActualHeight); 

     if (rect.Left > bounds.Right || rect.Right < bounds.Left || rect.Bottom < bounds.Top || rect.Top > bounds.Bottom) 
     { 
      return false; 
     } 

     return true; 
    } 

В моем случае, я использовал MatrixTransform вместо CompositeTransform, но метод должен быть одинаковым.

Я обычно создаю обработчик для 'ManipulationStarting' и 'ManipulationCompleted', где:

ManipulationStarting:

1. Хранит тока (до манипуляция) копия Transform.

ManipulationCompleted:

1. Проверьте, чтобы увидеть, если изображение выходит за пределы (с помощью метода я отправил).
2. Если вы находитесь за пределами, вернитесь к исходному Преобразованию.

Таким образом, даже если ваше изображение вытащено из поля зрения - как только пользователь поднимет свой палец, изображение вернется в последнее хорошее место.

Если вам интересен более широкий контекст, в котором я использовал этот код, у меня есть поведение WPF, которое инкапсулирует всю эту функциональность. code находится на Codeplex. Это class может заинтересовать вас.

Надеюсь, это поможет :)