Xamarin: How to Capture Image DATA (not only for display) on portable app - mobile

I need to capture an image from my camera using xamarin.forms portable, and obtain access to the image byte[] data for image processing purposes.
How can this be done?
I have the working code that captures the image and simply shows it, using xlabs
public async Task<MediaFile> TakePicture()
{
Setup ();
ImageSource = null;
return await _Mediapicker.TakePhotoAsync (new CameraMediaStorageOptions {
DefaultCamera = CameraDevice.Front, MaxPixelDimension = 400
}).ContinueWith (t => {
if (t.IsFaulted)
{
Status = t.Exception.InnerException.ToString();
}
else if (t.IsCanceled)
{
Status = "Canceled";
}
else
{
MediaFile mediaFile = t.Result;
ImageSource = ImageSource.FromStream(() => mediaFile.Source);
return mediaFile;
}
return null;
}, _scheduler);
}
and
private async void buttonTakePicture_Clicked() {
await cameraViewModel.TakePicture();
imageView.Source = cameraViewModel.ImageSource;
}
clicking the button launches cameraViewModel.TakePicture() which in turn uses xlabs to actually take the picture on the device.
How can I alter the code to also give me the image raw data (or use a different code altogether)?
Thanks

You can take mediaFile.Path and pass it as a parameter for a DependencyService:
//For Android
public byte[] ByteArrayFromStream(string path)
{
var bitmap = BitmapFactory.DecodeFile(path);
byte[] bitmapData;
using(stream = new MemoryStream())
{
bitmap.Compress(Bitmap.CompressFormat.Png, 100, stream);
bitmapData = stream.ToArray();
}
return bitmapData;
}
//For iOS
public byte[] ByteArrayFromStream(string path)
{
UIImage originalImage = UIImage.FromFile(path);
return originalImage.AsPNG().ToArray();
}
To learn more about DependencyService you can access the documentation at:
https://developer.xamarin.com/guides/xamarin-forms/dependency-service/

This will help you to get byte[ ] in PCL :
public async Task<MediaFile> TakePicture()
{
Setup ();
ImageSource = null;
return await _Mediapicker.TakePhotoAsync (new CameraMediaStorageOptions {
DefaultCamera = CameraDevice.Front, MaxPixelDimension = 400
}).ContinueWith (t => {
if (t.IsFaulted)
{
Status = t.Exception.InnerException.ToString();
}
else if (t.IsCanceled)
{
Status = "Canceled";
}
else
{
MediaFile mediaFile = t.Result;
using (MemoryStream ms = new MemoryStream())
{
mediaFile.Source.CopyTo(ms);
byte[] attchmentbytes = ms.ToArray();
}
ImageSource = ImageSource.FromStream(() => mediaFile.Source);
return mediaFile;
}
return null;
}, _scheduler);
}

Related

Use WebBrowser control in page instead of popup for Identity Server 4 login

I am using Identity Server 4 for authentication on my WPF MVVM app. Currently, when the user wants to log in, a popup window appears with the login screen and the info gets passed back through the OidcClientOptions. However, instead of a popup window, I want the login page to show up on a WebBrowser control in the actual application. How can I accomplish this?
My Login code:
public class Login
{
private OidcClient _oidcClient = null;
LoginResult result = null;
AccessToken accessToken = new AccessToken();
public async void LoginPage()
{
var options = new OidcClientOptions()
{
Authority = "https://localhost:5001/",
ClientId = "wpf",
ClientSecret = "secret",
Scope = "openid WebAPI",
RedirectUri = "http://localhost/signin-oidc",
Flow = OidcClientOptions.AuthenticationFlow.AuthorizationCode,
Browser = new WpfEmbeddedBrowser();
};
_oidcClient = new OidcClient(options);
try
{
result = await _oidcClient.LoginAsync();
}
catch (Exception ex)
{
return;
}
if (result.IsError)
{
}
else
{
accessToken.WriteToken(result.AccessToken);
App.Current.Properties["AccessToken"] = result.AccessToken;
}
}
}
Current WpfEmbeddedBrowser I'm using:
public class WpfEmbeddedBrowser : IBrowser
{
private BrowserOptions _options = null;
public WpfEmbeddedBrowser()
{
}
public async Task<BrowserResult> InvokeAsync(BrowserOptions options, CancellationToken cancellationToken = default)
{
_options = options;
var window = new Window()
{
Width = 900,
Height = 625,
Title = "IdentityServer Login"
};
// Note: Unfortunately, WebBrowser is very limited and does not give sufficient information for
// robust error handling. The alternative is to use a system browser or third party embedded
// library (which tend to balloon the size of your application and are complicated).
var webBrowser = new WebBrowser();
var signal = new SemaphoreSlim(0, 1);
var result = new BrowserResult()
{
ResultType = BrowserResultType.UserCancel
};
webBrowser.Navigating += (s, e) =>
{
if (BrowserIsNavigatingToRedirectUri(e.Uri))
{
e.Cancel = true;
result = new BrowserResult()
{
ResultType = BrowserResultType.Success,
Response = e.Uri.AbsoluteUri
};
signal.Release();
window.Close();
}
};
window.Closing += (s, e) =>
{
signal.Release();
};
window.Content = webBrowser;
window.Show();
webBrowser.Source = new Uri(_options.StartUrl);
await signal.WaitAsync();
return result;
}
private bool BrowserIsNavigatingToRedirectUri(Uri uri)
{
return uri.AbsoluteUri.StartsWith(_options.EndUrl);
}
}

Use BitmapDecoder in an other thread then where is created. (The calling thread cannot access this object because a different thread owns it.)

So, i have a function that will load an image from disk async in an other thread ( big images will be loaded and I don't want the UI THread to be locked while loading).
Loading is done like this
public override void LoadFile()
{
using (var imageStream = new FileStream(_filePath, FileMode.Open, FileAccess.Read, FileShare.Read))
{
Decoder = new TiffBitmapDecoder(imageStream, BitmapCreateOptions.PreservePixelFormat, BitmapCacheOption.OnLoad);
InitializeFile();
}
}
Then I want to use the Decoder on the main thread
public List<ThumbnailModel> LoadPages()
{
var result = new List<ThumbnailModel>();
foreach (var frame in Decoder.Frames) <--// this line throws exception
{
result.Add(new ThumbnailModel
{
Name = _metadataLoader.GetPageName((BitmapMetadata)frame.Metadata),
Bitmap = new WriteableBitmap(frame)
});
}
return result;
}
Now here is the problem, whenever I reach the line where I try to access the Decoder.Frames it throws exception (The calling thread cannot access this object because a different thread owns it.)
Is there a way I can use my Decoder in the main thread if not, the only possible solution is to load all the image information in the other thread?
Full code version :
// this is the task, that calls the imageFactory LoadFile method - NewThread
private async Task OpenFileAsync(string strFilePath)
{
var newFile = _imageFileFactory.LoadFile(strFilePath);
if (newFile != null)
{
_imagefile = newFile;
}
}
//image factory load file - NewThread
public IImageFile LoadFile(string filePath)
{
if (string.IsNullOrWhiteSpace(filePath))
{
return null;
}
var fileExtension = Path.GetExtension(filePath); // .tiff or .jpeg
var file = new ImageFileTiff(filePath, _metatadaFactory, _metadataVersioner);
file.LoadFile();
return file;
}
// ImageFileTiff LoadFile will create a decoder - NewThread
public override void LoadFile()
{
using (var imageStream = new FileStream(_filePath, FileMode.Open, FileAccess.Read, FileShare.Read))
{
Decoder = new JpegBitmapDecoder(imageStream, BitmapCreateOptions.PreservePixelFormat, BitmapCacheOption.OnLoad);
InitializeFile();
}
}
After we have an IImageFile we call on MainThread(UIThread)
var pages = _imagefile.LoadPages();
Where LoadPages is the place where the app breaks. also called on UIThread
public List LoadPages()
{
var result = new List();
foreach (var frame in Decoder.Frames)
{
result.Add(new ThumbnailModel
{
Name = _metadataLoader.GetPageName((BitmapMetadata)frame.Metadata),
Bitmap = new WriteableBitmap(frame)
});
}
return result;
}
I thought you could simply return the decoder from the thread to be able to access it but your decoder is a TiffBitmapDecoder which inherits from DispatcherObject (https://learn.microsoft.com/en-gb/dotnet/api/system.windows.threading.dispatcherobject?view=netcore-3.1).
So you won't be able to access it from a different thread than the one where it was created msdn:"Only the thread that the Dispatcher was created on may access the DispatcherObject directly"
What you could do instead is use the decoder in it's thread and return the final result:
I couldn't build on your sample since there was to much missing for me to test it but I built a similar project to give an exemple:
public partial class MainWindow : Window
{
public MainWindow()
{
}
public TiffBitmapDecoder LoadFile()
{
OpenFileDialog openFileDialog = new OpenFileDialog();
openFileDialog.InitialDirectory = "c:\\";
openFileDialog.Filter = "tiff files (*.tif)|*.tif|All files (*.*)|*.*";
openFileDialog.FilterIndex = 2;
openFileDialog.RestoreDirectory = true;
if (openFileDialog.ShowDialog() == true && !string.IsNullOrEmpty(openFileDialog.FileName))
{
//I didn't bother to check the file extension since it's just an exemple
using (var imageStream = openFileDialog.OpenFile())
{
return new TiffBitmapDecoder(imageStream, BitmapCreateOptions.PreservePixelFormat, BitmapCacheOption.OnLoad);
}
}
else
{
//User cancelled
return null;
}
}
public List<ThumbnailModel> LoadPages(TiffBitmapDecoder decoder)
{
//TiffBitmapDecoder" inherits from DispatcherObject/>
//https://learn.microsoft.com/en-gb/dotnet/api/system.windows.threading.dispatcherobject?view=netcore-3.1
var result = new List<ThumbnailModel>();
if (decoder != null)
{
try
{
foreach (var frame in decoder.Frames)
{
result.Add(new ThumbnailModel
{
//set the variables
});
}
}
catch(InvalidOperationException e)
{
MessageBox.Show(e.Message, "Error");
}
}
else
{
//Nothing to do
}
return result;
}
private async Task AsyncLoading()
{
this.thumbnailModels = await Task.Run<List<ThumbnailModel>>(() =>
{
var decoder = this.LoadFile();
return this.LoadPages(decoder);
});
}
private List<ThumbnailModel> thumbnailModels = null;
private async void AsyncLoadingButton_Click(object sender, RoutedEventArgs e)
{
await this.AsyncLoading();
}
}
public class ThumbnailModel
{
}
Content of MainWindow.xaml just in case:
<Grid>
<StackPanel Orientation="Vertical">
<Button x:Name="NoReturnButton" Margin="10" HorizontalAlignment="Center" Content="Call AsyncLoadingNoReturn" Click="AsyncLoadingButton_Click" />
</StackPanel>
</Grid>

Get data from Active Directory using react and ASP.NET Core

Can someone share code to retrieve user details along with thumbnail image to be displayed on the basis of an input of a SamAccountName?
This has to be accomplished using ASP.NET Core and react. I am pretty new to these technologies, please help.
My trials as below
Controller code:
public Image ourTeam()
{
var userDetails = db.users.Where(x=>x.saMAccountName == "someUsername").FirstOrDefault();
Image image = GetImage(userDetails.CN); //I get image data
//context.Response.ContentType = "image/jpeg";
var stream = new System.IO.MemoryStream();
if (image != null)
image.Save(stream, ImageFormat.Jpeg);
return image;
}
Component code:
import * as React from 'react';
import { RouteComponentProps } from 'react-router';
interface FetchImageDataState {
imageList: ImageData[];
loading: boolean;
}
export class OurTeam extends React.Component<RouteComponentProps<{}>, FetchImageDataState> {
constructor() {
super();
this.state = { imageList: [], loading: true }; //initialize to default
fetch('api/Home/ourTeam')
.then(response => response.json() as Promise<ImageData[]>)
.then(data => {
this.setState({ imageList: data, loading: false });
});
}
public render() {
let contents = this.state.loading
? <p><em>Loading...</em></p>
: this.renderImageTable(this.state.imageList);
return <div>
<h1>Team</h1>
{contents}
</div>;
}
private renderImageTable(imageList: ImageData[]) {
return <div className='table'>{
imageList.map(x =>
<img src={x.byteData} alt={x.CN} />)
}</div>;
}
}
export class ImageData {
CN: string = "";
byteData: string = "";
}
PFB the code on how I am authenticating and then retrieving image:
private Image GetImage(string cn)
{
string LDAP_PATH = "LDAP://" + "SOMEPATH.com";
string user = "USERID";
string password = "PASSWORD";
using (DirectoryEntry entry = new DirectoryEntry(LDAP_PATH, user, password))
{
{
DirectorySearcher search = new DirectorySearcher(entry);
search.PropertiesToLoad.Add("sAMAccountName");
search.PropertiesToLoad.Add("distinguishedName");
search.Filter = "(&(objectClass=user)(sAMAccountName=" + cn + "))";
SearchResult result = search.FindOne();
if (result == null)
{
search.Filter = "(&(objectClass=user)(cn=" + cn + "))";
result = search.FindOne();
}
if (result != null)
{
DirectoryEntry entryUser = result.GetDirectoryEntry();
string propertyName = "thumbnailPhoto";
if (entryUser.Properties.Contains(propertyName))
{
byte[] img = entryUser.Properties[propertyName].Value as byte[];
MemoryStream memStream = new MemoryStream(img);
return Image.FromStream(memStream);
}
}
}
}
// User not authenticated
return null;
}
I assume you want to return the image as if you were just downloading a file.
First, return a byte[] from GetImage. You don't gain anything here by converting it to an Image object. If you needed to edit the image in code, then it would make sense. But since you're not, it doesn't matter.
So change this:
byte[] img = entryUser.Properties[propertyName].Value as byte[];
MemoryStream memStream = new MemoryStream(img);
return Image.FromStream(memStream);
To this:
return entryUser.Properties[propertyName].Value as byte[];
Then in your controller, return a FileContentResult, like this:
public ActionResult ourTeam()
{
var userDetails = db.users.Where(x=>x.saMAccountName == "someUsername").FirstOrDefault();
byte[] image = GetImage(userDetails.CN);
return File(image, "image/jpeg");
}

ng-flow file upload in web api

I have seen many examples with ng-flow having the php side server to upload the files. But as I am not an expert in php and I need some help in the webapi, can someone please help me to find a working example or tutorial of ng-flow with webapi files upload.
Thanks everyone.
below is my web-api code to do this
[HttpPost]
public async Task<HttpResponseMessage> SaveFile()
{
if (!Request.Content.IsMimeMultipartContent())
Request.CreateResponse(HttpStatusCode.UnsupportedMediaType);
var provider = FileSaver.GetMultipartProvider();
var result = await Request.Content.ReadAsMultipartAsync(provider);
var fileInfo = FileSaver.MoveToTemp(result);
return Request.CreateResponse(HttpStatusCode.OK, fileInfo);
}
it uses the custom FileSaver class
public class FileSaver
{
public static MultipartFormDataStreamProvider GetMultipartProvider()
{
var uploadFolder = //your upload path;
return new MultipartFormDataStreamProvider(uploadFolder);
}
private static string GetDeserializedFileName(MultipartFileData fileData)
{
var fileName = GetFileName(fileData);
return JsonConvert.DeserializeObject(fileName).ToString();
}
private static string GetFileName(MultipartFileData fileData)
{
return fileData.Headers.ContentDisposition.FileName;
}
public static FileInfo MoveToTemp(MultipartFormDataStreamProvider result)
{
var originalFileName = GetDeserializedFileName(result.FileData.First());
var uploadedFileInfo = new FileInfo(result.FileData.First().LocalFileName);
string timestamp = DateTime.UtcNow.ToString("yyyyMMddHHmmssfff", CultureInfo.InvariantCulture);
var folder = Directory.CreateDirectory(**); //your upload path
if (!folder.Exists) folder.Create();
var filename = folder.FullName + #"\" + originalFileName;
MoveFile(uploadedFileInfo, filename);
return uploadedFileInfo;
}
private static void MoveFile(FileInfo fileInfo, string filename)
{
var count = 0;
do
{
try
{
fileInfo.MoveTo(filename);
return;
}
catch (Exception)
{
if (count == 4)
{
throw;
}
count++;
Thread.Sleep(1 * 1000);
}
} while (true);
}
}

How do I update the UI from a HttpWebRequest?

In my Mainpage.xaml.cs file I have a function that creates an instance of another class and tries to download a webpage using a HttpWebRequest from that instance. The problem is, once I've managed to download the webpage I can't send it back to the main UI thread. I've tried using Deployment.Current.Dispatcher.BeginInvoke to send the webpage back to a TextBlock I have waiting, but when I try I get an error telling me that I can't access the TextBlock from the other class. Is there any way to pass data between two threads without using LocalStorage?
EDIT: code below:
MainPage:
private void button1_Click(object sender, RoutedEventArgs e)
{
Member m = new Member(name, id);
}
Member class:
public Member(String Member, String API)
{
APIKey = API;
MemberName = Member;
this.super = super;
DoSend(method, string, "", null);
}
public void DoSend(string method, string url, string body, string mimetype)
{
if (WebRequest.RegisterPrefix("https://",System.Net.Browser.WebRequestCreator.ClientHttp)) {
HttpWebRequest request = WebRequest.Create(makeURI(url)) as HttpWebRequest;
request.Method = method;
request.Headers["X-NFSN-Authentication"] = MakeAuthHeader(url,body);
if (body != "")
{
byte[] bodyData = Encoding.UTF8.GetBytes(body);
request.ContentType = mimetype;
//Stuff Should Happen Here
}
else
doStuff(request);
}
public void doStuff(HttpWebRequest httpReq)
{
httpReq.BeginGetResponse(r =>
{
var httpRequest = (HttpWebRequest)r.AsyncState;
var httpResponse = (HttpWebResponse)httpRequest.EndGetResponse(r);
using (var reader = new StreamReader(httpResponse.GetResponseStream()))
{
var response = reader.ReadToEnd();
ResponseBlock.Text = response; //Invalid cross-thread reference
}
}, httpReq);
}
MainPage:
customClass.DownloadPage((result) =>
{
textBlock.Text = result;
},
(exception) =>
{
MessageBox.Show(exception.Message);
});
CustomClass:
public void DownloadPage(Action<string> callback, Action<Exception> exception)
{
WebClient webClient = new WebClient();
webClient.DonwloadStringCompleted += (s, e) =>
{
if (e.Error == null)
{
Deployment.Current.Dispatcher.BeginInvoke(() =>
{
callback(e.Result);
});
}
else
{
Deployment.Current.Dispatcher.BeginInvoke(() =>
{
exception(e.Error);
});
}
};
webClient.DonwloadStringAsync();
}

Resources