In nativescript(with angular) is there any way to set the src of an image from the response of a web api call that returns the image as byte array/base64?
There is not to much documentation, and I need to see the html and .ts files from a simple example, I have no code to paste here now.
you need to first create ImageSource form base64 string and then assign that imageSource to Image Native Element.
let imageSource = new ImageSource();
let loadedSource64 = imageSource.loadFromBase64(BASE_64_STRING_FROM_API_CALL);
if (loadedSource64 ) {
let image= <Image>this.imageElement.nativeElement;
image.imageSource = this.imageSource;
}
Related
I have an url that gets team logos but it returns svg https://www.mlbstatic.com/team-logos/141.svg.
How can i display this in a Image for xamarin forms?
Searched and only found complex huge amounts of code.
looking for
Download image -- I have this but what do i need to save it in GetResponsestream preferrable i would like to stay in memory and not write to disk or file.
Attach it to an image to display.
Thanks.
Ok, thought i would post my solution here.
I used SkiSharp:
SkiaSharp.Extended.Svg.SKSvg svg = new SkiaSharp.Extended.Svg.SKSvg();
using (WebClient client = new WebClient())
{
// ie for theurl: https://www.mlbstatic.com/team-logos/141.svg
svg.Load(new MemoryStream(client.DownloadData(new Uri(theurl))));
var bitmap = new SKBitmap((int)svg.CanvasSize.Width, (int)svg.CanvasSize.Height);
var canvas = new SKCanvas(bitmap);
canvas.DrawPicture(svg.Picture);
canvas.Flush();
canvas.Save();
string filename = "";
using (var image = SKImage.FromBitmap(bitmap))
using (var data = image.Encode(SKEncodedImageFormat.Png, 80))
{
// save the data to a stream
filename = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "temp.png");
using (var stream = File.OpenWrite(filename ))
{
data.SaveTo(stream);
}
}
}
use FileName from above to assign source to Xamarin image.
this accomplished the task with the least amount of code lines i tried.
How to access the local image file from my hard drive (outside project folder) in the image component (to make an image gallery)? How to write the path of the file? in Vaadin 14/RapidclipseX.
It only takes either path from the project or URL. In my project users have to upload the images and I want to make a gallery that will show the images.
I tried all the below way but didn't work:
D:\\Canavans\\Reports\\256456\\424599_320943657950832_475095338_n.jpg
D:\Canavans\Reports\256456\424599_320943657950832_475095338_n.jpg
code (Tried this way as well):
for(final File file: files)
{
System.out.println(file.getName());
this.log.info(file.getName());
this.log.info(file.getAbsolutePath());
final String path = "file:\\\\" + file.getAbsolutePath().replace("\\", "\\\\");
this.log.info(path);
final Image img = new Image();
img.setWidth("300px");
img.setHeight("300px");
img.setSrc("file:\\\\D:\\\\Canavans\\\\Reports\\\\256456\\\\IMG20171002142508.jpg");
this.flexLayout.add(img);
}
Please Help! Thanks in advance. Or is there any other way to create an image gallery?
Hmm as far as I know if you want to access resources outside the resource folder you can create a StreamResource and initialize the image with that. If you want to use the images "src" property then the file has to be inside one of Vaadin's resource folders (for example the 'webapp' folder).
Here is a simple example on how to create the image with a StreamResource:
final StreamResource imageResource = new StreamResource("MyResourceName", () -> {
try
{
return new FileInputStream(new File("C:\\Users\\Test\\Desktop\\test.png"));
}
catch(final FileNotFoundException e)
{
e.printStackTrace();
return null;
}
});
this.add(new Image(imageResource, "Couldn't load image :("));
Hope this helps :)
I'm getting the error below when I reopen the application to see the image:
Could not initialize an instance of the type 'UIKit.UIImage': the native 'initWithContentsOfFile:' method returned nil
Is it possible to ignore this condition by setting
MonoTouch.ObjCRuntime.Class.ThrowOnInitFailure
to false?
Below method is used to displaying the image
private async Task DisplayImageFromImageUrl()
{
UIImage image;
image = new UIImage(eventImageEntity.EventsImageUrl);
}
while executing the above code "image" showing "null" value.
If your trying to create an image from a URL, you need to use the following code:
if (!string.IsNullOrEmpty(eventImageEntity.EventsImageUrl.Trim()))
{
var url = new NSUrl(eventImageEntity.EventsImageUrl);
using (var data = NSData.FromUrl(url))
{
UIImage image = UIImage.LoadFromData(data);
}
}
Otherwise you will just end up with a Null UIImage. That is what's causing your problem.
EDIT:
If you're trying to get the image from a resource location, then the following is necessary:
This assumes that it's from a specific user created folder:
UIImage image = UIImage.FromFile(#"Assets/NavigationBarAssets/HomePC.png")
OR
This assumes that the image is just say in the root of iOS 'Resources' folder
UIImage image = new UIImage("HomePC.png")
I have created a windows form application to scan any document.After the image is scanned i am saving it in form of bytes in a folder in the system.Now i want to retrieve the image from database giving the path of the folder.whether it is possible or not.If possible plz help.
public Image byteArrayToImage(byte[] byteArrayIn)
{
MemoryStream ms = new MemoryStream(byteArrayIn);
Image returnImage = Image.FromStream(ms);
return returnImage;
}
Source : C# Image to Byte Array and Byte Array to Image Converter Class
I am developing a mobile (iphone/android) application using appcelerator titanium (sdk 1.6.2).
At a certain point in the app the user choses an image that should be shown in an imageView, base64 encoded, then uploaded to my server.
The problem is the success event of the photo gallery returns the selected image as a blob object and the Titanium.Utils.base64encode method only accepts string values!
Is there any way to convert Titanium.Blob objects to strings?
Here is the code snippet:
var imageView = Titanium.UI.createImageView({
height:200,
width:200,
top:20,
left:10,
backgroundColor:'#999'
});
Titanium.Media.openPhotoGallery({
success:function(event)
{
var cropRect = event.cropRect;
var image = event.media;//blob object
// set image view
Ti.API.debug('Our type was: '+event.mediaType);
if(event.mediaType == Ti.Media.MEDIA_TYPE_PHOTO)
{
imageView.image = image;// this works
var imgStr=Ti.Utils.base64encode(image);// doesn't work because 'image' has to be a string!, but how?
}
else
{
}
Titanium.API.info('PHOTO GALLERY SUCCESS cropRect.x ' + cropRect.x + ' cropRect.y ' + cropRect.y + ' cropRect.height ' + cropRect.height + ' cropRect.width ' + cropRect.width);
},
allowEditing:true,
popoverView:popoverView,
arrowDirection:arrowDirection,
mediaTypes:[Ti.Media.MEDIA_TYPE_VIDEO,Ti.Media.MEDIA_TYPE_PHOTO]
});
Thank you,
var imgStr=Ti.Utils.base64encode(image.toString());
.toString() converts something to a string representation
This worked for me.
var image = event.media;
var imgStr = Ti.Utils.base64encode(image).toString();
i just posted some code for a module to do this conversion, I know a patch is coming from appcelerator, but the module might be useful to you now.
Clearly Innovative Thoughts - Titanium Appcelerator Quickie: base64encode iOS Module