Thursday, 10 November 2016

Xamarin iOS for Simulator and Screenshots

I love the Xamarin iOS Simulator for Windows, much easier than VNC'n to my Mac or having to constantly use my iPhone when I'm only playing around with UI and stuff.

It has all the features you'd expect like show/hide keyboard, home button, rotate, trigger call etc. It also has capture screenshot which would be super handy.

Tonight I needed to take a few screenshots so got trigger happy with the screenshot button but.... I couldn't find where they went!

To cut a long story short I ended up using Process Monitor to find where the files were being written and it turns out they go to a Xamarin\iOS Simulator folder within your pictures folder. I never use mine on my development machine so didn't even consider checking there.



So two tip Pro Tips:

  1. Xamarin iOS Simulator for Windows Screenshots goto: C:\Users\{username}\Xamarin\iOS Simulator
  2. Not sure where files are or whats using them... Don't forget about Process Monitor

Wednesday, 10 February 2016

HTML 5 Web Capture Quirks

Today I've been playing around with HTML 5 Web Camera capture and for the most part its been quite easy. HTML5Rocks has a good intro post which covers many things.

Now it came to testing and everything worked as expected in Chrome and Firefox however in Microsoft Edge (We all test in MS Edge don't we.... ) I found an odd behavior. 

I'm being quite lazy and wanting a 640 x 480px image, so 4:3 aspect ratio which I then take a smaller portion from. Below is what it looks like in Chrome:


However in Edge I was getting:


Originally my source was just:

navigator.getUserMedia({video:true}, (stream) => {


So I decided to add explicit constraints:

 var constraints = {
                video: {

                    width: 640,
                    height: 480,
                }
            };
navigator.getUserMedia(constraints, (stream) => {


However the results were still the same. I then started digging around any Edge documentation I could find and found my way to the initial edge announcement of user media support Midway through this they talk about the various constraints they support and what their defaults are. Turns out these are different than Chrome and Firefox.

Edge by default has an aspect ratio of 1.7777777778 (16:9) and this overrides the height and width I was providing.  To get everything consistent I then simply modified my constraints object to ensure it includes the aspect ratio and everything start behaving itself :)

  var constraints = {
                video: {

                    minWidth: 640,
                    minHeight: 480,
                    aspectRatio: 1.33333333
                }
            };
            navigator.getUserMedia(constraints, (stream) => {


Don't you love browser implementation quirks ;)