Coding4Fun toolkit 2.1.0 released #WinRT #wpdev #windev

c4f

This is the 3rd iteration of toolkit updates I am pushing out. Like the other 2, this one builds on Windows Runtime WinRT app support for Windows Platform development.

This release also brings WinRT support close to what Silverlight version supported and finally drops support for Silverlight apps. The SL version is still available on nuget but it is unlikely to receive any updates.

SuperSlider (ColorSlider + ColorPicker) has a gotcha and its gonna need some clever work. Internally it uses code that monitors movement for updates and movements to prevent scrolling when the control is contained within Pivot, Hub or FlipView containers however lack of Touch class has forced me to use PointerPressed / PointerMoved and PointerReleased for these and in my tests, Pivot does not bubble those events and control doesn’t work correctly. Keep this in mind

Sample apps available in stores will be updated to reflect the changes

258x67_WP_Store_cyan WindowsStore

Control Windows Phone 8.1 Windows 8.1
RoundButton
ToggleButton
OpacityButton
Tile
ImageTile
ChatBubble
ChatBubbleTextBox
ColorHexPicker
ColorPicker
ColorSlider
AboutPrompt ×
InputPrompt ×
MessagePrompt ×
ToastPrompt ×
PasswordInputPrompt ×
MetroFlow
Overlay
SuperSlider
SuperImage

Happy coding

Lumia 735 – the affordable windows phone

A month back I really needed a device with Windows Phone Navigation Bar.. talking to @Connects team, they asked if I’d like to do a comparison of say 735 vs 830. I used the device for over 2 weeks and it was great. Aside from the occasional yearning for the 830.

1Shot_20141113_090348 1Shot_20141113_090307 1Shot_20141113_090214 1Shot_20141113_090553

The device closely resembles the first Nokia Windows Phone 7 device – the Lumia 800. Its very light and the one I received was green. This device comes with wireless charging back cover as you can see and despite that its very light. When wireless charging, the circuit does not make noise unlike the 830 which was rather annoying

Like all 2nd gen devices, it takes nano sim and setup took the usual time and I was up and running. The 735 ships with Denim firmware

Lumia 73x specs

  • Snapdragon s400 same as 830
  • 1GB RAM
  • SD Expansion slot
  • Nano SIM
  • 4.7 inch 720p display with navigation bar
  • 6.7 MP rear and 5 MP front camera
  • Collapsible Navigation Bar instead of Back / Home / Search button
  • No Camera button

Spec wise 735 is nearly identical to 830 – the major difference is the camera.. The rear camera is 6.7 MP as opposed to 10MP for 830 however.. front camera is 5MP unlike 1.2 MP for 830

So this rightly comes with the best selfie camera in the entire Lumia range. The device like 830 stays nice and cool.. battery last the entire day.. no complains there.. I took many pictures with this device and occasionally I could see 6.7MP rear camera as a weak point oh. Lack of camera button meant that one hand photography was out of question. Here are some pictures taken using my 1Shot camera app. It does a decent job covering some foggy nights and walks around Cheshunt

1Shot_20141129_222134 1Shot_20141129_155355 1Shot_20141129_150726 1Shot_20141129_150713 1Shot_20141129_144520 1Shot_20141129_144028 1Shot_20141119_152802 1Shot_20141119_135147

I missed the hardware camera button. The capacitive buttons not being around was actually kinda nice.. seriously though put in a 10MP rear camera module and a physical camera button and its a winner.

Oh did I mention that its about £100 cheaper when you compare it to 830 ?

Coding4Fun v2.0.8 released on Nuget #wpdev #win8dev

Earlier this week I mentioned that I was working on a release of Coding4Fun toolkit. It has now achieved parity with Windows 8.1 version (which was somehow never released).

As of now, a stable release v2.0.8 is now available. The changes include

  • Support for Windows 8.1
  • Support for Windows Phone 8.1 (WinRT app not SL8.1)
  • WP8 Silverlight continues to be supported as before
  • Dropped WP7 and Windows 8

In addition to Coding4Fun.Toolkit.Audio and Coding4Fun.Toolkit.Storage which is supported in both Win8.1 and WP8.1, the Coding4Fun.Toolkit.Control has the following controls

  • Tile
  • SuperImage
  • ImageTile
  • ColorHexagonPicker
  • ChatBubble
  • ChatBubbleTextBox
  • RoundButton
  • RoundToggleButton
  • OpacityToggleButton

The source as usual is on http://coding4fun.codeplex.com, packages are on Nuget

Support for Windows Phone 8.1 WinRT for Coding4Fun

Earlier this year, I took the responsibility of ensuring that  Coding4Fun toolkit supported Windows Runtime apps on Windows Phone 8.1. I spent a good part of March / April porting major chunks of code without porting XAML.

Occasionally I was reminded of the pending work by both Clint Rutkas and others, namely Glenn Versweyveld. After another round this week, I decided to take advantage of the quiet time I am having to push this through.

I have created a fork of coding4fun repo on codeplex and so far this is what i have done

  • Coding4Fun.Toolkit updated to support universal apps (Win8.1 and WP8.1)
  • Coding4Fun.Toolkit.Audio updated to support universal apps (Win8.1 and WP8.1)
  • Coding4Fun.Toolkit.Storage updated to support universal apps.
  • Created Coding4Fun.Toolkit.Controls project to explicitly support WP8.1
  • Added Tile, ImageTile, SuperImage, ColorHexagonPicker, BubbleChat & BubbleChatTextBox controls

Once parity with existing Win8.1 lib has been achieved, the next version of toolkit will be released on Nuget.

Lumia 830 – The affordable flagship

About a month back, I received a Lumia 830 review device from @Connects team. Without them, I wouldn’t be able to review / play around with so many devices

The device itself ships in a new slim line package.. I am sure you don’t give a hoot about unboxing.. personally I don’t and like a child, I am eager to see what’s inside. Ripping the packaging open received a Lumia 930’s cousin. This one was orange unlike the 930 (which was green). The first thought on picking it up was my goodness it is light.

1Shot_20141020_122544 1Shot_20141020_122528

The hysteria of a ultra light device was rather short lived. I tried to find SIM slot and discovered the removable shell. Popping it open revealed the absence of battery and that explained the lack of weight. Silly me. It however is a 1 mm or so thinner than 930 and when holding the device it feels great.. slightly better than 930 if I may say so.

Like the 930, 830 takes Nano SIM (which is a shame) however it has micro SD slot so users can increase the memory. This is something most high-end Lumia devices lack and something I could never really explain why. All low end devices allowed SD cards yet high-end restricted users (except 1520) – not that those where particularly slim or lightweight (if that was ever the main reason).

1Shot_20141020_122714 1Shot_20141020_122756

The Lumia 830 also supports wireless charging and you can see the induction charging circuit on the back of the removable shell. Like others, I also noticed that when wireless charging the devices makes noise – if you use wireless charging.. don’t do it on your bedside table as you go sleep :) it’s rather annoying.

Lumia 830

  • Quad core snapdragon S400
  • 1GB RAM
  • SD Card expansion
  • Nano SIM
  • 5 inch 720p display
  • 10 MP camera module

Lumia 930

  • Quad core snapdragon S800
  • 2GB RAM
  • Nano SIM
  • 5 inch 1080p display
  • 20 MP camera module

I distinctly remember that Lumia 930 warmed up substantially while I was setting it up and I experienced the same over the course of normal usage. This is something I have commented often and taken up with Microsoft Mobile.

With Lumia 830 it never warmed up. I used the device over 2 weeks as my main device and not once did I feel it as warm. Sure I reviewed 930 in summer and 830 in autumn :)

From a photo hobbyist perspective, I thoroughly enjoyed Lumia 830.. sure it doesn’t have the numbers that Lumia 1020, 1520 and 930 have but it took great day time and night-time pictures.

My 1shot app worked like a breeze and here are some of the samples are below. My only concern with Lumia 830 is the price. Its being marketed as affordable flagship. If I put on my ‘spec whore’ glasses on, it’s very midrange spec and not flagship spec. Don’t get me wrong it performs great but it’s not flagship spec. Another point is the price. Lumia 830 can be purchased for £265 or so on Amazon.co.uk. Lumia 930 on the other hand Lumia 930 costs £325.
Sure £60 is a difference but there is a big freaking difference in spec.

The Lumia 830 should be selling closer to the price range of Lumia 730 (£189).. different shape, size, design and similar price.. this device does not compete with high-end Lumia so why does it do so on price?

1Shot_20141022_074232 1Shot_20141022_122401 1Shot_20141101_162627 1Shot_20141101_181559 1Shot_20141101_182040 1Shot_20141101_182117 1Shot_20141101_193933 1Shot_20141101_193941 1Shot_20141103_095539 1Shot_20141103_115741

Images and Scaling with Windows Runtime #WinRT #WPDev #Windev

With the advent of Windows Phone 8.1, developers have the option of using WinRT native XAML stack as opposed to the Silverlight XAML the only option with early Windows Phone iterations.

One of the differences between WinRT XAML and Silverlight XAML is scaling and like with fonts, & images, scaling can have a significant effect on the look and feel of an app.

The default behavior with Windows Phone 8 was the inherent Silverlight behavior of scaling the image to fit. This meant that unless a high-resolution image was used, the image would end up looking blurred. Windows Runtime takes a different approach.

Windows 8x supports multitudes of screen sizes, resolutions and DPI. Windows Phone now supports 4 resolutions. The way Windows Runtime deals with this is by allowing developer to specify multiple images to match certain scale factors.

Windows Store Apps Windows Phone Store Apps
1.0 (100% no scaling) 1.0 (100% no scaling)
1.4 (140% scaling) 1.4 (140% scaling)
1.8 (180% scaling) 2.4 (240% scaling)

The runtime would determine the scaling factor to use depending upon the screen size, resolution, DPI and the form factor of device in question. The developer is required to supply images for scaling 1; the other scale factors are optional. If they are supplied, they will be used if necessary.

There are two ways of supplying images to support multi-scaling support.

  • Specify image scale within the file name e.g. Image.scale-100.png or Image.scale-140.png
  • Create direct for each image scale and place images inside without specifying scaling like in 1. E.g. scale-100/Image.png or scale-140/Image.png

The attached project includes examples of both ways.

To use this and enable auto-scaling support, you specify the image as specified below

<Image Source="Assets/Iris.png" />
<Image Source="Assets/Iris2.png" />

Occasionally it is necessary to set the images from code. In those instances, one should query the windows runtime to determine the current scaling factor and return appropriate image resource.

var uri = new System.Uri("ms-appx:///Assets/Iris.png");
var file = await StorageFile.GetFileFromApplicationUriAsync(uri);

This will correctly detect the scaling factor and get appropriate file.

Alternatively, for Windows 8x, we can use DisplayProperties.ResolutionScale to determine current scaling and for Windows Phone, we can use DisplayInformation.RawPixelsPerViewPixel.

Uri uri = null;
#if WINDOWS_PHONE_APP
    var rawpixelperview = Windows.Graphics.Display.DisplayInformation.GetForCurrentView().RawPixelsPerViewPixel; 

    var Width = Convert.ToInt32(Window.Current.Bounds.Width * rawpixelperview); 
    var Height = Convert.ToInt32(Window.Current.Bounds.Height * rawpixelperview); 

    if(Width == 480 && Height == 800)
    {
        uri2 = new System.Uri("ms-appx:///Assets/scale-100/Iris2.png");
    }
    else if((Width == 720 && Height == 1280 ) || (Width == 768 && Height == 1280))
    {
        uri2 = new System.Uri("ms-appx:///Assets/scale-140/Iris2.png");
    }
    else
    {
        uri2 = new System.Uri("ms-appx:///Assets/scale-240/Iris2.png");
    }
#else
    switch (DisplayProperties.ResolutionScale)
    {
        case ResolutionScale.Scale100Percent:
            uri2 = new System.Uri("ms-appx:///Assets/scale-100/Iris2.png");
            break;

        case ResolutionScale.Scale140Percent:
            uri2 = new System.Uri("ms-appx:///Assets/scale-140/Iris2.png");
            break;

        case ResolutionScale.Scale180Percent:
            uri2 = new System.Uri("ms-appx:///Assets/scale-180/Iris2.png");
            break;
    }
#endif

var file = await StorageFile.GetFileFromApplicationUriAsync(uri);

It worth noting that images set in xaml and those done codebehind behave differently at least as far as size on screen is concerned. The only way to achieve correct size as visible in xaml is to set size to that of scale 1.0 image.

Supporting Accessibility

Windows Store apps support high contrast mode. The two available options are

  • Black background and white foreground
  • White background and black foreground.

To additionally support these two accessible image formats, you need to provide scale factor 1 images named / placed appropriately. I have excluded the high contrast images from sample as windows phone was using that by default.

Assets/Iris.scale-100_contrast-black.png

Assets/Iris.scale-100_contrast-white.png

or

Assets/scale-100_contrast-black/Iris2.png

Assets/scale-100_contrast-white/Iris2.png

Downloadable sample code can be downloaded here

End of line for CineworldMetro

Last night I did something I wasn’t sure I should do!! I removed (unpublished) my cineworld app from Windows Phone and Windows 8 stores.

In just over 2 years it has had 90K on phone and 40K on Windows8. It has come a long way and like a few other of my projects, it gave me a chance to try various scenarios in terms of design and performance.

Sadly one thing I never thought significantly was sustainability of the app in long term. My azure hosting had been free till date and from next week I start paying real money towards it. I have spend many many hours towards its dev and since the app doesn’t make any money for me so I can’t justify giving it a life line.

It has been good fun. Thanks for all the fish.