How to convert BitmapImage to WriteableBitmap in Universal application for windows 10? - converters

I am implementing a Universal Windows Application on Windows 10 using MVVM.
I have a file picker allowing me to choose an image. This image is displayed in an Image Control. The source of the Image Control is bound to a property in my view model. This property is a byte array. I need a converter to convert the BitmapImage in a Byte Array.
I have read lots of things but can't found something working.
I have found interesting stuff on https://writeablebitmapex.codeplex.com/
but if i want to use this package i need a WriteableBitmap and not a BitmapImage.
Thank you in advance for your help.

You can load the image to a WriteableBitmap object straight from the file.
var filePicker = new FileOpenPicker();
filePicker.FileTypeFilter.Add(".jpg");
var result = await filePicker.PickSingleFileAsync();
if (result != null)
{
using (IRandomAccessStream stream = await result.OpenAsync(FileAccessMode.Read))
{
BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream);
WriteableBitmap bmp = new WriteableBitmap((int)decoder.PixelWidth, (int)decoder.PixelHeight);
bmp.SetSource(stream);
// show the image in the UI if you want.
MyImage.Source = bmp;
}
}
This way you have the WriteableBitmap and you can use the WriteableBitmapEx library.

Related

Unity changing from game object to ui Image

In unity I am fetching a UI image through GameObject.Find() However when I try to change the value of another image component to the result of the game object find I get the error:
Cannot implicitly convert type 'UnityEngine.GameObject' to 'UnityEngine.UI.Image' \[Assembly-CSharp\]csharp(CS0029)
Code:
Image image;
image = GameObject.Find("the other image");
Is there a way to fetch a UI Image game object through just it's name without it being set to a generic game object?
You are attempting to assign the value of a image to a gameObject, you simply need to get the image
Image image;
var imageGameObject = GameObject.Find("the other image");
if(imageGameObject == null)
{
//couldn't find the gameobject
}
image = imageGameObject.GetComponenet<Image>();
to get the actual image component

iOS Native to Forms navigation

I have been working on an application that uses both forms and native in Xamarin. The app starts with the form and switch to native to open the camera. My problem is once the image is clicked I want to go back to Forms application but I am unable to find enough documentation on it.
I have tried Navigation.PushAsync in iOS but it doesnt work.
var videoConnection = stillImageOutput.ConnectionFromMediaType(AVMediaType.Video);
var sampleBuffer = await stillImageOutput.CaptureStillImageTaskAsync(videoConnection);
var jpegImage = AVCaptureStillImageOutput.JpegStillToNSData(sampleBuffer);
var photo = new UIImage(jpegImage);
byte[] data;
NSData imageData = photo.AsJPEG();
data = new byte[imageData.Length];
EnrollImageDisplay.ImageData = data;
Where EnrollImageDisplay is my content page in forms. Not I have to call this page but I am unable to do so. Any solution with this?
EDIT: Solved it using Xamarin.Forms.Application.Current.MainPage.Navigation.PushAsync(new Page());

The converted PDF image looks so blurry in UWP

I want to convert a pdf file to an image UI control in UWP using c#, xaml.
I've read another way to use the Flip Viewer, but I need each image file of the converted PDF file.
so I modified a bit of the existing sample To open a pdf file.
And my problem is that the quality of the converted image file is extremely bad.
I can not even see the letters.
but this quality problem is same on other pdf sample.
Take a look at my code.
private PdfDocument pdfDocument;
private async void LoadDocument()
{
pdfDocument = null;
//Output means my image UI control (pdf image will be added)
Output.Source = null;
//PageNumberBox shows current page
PageNumberBox.Text = "1";
var picker = new FileOpenPicker();
picker.FileTypeFilter.Add(".pdf");
StorageFile file = await picker.PickSingleFileAsync();
if (file != null)
{
try
{
pdfDocument = await PdfDocument.LoadFromFileAsync(file);
}
catch (Exception ex)
{
}
if (pdfDocument != null)
{ // I use this text to move page.
PageCountText.Text = pdfDocument.PageCount.ToString();
}
}
uint pageNumber;
if (!uint.TryParse(PageNumberBox.Text, out pageNumber) || (pageNumber < 1) || (pageNumber > pdfDocument.PageCount))
{
return;
}
Output.Source = null;
// Convert from 1-based page number to 0-based page index.
uint pageIndex = pageNumber-1 ;
using (PdfPage page = pdfDocument.GetPage(pageIndex))
{
var stream = new InMemoryRandomAccessStream();
await page.RenderToStreamAsync(stream);
BitmapImage src = new BitmapImage();
Output.Source = src;
await src.SetSourceAsync(stream);
}
}
And this is my xaml code.
<Grid>
<ScrollViewer >
<TextBlock Name="ViewPageLabel"VerticalAlignment="center">Now page</TextBlock>
<TextBox x:Name="PageNumberBox" InputScope="Number" Width="30" Text="1" TextAlignment="Right" Margin="5,0,5,0"
AutomationProperties.LabeledBy="{Binding ElementName=ViewPageLabel}"/>
<TextBlock VerticalAlignment="Center">of <Run x:Name="PageCountText"/>.</TextBlock>
</ScrollViewer>
</Grid>
Is there any suggestions?
Please help me.
Thanks for reading this.
Ran into this issue recently, didn't see any definitive answer here, so here it goes:
JosephA is on the right track, but PdfPageRenderOptions does not have anything about image fidelity/quality or anything like that like I had hoped. However, it does allow you to specify image dimensions. All you have to do is scale up the dimensions.
I suspect what's going on is that the PDF has a scale that it would "like" to use, which is smaller than the image you want to draw. Without specifying dimensions, it's drawing the "small" image and then it's getting scaled up, causing the blurriness.
Instead, if you tell it to draw the image at a higher resolution explicitly, it will do PDF magic to make those lines crisper, and the resulting raster image won't have to scale/blur.
PdfPage page = _document.GetPage(pageIndex);
await page.RenderToStreamAsync(stream, new PdfPageRenderOptions {
DestinationWidth = (uint)page.Dimensions.MediaBox.Width * s,
DestinationHeight = (uint)page.Dimensions.MediaBox.Height * s
});
Something like this helps, where "s" is the scale factor to achieve the dimensions you need.
PdfPage.Dimensions has a number of different properties other than just "MediaBox" that you may want to explore as well depending on your use case.
It sounds like you are encountering the common problem where you need to dynamically adjust the resolution the PDF page is rendered at to an image.
I am not familiar with the that PDF library however it appears you need to use the RenderToStreamAsync() overload that takes a PdfPageRenderOptions parameter to accomplish this.

Saving an image from image control to gallery in windows phone 7

I have a image in a Image control like below:
<Image x:name="myImg" Source="Images/MyImg.png" />
How can I save this image in to the image gallery so that I can see by going to the gallery folder.
I have tried different codes but I am not able to save it. Please help me on this.
EDIT:
I have image in control in List Box. I am binding the list box with the IList that is coming from the web service.
So after Binding the image if user want to save the image he can save the particular which he want to save.
So how can i save the that particular image.
Thanks in advance.
There is an excellent MSDN article that describes this very scenario:
How to: Encode a JPEG for Windows Phone and Save to the Pictures Library
Incidentally , it's also the first search result link when searching for windows phone save image to media library on both Google and Bing.
Have you tried following this guide, and if so what are you having problems with?
The essential code to save it:
private void btnSave_Click(object sender, RoutedEventArgs e)
{
// Create a file name for the JPEG file in isolated storage.
String tempJPEG = "TempJPEG";
// Create a virtual store and file stream. Check for duplicate tempJPEG files.
var myStore = IsolatedStorageFile.GetUserStoreForApplication();
if (myStore.FileExists(tempJPEG))
{
myStore.DeleteFile(tempJPEG);
}
IsolatedStorageFileStream myFileStream = myStore.CreateFile(tempJPEG);
// Create a stream out of the sample JPEG file.
// For [Application Name] in the URI, use the project name that you entered
// in the previous steps. Also, TestImage.jpg is an example;
// you must enter your JPEG file name if it is different.
StreamResourceInfo sri = null;
Uri uri = new Uri("[Application Name];component/TestImage.jpg", UriKind.Relative);
sri = Application.GetResourceStream(uri);
// Create a new WriteableBitmap object and set it to the JPEG stream.
BitmapImage bitmap = new BitmapImage();
bitmap.CreateOptions = BitmapCreateOptions.None;
bitmap.SetSource(sri.Stream);
WriteableBitmap wb = new WriteableBitmap(bitmap);
// Encode the WriteableBitmap object to a JPEG stream.
wb.SaveJpeg(myFileStream, wb.PixelWidth, wb.PixelHeight, 0, 85);
myFileStream.Close();
// Create a new stream from isolated storage, and save the JPEG file to the media library on Windows Phone.
myFileStream = myStore.OpenFile(tempJPEG, FileMode.Open, FileAccess.Read);
// Save the image to the camera roll or saved pictures album.
MediaLibrary library = new MediaLibrary();
if (radioButtonCameraRoll.IsChecked == true)
{
// Save the image to the camera roll album.
Picture pic = library.SavePictureToCameraRoll("SavedPicture.jpg", myFileStream);
MessageBox.Show("Image saved to camera roll album");
}
else
{
// Save the image to the saved pictures album.
Picture pic = library.SavePicture("SavedPicture.jpg", myFileStream);
MessageBox.Show("Image saved to saved pictures album");
}
myFileStream.Close();
}

Image gets clipped while changing orientation using Qt

HI all,
I wnt to develop an ImageViewer using qt. I m trying to resize big images by scaling them. My problem is , when i change the screen orientation some part of the image gets clipped and also if i open the image in landscape mode, by default the size of image remains small even when i change back to portrait mode. What am i Doin wrong?
Please help me out. Heres the code dat i hv written
ImageViewer::ImageViewer()
{
setAttribute(Qt::WA_DeleteOnClose);
QAction *back = new QAction(this);
back->setText(QString("Back"));
connect(back,SIGNAL(triggered()),this,SLOT(close()));
back->setSoftKeyRole(QAction::PositiveSoftKey);
addAction(back);
imageLabel = new QLabel();
imageLabel->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
imageLabel->setAlignment(/*Qt::AlignLeft|*/Qt::AlignCenter);
QWidget *widget = new QWidget;
layout=new QStackedLayout();
layout->addWidget(imageLabel);
widget->setLayout(layout);
setCentralWidget(widget);
}
void ImageViewer::showImage(QString filePath)
{
QImageReader reader;
reader.setFileName(filePath);
QSize imageSize = reader.size();
imageSize.scale(size(), Qt::KeepAspectRatio);
reader.setScaledSize(imageSize);
QImage image = reader.read();
imageLabel->setPixmap(QPixmap::fromImage(image));
imageLabel->adjustSize();
}
You should re-implement QLabel's resizeEvent or install event filter to it and handle QResizeEvent there
The content of showImage method should go to handler of a resize event.
Currently you are using size() of ImageViewer widget (which seems to be derived from QMainWindow), it's better to use imageLabel.size(); or the best QResizeEvent::size() as this will prevent a problem if you will change UI layout in future.

Resources