Приложения для Windows Phone 8 Сжатие изображения / масштабирование шаблона данных с помощью canvas

1

Windows Phone 8 приложений я использую изображение в управлении поворотным элементом внутри шаблона данных, а затем с использованием изображения с пинчем/увеличением. Но моя проблема в том, что я минимизирую изображение настолько маленькое, что оно не масштабирует изображение. Как использовать холст в шаблоне данных.


МОЙ ХАМЛ

<phone:Pivot x:Name="pivot" ItemsSource="{Binding}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" >
    <phone:Pivot.HeaderTemplate>
        <DataTemplate>
            <TextBlock  Name="title" FontWeight="ExtraBold" Text="{Binding _textview}"  HorizontalAlignment="Center" FontSize="30" Foreground="Orange"></TextBlock>
        </DataTemplate>
    </phone:Pivot.HeaderTemplate>
    <phone:Pivot.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Image  Margin="0,-30,0,80"  Name="img" Stretch="Fill"  Source="{Binding _images}"  RenderTransformOrigin="0.5, 0.5" CacheMode="BitmapCache">
                    <Image.RenderTransform>
                        <CompositeTransform x:Name="transform" />
                    </Image.RenderTransform>
                    <toolkit:GestureService.GestureListener>
                        <toolkit:GestureListener PinchStarted="OnPinchStarted" PinchDelta="OnPinchDelta" DoubleTap="GestureListener_DoubleTap" DragDelta="GestureListener_DragDelta"  />
                    </toolkit:GestureService.GestureListener>
                </Image>
            </Grid>
        </DataTemplate>
    </phone:Pivot.ItemTemplate>
</phone:Pivot>

MY CS

private void OnPinchStarted(object sender, PinchStartedGestureEventArgs e)
{
    var image = sender as Image;
    var transform = image.RenderTransform as CompositeTransform;
    angle = transform.Rotation;
    scale = transform.ScaleX;
}

private void OnPinchDelta(object sender, PinchGestureEventArgs e)
{
    var image = sender as Image;
    var transform = image.RenderTransform as CompositeTransform;
    transform.Rotation = angle + e.TotalAngleDelta;
    transform.ScaleX = scale * e.DistanceRatio;
    transform.ScaleY = scale * e.DistanceRatio;
}

private void GestureListener_DoubleTap(object sender, GestureEventArgs e)
{
    var image = sender as Image;
    var transform = image.RenderTransform as CompositeTransform;
    transform.ScaleX = transform.ScaleY = 1;
}

private void GestureListener_DragDelta(object sender, DragDeltaGestureEventArgs e)
{
    var image = sender as Image;
    var transform = image.RenderTransform as CompositeTransform;
    transform.TranslateX += e.HorizontalChange;
    transform.TranslateY += e.VerticalChange;
}
Теги:
xaml
image
pinchzoom
windows-phone-8

2 ответа

0

Вы можете предотвратить защемление изображения слишком малым, ограничив масштаб до минимального размера.

// Don't shrink the image to less than 1/4 normal size.
const double minScaleX = 0.25;
const double minScaleY = 0.25;

private void OnPinchDelta(object sender, PinchGestureEventArgs e)
{
    var image = sender as Image;
    var transform = image.RenderTransform as CompositeTransform;
    transform.Rotation = angle + e.TotalAngleDelta;
    transform.ScaleX = scale * e.DistanceRatio;
    transform.ScaleY = scale * e.DistanceRatio;

    if (transform.ScaleX < minScaleX) 
    {
        transform.ScaleX = minScaleX;
    }
    if (transform.ScaleY < minScaleY) 
    {
        transform.ScaleY = minScaleY;
    }
}
0

когда вам нужно показать изображение в холсте,

<Canvas>
    <Image  Margin="0,-30,0,80"  Name="img" Stretch="Fill"  Source="{Binding _images}"  RenderTransformOrigin="0.5, 0.5" CacheMode="BitmapCache">
        <Image.RenderTransform>
            <CompositeTransform x:Name="transform" />
        </Image.RenderTransform>
    </Image>
</Canvas>

Для получения дополнительной информации, вот большой официальный образец

Ещё вопросы

Сообщество Overcoder
Наверх
Меню