2011-01-13 17 views
19

Zrobiłem aplikację, która wyświetla Obrazy. Teraz chcę zaimplementować funkcję powiększania i pomniejszania (za pomocą dwóch koniuszek palca), jak w natywnej aplikacji do przeglądarki okien telefonicznych. Każdy pomysł, jak postępować.Jak powiększać i pomniejszać obrazy w WP7?

Dzięki z góry.

+0

dwóch dobrych opcji oferowanych dotychczas –

Odpowiedz

29

Być może najbardziej dogodnym podejściem byłoby włączenie Silverlight for Windows Phone Toolkit. Zawiera on GestureService, który pomoże uszczypnąć i obrócić gesty dotykowe. Można zastosować go do obrazu tak: -

<Image Source="someSourceUrl" RenderTransformOrigin="0.5, 0.5" CacheMode="BitmapCache"> 
    <Image.RenderTransform> 
     <CompositeTransform x:Name="transform" /> 
    </Image.RenderTransform> 
    <toolkit:GestureService.GestureListener> 
     <toolkit:GestureListener PinchStarted="OnPinchStarted" PinchDelta="OnPinchDelta" /> 
    </toolkit:GestureService.GestureListener> 
</Image> 

Następnie w kodzie opóźnieniem: -

private void OnPinchStarted(object sender, PinchStartedGestureEventArgs e) 
    { 
     initialAngle = transform.Rotation; 
     initialScale = transform.ScaleX; 
    } 

    private void OnPinchDelta(object sender, PinchGestureEventArgs e) 
    { 
     transform.Rotation = initialAngle + e.TotalAngleDelta; 
     transform.ScaleX = initialScale * e.DistanceRatio; 
     transform.ScaleY = initialScale * e.DistanceRatio; 
    } 
+0

Dzięki za odpowiedź .Ale dynamicznie ładuję obrazy w kodzie. Czy możliwe jest wykonanie powyższej procedury całkowicie w kodzie? – Vaysage

+1

@ Vaysage: Nadal można go używać z dynamicznie ładowanymi obrazami. Zwykle przy obrazach dynamicznych przypisujesz nową instancję 'BitmapImage' do właściwości' Source' istniejącej kontrolki 'Image', zamiast rozładowywać i ładować instancje elementu' Image'. W tym momencie ustawisz także Obrót na transformacji na 0, a także na ScaleX i ScaleY na 1. – AnthonyWJones

+0

Dzięki, świetnie się spisałeś. –

0

jeśli chcesz prostą przeglądarkę zdjęć obsługujący multi-touch, polecam użyć kontrolki WebBrowser do wyświetlania obrazu.

Obsługuje również funkcję powiększania wielodotykowego i płynne przewijanie. Ale musisz skopiować plik do odizolowanej pamięci z folderu projektu. Oto jak zrobiłem:

<Grid x:Name="LayoutRoot" Background="Transparent"> 
    <phone:WebBrowser 
     Name="MyWebBrowserControl" 
     HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0" /> 
</Grid> 

IsolatedStorageFile isf = IsolatedStorageFile.GetUserStoreForApplication(); 

     // if image file does not exist in isolated storage, copy it to there~! 
     if (!isf.FileExists(filename)) 
     { 
      StreamResourceInfo sr = Application.GetResourceStream(new Uri(filename, UriKind.Relative)); 
      using (BinaryReader br = new BinaryReader(sr.Stream)) 
      { 
       byte[] data = br.ReadBytes((int)sr.Stream.Length); 

       using (BinaryWriter bw = new BinaryWriter(isf.OpenFile(filename, FileMode.OpenOrCreate))) 
       { 
        bw.Write(data); 
        bw.Close(); 
       } 

       br.Close(); 
      } 
     } 

     Dispatcher.BeginInvoke(() => { MyWebBrowserControl.Navigate(new Uri(filename, UriKind.Relative)); }); 

※ Musisz ustawić Konstruowanie Akcja z pliku obrazu do Treści

+0

Nie mam żadnego dowodu, ale uważam, że kontrola WebBrowser byłaby intensywnie korzystającą z zasobów kontrolą, gdybyś używał jej tylko do oglądania obrazu. To powiedziawszy, jeśli to zrobi zadanie ... –

+0

@ Daniel Airallinger // Już zrobiłem aplikację i opublikowałem (w ten sposób). Oczywiście wiem, że są plusy i minusy. Bardzo łatwo jest wdrożyć powiększalną przeglądarkę obrazów, gdy może to wymagać dużej ilości zasobów. Decyzja należy do ciebie. –

+0

To jest prawidłowe podejście w niektórych przypadkach użycia i nie zasługuje na odrzucenie z ręki. – kevinstueber