Image.Source = new BitmapImage(); doesn't work in UWP - c#

I have a problem while reading a file in C#. Here's the code:
protected override void OnNavigatedTo(NavigationEventArgs EvArgs)
{
base.OnNavigatedTo(EvArgs);
var Args = EvArgs.Parameter as Windows.ApplicationModel.Activation.IActivatedEventArgs;
var FArgs = Args as Windows.ApplicationModel.Activation.FileActivatedEventArgs;
if (Args != null)
{
if (Args.Kind == Windows.ApplicationModel.Activation.ActivationKind.File)
{
var IMG = new Image();
IMG.Loaded += IMG_Loaded;
string FP = FArgs.Files[0].Path;
Uri = FP;
IMG.Source = new BitmapImage(new Uri(FP, UriKind.RelativeOrAbsolute));
FV.Items.Add(IMG);
PathBlock.Text = FArgs.Files[0].Name + " - Image Viewer";
void IMG_Loaded(object sender, RoutedEventArgs e)
{
IMG.Source = new BitmapImage(new Uri(Uri));
}
}
}
if (Args == null)
{
PathBlock.Text = "Image Viewer";
}
}
The problem is at this part:
IMG.Source = new BitmapImage(new Uri(FP, UriKind.RelativeOrAbsolute));
The image won't load, even after trying a resource that the app CAN access in its own files:
IMG.Source = new BitmapImage(new Uri("ms-appx:///09.png, UriKind.RelativeOrAbsolute));
It still won't work.
This only works with this code:
var FOP = new Windows.Storage.Pickers.FileOpenPicker();
StorageFile F = await FOP.PickSingleFileAsync();
IRandomAccessStream FS = await F.OpenAsync(FileAccessMode.Read);
var BI = new BitmapImage();
var IMG = new Image();
await BI.SetSourceAsync(FS);
IMG.Source = BI;
Sadly, I can't use a file stream OR a file picker in the first code example, so I can't make it work as I did here.

Image.Source = new BitmapImage(); doesn't work in UWP
The problem is file Path property does not use to set image source directly in UWP platform.
Derive from your code, it looks you open the image file with current app, if you can get the IStorageItem from FArgs.Files list, you could also convert it as StorageFile, and then pass the opened file stream to BitmapImage.
For more detail steps please refer to the following code.
protected async override void OnNavigatedTo(NavigationEventArgs EvArgs)
{
base.OnNavigatedTo(EvArgs);
var Args = EvArgs.Parameter as Windows.ApplicationModel.Activation.IActivatedEventArgs;
var FArgs = Args as Windows.ApplicationModel.Activation.FileActivatedEventArgs;
if (Args != null)
{
if (Args.Kind == Windows.ApplicationModel.Activation.ActivationKind.File)
{
var IMG = new Image();
string FP = FArgs.Files[0].Path;
var Uri = FP;
StorageFile imageFile = FArgs.Files[0] as StorageFile;
using (var stream = await imageFile.OpenReadAsync())
{
var bitmp = new BitmapImage();
bitmp.SetSource(stream);
IMG.Loaded += (s, e) => { IMG.Source = bitmp; };
}
RootLayout.Children.Add(IMG);
}
}
if (Args == null)
{
}
}

Related

image doesn't change - WPF

I'm trying to change an image on runtime but it's not working.
I have a user control that when you click on imagebtn it's opening a new window with a list of images.
the next step is to take the image selected from the list, close the new window, and put the image on the imagebtn.
the user control still opens in the background.
this is my code.
NewWindow:
private string myData;
public ImagesWindow()
{
InitializeComponent();
InitialImageList();
}
private async void InitialImageList()
{
//add try catch
string get = await HttpRequests.GetRequest(URLImages);
allJsonCategory = JsonConvert.DeserializeObject<List<ImageArray>>(get);
Console.WriteLine(get);
ImageBoxList.ItemsSource = images;
foreach (var item in allJsonCategory)
{
images.Add(item);
}
}
private void ImageBoxList_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
selectedImage = (ImageArray)ImageBoxList.SelectedItem;
myData = selectedImage.full_path;
Console.WriteLine("you clicked on: " + selectedImage.name);
ProductsCategory pro = new ProductsCategory();
pro.imagePath = myData;
this.Close();
}
my usercontrol(in mainWindow):
public void setImage(string imagePath)
{
if (!imageURL.Equals(""))
{
Image imageBtn = new Image();
var imgUrl = new Uri(imagePath);
var imageData = new WebClient().DownloadData(imgUrl);
// or you can download it Async won't block your UI
// var imageData = await new WebClient().DownloadDataTaskAsync(imgUrl);
var bitmapImage = new BitmapImage { CacheOption = BitmapCacheOption.OnLoad };
bitmapImage.BeginInit();
bitmapImage.StreamSource = new MemoryStream(imageData);
bitmapImage.EndInit();
imageBtn.Source = bitmapImage;
//this.imageBtn.InvalidateVisual();
}
}
XAML of the image:
where is my mistake?
thank you all :)

how to clear memory of WritableBitmap

I am picking image from gallery using PhotoChooserTask, here is my setup
private void ApplicationBarIconButton_Click(object sender, EventArgs e)
{
PhotoChooserTask photo = new PhotoChooserTask();
photo.Completed += photo_Completed;
photo.Show();
}
void photo_Completed(object sender, PhotoResult e)
{
if (e.ChosenPhoto != null)
{
WriteableBitmap wbmp1 = PictureDecoder.DecodeJpeg(e.ChoosenPhoto, (int)scrnWidth, (int)scrnHeight);
ImageBrush iBru = new ImageBrush();
iBru.ImageSource = wbmp1;
iBru.Stretch = Stretch.Fill;
ContentPanel.Background = iBru;
}
}
Problem: with this way is it works only with .JPEG images
to make it work with other image formats, I tried this:
void photo_Completed(object sender, PhotoResult e)
{
if (e.ChosenPhoto != null)
{
WriteableBitmap wBmp = new WriteableBitmap(0, 0);//6930432
wBmp.SetSource(e.ChosenPhoto);//23105536
MemoryStream tmpStream = new MemoryStream();//23105536
wBmp.SaveJpeg(tmpStream, (int)scrnWidth, (int)scrnHeight, 0, 100);//22831104
tmpStream.Seek(0, SeekOrigin.Begin);//22831104
WriteableBitmap wbmp1 = PictureDecoder.DecodeJpeg(tmpStream, (int)scrnWidth, (int)scrnHeight);//24449024
ImageBrush iBru = new ImageBrush();//24449024
iBru.ImageSource = wbmp1;//24449024
iBru.Stretch = Stretch.Fill;
ContentPanel.Background = iBru;
}
}
this way works with different image formats, but it is not memory efficient.
I have mentioned number of bytes used after each line for better understanding.
Question: In latter code snippet, I do not need wbmp anymore, How can I clear memory used by wbmp object?
As #Soonts suggested I used BitmapImage and it solves my purpose,
BitmapImage bmp = new BitmapImage();
bmp.DecodePixelWidth = (int)scrnWidth;
bmp.DecodePixelHeight = (int)scrnHeight;
bmp.SetSource(e.ChosenPhoto);
It consumes less memory and we can scale down image
Get rid of the WriteableBitmap, instead do something like this:
var bmp = new System.Windows.Media.Imaging.BitmapImage();
bmp.SetSource( e.ChosenPhoto );
var ib = new ImageBrush() { ImageSource = bmp, Stretch = Stretch.Fill };
ContentPanel.Background = ib;

How do I get an image to save after rotation at runtime?

I am working with WPF and I have an application that the user loads an image file into a RichTextBox and they can rotate the image and print it. I am not sure as to why the image after it has been rotated will not print as it is displayed on the screen. Instead it prints the original. I am new to this so any help would be greatly appreciated!
The following is the code for my application. Code when the retrieve file Button is clicked:
private void retrieve_button_Click(object sender, RoutedEventArgs e)
{
//Retrieve the file or image you are looking for
OpenFileDialog of = new OpenFileDialog();
of.Filter = "Formats|*.jpg;*.png;*.bmp;*.gif;*.ico;*.txt|JPG Image|*.jpg|BMP image|*.bmp|PNG image|*.png|GIF Image|*.gif|Icon|*.ico|Text File|*.txt";
var dialogResult = of.ShowDialog();
if (dialogResult == System.Windows.Forms.DialogResult.OK)
{
try
{
System.Windows.Controls.RichTextBox myRTB = new System.Windows.Controls.RichTextBox();
{
Run myRun = new Run();
System.Windows.Controls.Image MyImage = new System.Windows.Controls.Image();
MyImage.Source = new BitmapImage(new Uri(of.FileName, UriKind.RelativeOrAbsolute));
InlineUIContainer MyUI = new InlineUIContainer();
MyUI.Child = MyImage;
rotateright_button.IsEnabled = true;
print_button.IsEnabled = true;
Paragraph paragraph = new Paragraph();
paragraph.Inlines.Add(myRun);
paragraph.Inlines.Add(MyUI);
FlowDocument document = new FlowDocument(paragraph);
richTextBox.Document = document;
}
}
catch (ArgumentException)
{
System.Windows.Forms.MessageBox.Show("Invalid File");
}
}
}
When the rotate right button is clicked the following code is executed:
RotateTransform cwRotateTransform;
private void rotateright_button_Click(object sender, RoutedEventArgs e)
{
richTextBox.LayoutTransform = cwRotateTransform;
if (cwRotateTransform == null)
{
cwRotateTransform = new RotateTransform();
}
if (cwRotateTransform.Angle == 360)
{
cwRotateTransform.Angle = 0;
}
else
{
cwRotateTransform.Angle += 90;
}
}
After the Image has been loaded and rotated the user can use the following code to print:
private void InvokePrint(object sender, RoutedEventArgs e)
{
System.Windows.Controls.PrintDialog printDialog = new System.Windows.Controls.PrintDialog();
if ((bool)printDialog.ShowDialog().GetValueOrDefault())
{
FlowDocument flowDocument = new FlowDocument();
flowDocument = richTextBox.Document;
flowDocument.ColumnWidth = printDialog.PrintableAreaWidth;
flowDocument.PagePadding = new Thickness(65);
IDocumentPaginatorSource iDocPag = flowDocument;
printDialog.PrintDocument(iDocPag.DocumentPaginator, "Print Document");
}
}
Try this (substitute yourImageControl in the first line, specify which RotateFlipType you want and be sure to reference the System.Drawing dll):
System.Drawing.Bitmap bitmap = BitmapSourceToBitmap((BitmapSource)YourImageControl.Source);
bitmap.RotateFlip(System.Drawing.RotateFlipType.Rotate90FlipNone);
public static System.Drawing.Bitmap BitmapSourceToBitmap(BitmapSource bitmapsource)
{
System.Drawing.Bitmap bitmap;
using (MemoryStream outStream = new MemoryStream())
{
BitmapEncoder enc = new BmpBitmapEncoder();
enc.Frames.Add(BitmapFrame.Create(bitmapsource));
enc.Save(outStream);
bitmap = new System.Drawing.Bitmap(outStream);
}
return bitmap;
}
Another option for conversion...
P.S. You would get a better answer in less time if you posted some code and told us more about what you have tried.

Setting image in the view after downloading from web with JSON.Net

Let's say I have 3 image views in my xaml . I am downloading images from a server & now I want to set those images in my image views . How can I do that ? Please Help !
My Code :
void webClient_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
{
//parse data
var container = DeserializeFromJson<DataJsonAttributeContainer>(e.Result);
//load into list
for (int i = 0; i < container.MyBookList.Count; i++)
{
newData[i] = new data();
newData[i].id = container.MyBookList[i].ID;
newData[i].title = container.MyBookList[i].TITLE;
newData[i].type = container.MyBookList[i].TYPE;
newData[i].price = container.MyBookList[i].PRICE;
newData[i].downloadLink = container.MyBookList[i].DOWNLOADLINK;
string file_name = newData[i].downloadLink.ToString();
string image_uri = "http://www.banglanews24.com/images/imgAll/" + file_name;
WebClient wc = new WebClient();
wc.OpenReadCompleted += new OpenReadCompletedEventHandler(wc_OpenReadCompleted);
wc.OpenReadAsync(new Uri(image_uri), wc);
}
void wc_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e)
{
if (e.Error == null && !e.Cancelled)
{
try
{ //I can set just one image here....what should I do ?
BitmapImage image = new BitmapImage();
image.SetSource(e.Result);
image1.Source = image;
}
catch (Exception ex)
{
//Exception handle appropriately for your app
}
}
else
{
//Either cancelled or error handle appropriately for your app
}
}
This should do it:
void webClient_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
{
//parse data
var container = DeserializeFromJson<DataJsonAttributeContainer>(e.Result);
//load into list
for (int i = 0; i < container.MyBookList.Count; i++)
{
newData[i] = new data();
newData[i].id = container.MyBookList[i].ID;
newData[i].title = container.MyBookList[i].TITLE;
newData[i].type = container.MyBookList[i].TYPE;
newData[i].price = container.MyBookList[i].PRICE;
newData[i].downloadLink = container.MyBookList[i].DOWNLOADLINK;
string file_name = newData[i].downloadLink.ToString();
string image_uri = "http://www.banglanews24.com/images/imgAll/" + file_name;
Uri uri = new Uri(image_uri, UriKind.Relative);
ImageSource imgSource = new BitmapImage(uri);
if (i==0) image1.source = imgSource;
else if (i==1) image2.source = imgSource;
else if (i==2) image3.source = imgSource;
etc
}
You will find that your images will automatically be downloaded when you give it a Image URI.

How to load image from isolated storage for secondary tile

I am attempting to populate a secondary tile background with an image saved from the PhotoChooserTask, but for some reason I cannot accomplish this. I have referenced a lot of sites but I have not found the proper implementation. All I do is call PhotoChooserTask, and then on the completed event I save the resulting image to isolated storage to be loaded later. This has worked with a HubTile in my application, but for some reason I cannot append the image to a secondary tile. So far what I have is as follows:
MainPage.xaml.cs
string imageFolder = #"\Shared\ShellContent";
string shareJPEG = "shareImage.jpg";
public MainPage()
{
InitializeComponent();
photoChooserTask = new PhotoChooserTask();
photoChooserTask.Completed += new EventHandler<PhotoResult>(photoChooserTask_Completed);
}
public void changePictureMenuItem_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
try
{
photoChooserTask.Show();
}
catch (System.InvalidOperationException)
{
MessageBox.Show("An error occurred");
}
}
void photoChooserTask_Completed(object sender, PhotoResult e)
{
if (e.TaskResult == TaskResult.OK)
{
//persist the data in isolated storage
using (IsolatedStorageFile myIsolatedStorage = IsolatedStorageFile.GetUserStoreForApplication())
{
if(!myIsolatedStorage.DirectoryExists(imageFolder))
{
myIsolatedStorage.CreateDirectory(imageFolder);
}
if (myIsolatedStorage.FileExists(shareJPEG))
{
myIsolatedStorage.DeleteFile(shareJPEG);
}
string filePath = System.IO.Path.Combine(imageFolder, shareJPEG);
IsolatedStorageFileStream fileStream = myIsolatedStorage.CreateFile(filePath);
BitmapImage bitmap = new BitmapImage();
bitmap.SetSource(e.ChosenPhoto);
WriteableBitmap wb = new WriteableBitmap(bitmap);
// Encode WriteableBitmap object to a JPEG stream.
Extensions.SaveJpeg(wb, fileStream, 173, 173, 0, 100);
fileStream.Close();
}
}
}
private void CreateLiveTile(TileItem item)
{
//IsolatedStorageFile myIsolatedStorage = IsolatedStorageFile.GetUserStoreForApplication();
var title = item.Title.ToString();
string tileParameter = "Param=" + item.Title.ToString();
ShellTile Tile = CheckIfTileExist(tileParameter); // Check if Tile's title has been used
if (Tile == null)
{
//this is not working?
background = new Uri(#"isostore:/Shared/ShellContent/shareJPEG.png", UriKind.Absolute);
//background = new Uri("isostore:/Shared/ShellContent/shareJPEG.png", UriKind.Absolute);
try
{
var LiveTile = new StandardTileData
{
Title = item.TileName,
BackgroundImage = background, //not working
BackTitle = item.TileName,
BackBackgroundImage = new Uri("/background.png", UriKind.Relative),
BackContent = item.Message,
};
ShellTile.Create(new Uri("/MainPage.xaml?" + tileParameter, UriKind.Relative), LiveTile);
}
}
Ultimately, the secondary tile is created but there is no image for the BackgroundImage. How would I properly call the isolated strorage path to set the BackgroundImage of the secondary tile accordingly? Or is there something else I should be doing or change?
MainPage.xaml.cs
string imageFolder = #"\Shared\ShellContent";
string shareJPEG = "shareImage.jpg";
...
private void CreateLiveTile(TileItem item)
{
var title = item.Title.ToString();
string tileParameter = "Param=" + item.Title.ToString();
ShellTile Tile = CheckIfTileExist(tileParameter); // Check if Tile's title has been used
if (Tile == null)
{
string filePath = System.IO.Path.Combine(imageFolder, shareJPEG);
background = new Uri(#"isostore" + filePath, UriKind.Absolute); //this worked
...
}
}
Are you sure the image is saved successfully and exists? You save it as jpeg but you reference a png file. Try #"\Shared\ShellContent\shareJPEG.png"
first you should put your image at "\Shared\ShellContent" location. you can use .png or .jpg file
string imageFolder = #"\Shared\ShellContent";
string shareJPEG = "shareImage.jpg";
...
private void CreateLiveTile(TileItem item)
{
var title = item.Title.ToString();
string tileParameter = "Param=" + item.Title.ToString();
ShellTile Tile = CheckIfTileExist(tileParameter);
if (Tile == null)
{
string filePath = System.IO.Path.Combine(imageFolder, shareJPEG);
using (var iso = IsolatedStorageFile.GetUserStoreForApplication())
{
if (iso.FileExists(filePath)) // check file exist or not
background = new Uri(#"isostore:" + filePath, UriKind.Absolute);
}
...
}
}

Categories