Изображение не преобразуется из Uri в растровое изображение в UWP - PullRequest
0 голосов
/ 26 июня 2018

Я сослался на приведенную ниже ветку для объединения нескольких изображений в одно изображение в uwp. Объединение нескольких изображений

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

https://a.tile.openstreetmap.org/0/0/0.png

  public MainPage()
        {
            this.InitializeComponent();
            MergeImages();
        }

        async void MergeImages()
        {
            byte[] Canvas = new byte[512 * 512 * 4];

                Windows.Storage.Streams.IRandomAccessStream random = await Windows.Storage.Streams.RandomAccessStreamReference.CreateFromUri(
                    new Uri("https://a.tile.openstreetmap.org/1/0/0.png",UriKind.RelativeOrAbsolute)).OpenReadAsync();
                Windows.Graphics.Imaging.BitmapDecoder decoder = await Windows.Graphics.Imaging.BitmapDecoder.CreateAsync(random);
                Windows.Graphics.Imaging.PixelDataProvider pixelData = await decoder.GetPixelDataAsync();
                byte[] tileImage = pixelData.DetachPixelData();
                Canvas = PutOnCanvas(Canvas, tileImage, 0,
                    0, 256, 256, 512);

            InMemoryRandomAccessStream memStream = new InMemoryRandomAccessStream();
            var encoder = await BitmapEncoder.CreateAsync(Windows.Graphics.Imaging.BitmapEncoder.PngEncoderId, memStream);
            encoder.SetPixelData(
                Windows.Graphics.Imaging.BitmapPixelFormat.Bgra8,
                Windows.Graphics.Imaging.BitmapAlphaMode.Straight,
               512, // pixel width
               512, // pixel height
                96, // horizontal DPI
                96, // vertical DPI
                Canvas);

            try
            {
                await encoder.FlushAsync();
                var bitmapImage = new BitmapImage();

                await bitmapImage.SetSourceAsync(memStream);
                image.Source = bitmapImage;
            }
            catch { }
            memStream.Dispose();
        }

        byte[] PutOnCanvas(byte[] Canvas, byte[] Image, uint x, uint y, uint imageheight, uint imagewidth, uint CanvasWidth)
        {
            for (uint row = y; row < y + imageheight; row++)
                for (uint col = x; col < x + imagewidth; col++)
                    for (int i = 0; i < 4; i++)
                        Canvas[(row * CanvasWidth + col) * 4 + i] = Image[((row - y) * imagewidth + (col - x)) * 4 + i];

            return Canvas;
        }

Образец

Фактический выход:

Ожидаемый результат

1 Ответ

0 голосов
/ 04 июля 2018

Я нашел ваши предыдущие две темы:

Как избежать эффекта мерцания при динамическом изменении источника изображения в uwp

Как объединить несколько изображенийкак одно изображение в UWP

Все они направлены на то, чтобы избежать эффекта мерцания.Как я комментирую во второй вашей теме, эффект мерцания вызван тем, что вы меняете источник изображений за короткое время. Если вы хотите избежать этого, вы можете использовать анимацию, чтобы изменять изображения с прогрессом.Вот пример использования DoubleAnimation Раскадровки для анимации Opacity свойства базы панелей стека изображений в вашем первом потоке sample :

MainPage.xaml: я создаю две раскадровки для созданияпанель стека изображений исчезает или отображается и дает обработчик событий disappearStoryboard a disappearStoryboard_Completed.

<Page.Resources>
    <Storyboard x:Name="disappearStoryboard" Completed="disappearStoryboard_Completed">
        <DoubleAnimation
        Storyboard.TargetName="RootStackPanel"
        Storyboard.TargetProperty="Opacity"
        From="1.0" To="0.0" Duration="0:0:1"/>
    </Storyboard>

    <Storyboard x:Name="displayStoryboard">
        <DoubleAnimation
        Storyboard.TargetName="RootStackPanel"
        Storyboard.TargetProperty="Opacity"
        From="0.0" To="1.0" Duration="0:0:1"/>
    </Storyboard>
</Page.Resources>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <StackPanel Name="RootStackPanel">
        <StackPanel Orientation="Horizontal">
            <Image x:Name="image1" Height="200" Width="200" Source="ms-appx:///Assets/custom200.png"/>
            <Image x:Name="image2" Height="200" Width="200" Source="ms-appx:///Assets/custom201.png"/>
            <Image x:Name="image3" Height="200" Width="200" Source="ms-appx:///Assets/custom202.png"/>
            <Image x:Name="image4" Height="200" Width="200" Source="ms-appx:///Assets/custom203.png"/>
        </StackPanel>
        <StackPanel Orientation="Horizontal">
            <Image x:Name="image5" Height="200" Width="200" Source="ms-appx:///Assets/custom210.png"/>
            <Image x:Name="image6" Height="200" Width="200" Source="ms-appx:///Assets/custom211.png"/>
            <Image x:Name="image7" Height="200" Width="200" Source="ms-appx:///Assets/custom212.png"/>
            <Image x:Name="image8" Height="200" Width="200" Source="ms-appx:///Assets/custom213.png"/>
        </StackPanel>
        <StackPanel Orientation="Horizontal">
            <Image x:Name="image9"  Height="200" Width="200" Source="ms-appx:///Assets/custom220.png"/>
            <Image x:Name="image10" Height="200" Width="200" Source="ms-appx:///Assets/custom221.png"/>
            <Image x:Name="image11" Height="200" Width="200" Source="ms-appx:///Assets/custom222.png"/>
            <Image x:Name="image12" Height="200" Width="200" Source="ms-appx:///Assets/custom223.png"/>
        </StackPanel>
    </StackPanel>
    <StackPanel Grid.Row="1" Orientation="Horizontal">
        <Button Height="50" Width="150" HorizontalAlignment="Center" VerticalAlignment="Center"
                Content="ReplaceCustom" x:Name="replaceCustom" Click="replaceCustom_Click" Margin="5"/>

        <Button Height="50" Width="150" HorizontalAlignment="Center" VerticalAlignment="Center"
                Content="Replace OSM" x:Name="replaceOSM" Click="replace_Click" Margin="5"/>

        <Button Height="50" Width="150" HorizontalAlignment="Center" VerticalAlignment="Center"
                Content="Replace Tile" x:Name="replaceTile" Click="replaceTile_Click" Margin="5"/>
    </StackPanel>
</Grid>

MainPage.xaml.cs: я изменяю ресурс Images в disappearStoryboard s disappearStoryboard_Completedобработчик событий.

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
    }
    bool replaceButtonClicked, replaceCustomButtonClicked, replaceTileButtonClicked;

    private void replace_Click(object sender, RoutedEventArgs e)
    {
        replaceButtonClicked = true;
        disappearStoryboard.Begin();
    }

    private void replaceCustom_Click(object sender, RoutedEventArgs e)
    {
        replaceCustomButtonClicked = true;
        disappearStoryboard.Begin();
    }

    private void replaceTile_Click(object sender, RoutedEventArgs e)
    {
        replaceTileButtonClicked = true;
        disappearStoryboard.Begin();
    }

    private void disappearStoryboard_Completed(object sender, object e)
    {
        if (replaceButtonClicked)
        {
            image1.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM200.png",
         UriKind.RelativeOrAbsolute));
            image2.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM201.png",
              UriKind.RelativeOrAbsolute));
            image3.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM202.png",
              UriKind.RelativeOrAbsolute));
            image4.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM203.png",
              UriKind.RelativeOrAbsolute));
            image5.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM210.png",
              UriKind.RelativeOrAbsolute));
            image6.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM211.png",
              UriKind.RelativeOrAbsolute));
            image7.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM212.png",
              UriKind.RelativeOrAbsolute));
            image8.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM213.png",
              UriKind.RelativeOrAbsolute));
            image9.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM220.png",
              UriKind.RelativeOrAbsolute));
            image10.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM221.png",
              UriKind.RelativeOrAbsolute));
            image11.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM222.png",
              UriKind.RelativeOrAbsolute));
            image12.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM223.png",
              UriKind.RelativeOrAbsolute));
            replaceButtonClicked = false;
        }
        if (replaceCustomButtonClicked)
        {
            image1.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom200.png",
         UriKind.RelativeOrAbsolute));
            image2.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom201.png",
              UriKind.RelativeOrAbsolute));
            image3.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom202.png",
              UriKind.RelativeOrAbsolute));
            image4.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom203.png",
              UriKind.RelativeOrAbsolute));
            image5.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom210.png",
              UriKind.RelativeOrAbsolute));
            image6.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom211.png",
              UriKind.RelativeOrAbsolute));
            image7.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom212.png",
              UriKind.RelativeOrAbsolute));
            image8.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom213.png",
              UriKind.RelativeOrAbsolute));
            image9.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom220.png",
              UriKind.RelativeOrAbsolute));
            image10.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom221.png",
              UriKind.RelativeOrAbsolute));
            image11.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom222.png",
              UriKind.RelativeOrAbsolute));
            image12.Source = new BitmapImage(new Uri("ms-appx:///Assets/custom223.png",
              UriKind.RelativeOrAbsolute));
            replaceCustomButtonClicked = false;
        }
        if (replaceTileButtonClicked)
        {
            image1.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM300.png",
         UriKind.RelativeOrAbsolute));
            image2.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM301.png",
              UriKind.RelativeOrAbsolute));
            image3.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM302.png",
              UriKind.RelativeOrAbsolute));
            image4.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM303.png",
              UriKind.RelativeOrAbsolute));
            image5.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM304.png",
              UriKind.RelativeOrAbsolute));
            image6.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM305.png",
              UriKind.RelativeOrAbsolute));
            image7.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM306.png",
              UriKind.RelativeOrAbsolute));
            image8.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM301.png",
              UriKind.RelativeOrAbsolute));
            image9.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM302.png",
              UriKind.RelativeOrAbsolute));
            image10.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM303.png",
              UriKind.RelativeOrAbsolute));
            image11.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM310.png",
              UriKind.RelativeOrAbsolute));
            image12.Source = new BitmapImage(new Uri("ms-appx:///Assets/OSM311.png",
              UriKind.RelativeOrAbsolute));
            replaceTileButtonClicked = false;
        }
        displayStoryboard.Begin();
    }

}
...