CODEWITHSUNDEEP
c#xamluwp
bziggy
bziggy

Reputation: 463

Image display from list of images in a folder C# UWP

I am currently working on building a UWP application that stores music and want it to display an album image that the user can upload. I have figured out how to save the images into a file, but am unable to get them to display, even after trying to bind them to the image control in XAML. I'm fairly new to this, so I apologize if it's a simple fix.

Here's my code from my MainPage.xaml.cs:

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using System.Runtime.InteropServices.WindowsRuntime;

using System.Text;

using Windows.Foundation;

using Windows.Foundation.Collections;

using Windows.Media.Core;

using Windows.Storage;

using Windows.Storage.FileProperties;

using Windows.UI.Xaml;

using Windows.UI.Xaml.Controls;

using Windows.UI.Xaml.Controls.Primitives;

using Windows.UI.Xaml.Data;

using Windows.UI.Xaml.Input;

using Windows.UI.Xaml.Media;

using Windows.UI.Xaml.Media.Imaging;

using Windows.UI.Xaml.Navigation;



// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409



namespace MyMusicLibrary

{

    /// <summary>

    /// An empty page that can be used on its own or navigated to within a Frame.

    /// </summary>

    public sealed partial class MainPage : Page

    {

        public MainPage()

        {

            this.InitializeComponent();

        }
private async void ImageButton_Click(object sender, RoutedEventArgs e)

        {
            var picker = new Windows.Storage.Pickers.FileOpenPicker();
            picker.ViewMode = Windows.Storage.Pickers.PickerViewMode.Thumbnail;
            picker.SuggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.PicturesLibrary;
            picker.FileTypeFilter.Add(".jpg");
            picker.FileTypeFilter.Add(".jpeg");
            picker.FileTypeFilter.Add(".png");


            var image = await picker.PickSingleFileAsync();

            var folder = ApplicationData.Current.LocalFolder;

            var imageFolder = await folder.CreateFolderAsync("imagefolder", CreationCollisionOption.OpenIfExists);

            if (imageFolder != null && image != null)
            {
                var newImage = await image.CopyAsync(imageFolder, image.Name, NameCollisionOption.GenerateUniqueName);
            }


        }

And here is my code from MainPage.xaml:

<Grid.Background>

    <ImageBrush Stretch="Fill" ImageSource="Assets/headphones.jpg"/>

</Grid.Background>

<Button Content="Add Music" HorizontalAlignment="Center" BorderBrush="Black" Background="Gray" Foreground="White" Margin="50,50,50,50" VerticalAlignment="Top" Click="MusicButton_Click"/>
<Button Content="Add Album Cover" HorizontalAlignment="Center" BorderBrush="Black" Background="Gray" Foreground="White" Margin="50,100,50,50" VerticalAlignment="Top" Click="ImageButton_Click"/>
<Image x:Name="newImage" HorizontalAlignment="Center" Width ="300" Height="300" Margin="0,100,0,0" />

<MediaPlayerElement x:Name="mediaPlayer" AreTransportControlsEnabled="True" Margin="0,200,0,0" />

Upvotes: 2

Views: 1717

Answers (2)

Nitika Chopra
Nitika Chopra

Reputation: 1405

You can try this code, 

<Image Source="ms-appx:///Assets/logo.png" />

Make sure that Image Properties set "Build Action" to "Content" and "Copy To Output Directory" to "Copy always".

[1]: https://i.sstatic.net/EFWxV.png

Thanks!!!

Upvotes: 1

jkosmala
jkosmala

Reputation: 94

newImage.ImageSource = ...

Full tutorial: https://learn.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.image.source

Upvotes: 2

Related Questions