Corrado's Blog 2.0

Online thoughts of a technology funatic

Learning Git with Visual Studio #1

As the vast majority of you i use Git as source control management, and, as many of you, I use it everyday but I feel that I’m just a basic user, so when something goes wrong or I just need to do something more ‘advanced’ i get lost very easily.
Another thing that differentiates me from those geeky developers is that I don’t like using command line to interact with Git, but I prefer to use the same tool I use everyday: Visual Studio.
This series of post are nothing more that my tentative to take some basic notes of my daily Git use as basic user.
There is a lot of documentation around Git, in case you need more detailed info, at this link you will find a comprehensive guide.
The core concept I want to point out here are:

-Git is more than a simple source control system.
-Git is a decentralized and serverless.

Regarding 2nd point: It means that Git doesen’t require you to have a steady connection to a server, in fact you might even decide to not have a server at all and, in case of more developers working on the same code, they work with a local copy of the code and, when they decide to, they can sync their copies and this sync operation might lead to conflicts in case two or more developers changed the same parts of code.
When this happen, fixing all conflicts must be done manually with great attention to prevent that some code modifications got lost (more on this in following episodes)

When we create a new solution with Visual Studio, if we want to use source control with it we need to ‘add it’ to a source management system, Git in this case, since Visual Studio won’t do that automatically for us.
Before creating our first project and connect it to Git we need to install the Git plugin into Visual Studio since this won’t be installed by default, we can do this in different ways:

-At installation time
-Modifying Visual Studio Installation via Visual Studio installer

image

-Add it via Extensions and Updates menu in Visual Studio

image

Done this let’s create a new UWP application (but you can use any project type you like) and note the “Create new Git repository” checkbox

image

If we check it, the new project will be associated with Git and we can use all related functionalities, confirmed by the presence of file status icons behind each file that is part of our solution.

image

All infos related to Git are stored inside hidden .git folder at the root of our solution on disk

image

If we now close the solution, delete the .git folder and reload it, we’ll see that solution is no longer associated with a source control because icons behind the files are gone

image 

How do we connect (or reconnect) a solution to source control? easy, just right click the solution and select Add solution to source control to go back to a connected solution

image

When we associate a project to git source control Visual Studio performs several operations behind the scenes, the most evident one are the inclusion of a couples of files:

-.gitignore that contains a common list of files that don’t have to be considered by source control (e.g. binary files, log files etc)

-.gitattributes configure some git behaviors (like line endings)

We now have our brand new project and we know we can use Git source management system with it directly from Visual Studio, in the next episodes we’ll see how.

UWP Share target and COM Exception 0×80004002

Goal was very simple initially: Implement a share target inside a UWP application that, when activated, just adds a new entry inside a pre-populated ObservableCollection.
Sound easy right? It doesn’t, and I spent the entire morning fighting against this exception

image

Let’s see how I solved it.
Download Share Source and Target solution from here I won’t go into code detail because if you need to learn how implement both share source and target you can find a detailed description from Microsoft documentation here:

-Share Source
-Share Target

Let’s dig into critical part of the code:

What shared target does is to load an item into an observable collection:

and this is the code that gets invoked when share operation is invoked

In line 9 we add a new item into shared observable collection and the code fails with an InvalidCastException.
I’m used that when those crazy exception raise most of the times they come from threading issues, in fact share operation is invoked on a secondary thread so my next take has been to marshal the operation this way:

but in this case the dispatched action it doesn’t even get invoked, probably because the main message pump is blocked, nice…

So I tried another way, using Windows.Current’s dispatcher

and in this case action is invoked, but… same error Sad smile probably because the dispatcher is the same as the one used to create the main application window.
I was totally lost now since, while I’ve found many other developers struggling with this, no one posted a working solution (and this lead to the reason of this post) but, don’t know how, I remembered that there’s another way to access a dispatcher and is via CoreApplication class

And… YES, It works! Smile
I honestly don’t know what happens behind the scenes, but frankly, didn’t expected this apparently easy task to turn into a semi nightmare, but glad, with some luck honestly, I won over it.

Trace application flow easily

UWP applications are compiled using .NET Native compiler as detailed here.
This process gives many advantages over JIT compilation:

  • -Up to 60% performance improvement on cold startup times
  • -Up to 40% performance improvement on warm startup times
  • -Less memory consumption of your app when compiled natively
  • -No dependencies on the desktop .NET Runtime installed on the system
  • -Since your app is compiled natively, you get the performance benefits associated with native code (think C++ performance)
  • -You can still take advantage of the industry-leading C# or VB programming languages, and the tools associated with them
  • -You can continue to use the comprehensive and consistent programming model available with .NET– with extensive APIs to write business logic, built-in memory management, and exception handling.

This brings a side effect:  Since app is compiled natively and logged StackTrace information is lost resulting in a series of meaningless series of entries like:

SharedLibrary!<BaseAddress>+0x38449f at
SharedLibrary!<BaseAddress>+0x3842cd Exception_EndOfInnerExceptionStack at
SharedLibrary!<BaseAddress>+0×384405 at
SharedLibrary!<BaseAddress>+0x3bd80d at
SharedLibrary!<BaseAddress>+0x3c1f45 at

that tells you nothing about what happened until reported exception, so the only real solution is to keep track of your workflow using custom made logging like:

but this is absolutely tedious and repetitive, so we can simplify it using a good old C# trip based on coupling using keyword and IDisposable.

Let’s create a TraceSession class this way

With this class we can log any part of our code this way:

Much more easier and readable since all you have to do is essentially to write your code inside using block,  if you paired this with a Visual Studio code snippet that generates initial code skeleton implementation becomes nearly invisible.

Consume Google API from UWP

I’m writing this post so that you don’t have to spend too much time as I did to figure how to authenticate and invoke Google APIs from a UWP application.
I found several solutions, mostly outdated, and tons of quite articulated documentation, including the official one from Google, all discussing about the same few APIs, but i got no chance to have it working, until I got to this solution.

So, Lets’s go!

As initial step we need to register our app into Google developer portal, registration will return us a couple of fundamentals info: Client Key and Client Secret.
Navigate to console.developer.google.com , login and select Credentials under APIs and Services on the left side of the portal.

image

click on Create credentials and select the oAuthClientID, you will be promped with a similar screen

image

Required information are, Application Type, Name and Redirect (you can use whatever Uri you want here), when done click Create, this will generate the mandatory Client ID and Client secret info.

image

Download the code from https://github.com/corradocavalli/GoogleLogin2/ the sample shows you how to reried logged user informations like name, email, picture…

If you analyze the code you’ll note that we use Xamarin Auth library for all oAuth2 stuff…

image

and basically the procedure is divided onto three main steps:

1) Get the Google auth token

2) Get oAuth2 token

3) Call Google API passing the oAuth2 token, in our case we retrieve user info, but you can use any API you prefer

There’s not too much to add but the fact that I’ve lost many hours trying to figure out how to make this basic sample working and I agree that using a library, maybe the official one from Google, would be better, but despite several attempts I was not able to make it working on UWP since looks like that some core parts related to authorization are not there yet.

Hope this saved you some headaches Smile

Lottie animations in UWP

Lottie is a library created by Airbnb team that parses animation created using Adobe’s After Effects and exported as json file using Bodymovin plugin.
The library was targeting iOS ,Android and React native initially, but thanks to the hard work of community developers a version for Xamarin and UWP is now also available.

If you don’t have any ready-made animation you can get some (and contribute as well) from LottieFiles large repository.

Note: LottieUWP supports Windows Build 10586+ (November Update) and above

Showing a ‘Lottie’ animation in a UWP application is fairly easy.

-Create a blank UWP application

-Include LottieUWP nuget package (don’t forget to check Include prerelease flag to see it) 

Capture1

-Include one or more .json file (your own or one downloaded from LottieFiles) representing the animations you want to play and, important, change Build Action to Content

Capture

-Add a LottieAnimationView control where you want the animation to appear, as example inside MainPage.Xaml

If you run the app you will see your animation playing endlessly Smile

lottie1

You can load an animation programmatically using different options, the most common one is probably via the SetAnimationAsync method that also allows you to provide a caching strategy optimization parameter that allows parsed and loaded animation to be cached for reuse.

Adding these lines into MainPage.xaml.cs constructor generates this output

lottie2

If you want to have even more control, you can subscribe AnimatorUpdated event and inside event handler control the entire animation, in this example I make the animation play faster in the seconf half.

lottie3

Cool isn’t it? Winking smile

There’s not to much interesting to say about it, if you want more details you can check these links:

-LottieUWP github repository

-#ifDef LottieUWP video on channel 9

Go animating!

How to get Skype ‘classic’ on Windows 10

skype_PNG31

If you navigate to Skype website from a Windows 10 machine look like there’s not way to download the so called “classic” version, you are redirected to the Windows Store.
I still prefer the classic one so I’ve found the direct link to the ‘classic’ version http://bit.ly/skypeclassic but if then you the run the installer you will get this sad message:

image

To, solve it, right click the installer file and select Properties, navigate to Compatibility tab, select Windows 8 and click Apply

image

And you’re done Smile

image

Happy ‘classic’ Skyping Winking smile

Get unique Device Id and Application Id in UWP applications

Sometime you need to get a unique application identifier for your app together with a unique device id for internal processing.

Here’s the code you need:

A note regarding device identifier

As you might see from the involved API name SystemIdentification.GetSystemIdForPublisher() the returned value is unique for the same app publisher, if publisher changes the value changes as well.

Here are the Device Id characteristics

  • -Unique for each system
  • -On any particular system, all apps by the same publisher will get the same value for this ID (for all users). Conversely, apps by different publishers on the same system will obtain different IDs.
  • -Can be created offline
  • -Persists across restarts, reinstalls and upgrades of Windows, including clean installs (please see below for exceptions)
  • -Persists across most hardware modifications
  • -Available in OneCore

Playing with ParallaxView

Those of you who have some Windows Phone development experience will remember the Panorama control for sure.
Control had a nice effect where background content was moving slowly below foreground, this effects is named Parallax and you’ll be glad to know that, starting from Fall Creators Update you can have this effects easily back into your own UWP applications, thanks to ParallaxView parte of the new Fluid Design System.

Let’s see it in action:

Create a new UWP application targeting Fall Creators Update (unfortunately ParallaxView is not available on older platforms)

image_thumb1

let’s now add the ParallaxView to MainPage.Xaml

ParallaxView has a Child property that is used to represent the content that is scrolled slowly, in this case I defined it directly inside the ParallaxView.
The key property is Source that you can bind to an element that can be a ScrollViewer or an element that contains a ScrollViewer like a ListView or a RichTextBox. (Note: I tried to nest ListView definition directly inside ParallaxView but seems not to work)
Nothing special to mention about ListBox apart tha:

  1. -I used the ‘new’ PersonPicture control
  2. -The ListView must be placed after the ParallaxView definition, otherwise it wont work

Codebehind is quite straighforward:

The control supports both Verticaland and Horizontal scrolling and the most important property is probably Vertical/HorizontalShift that govers ‘how fast’ background scrolls, chose the one the best fits for you.
Using Vertical/HorizontalStartOffset it is possible to fine tune background scrolling behavior (play with them…)

Here’s final result, what do you think? Smile

parallax

Save Win2D CanvasControl content

Win2D is an easy-to-use Windows Runtime API for immediate mode 2D graphics rendering with GPU acceleration that is very helpful in some situations like real time or layered rendering.
This post is about how to save dynamically rendered content to a file for further external processing.

To give you an idea, let’s build a quick Win2D sample.

Create a blank new UWP project and add a NuGet reference to Win2D package

image

on MainPage.Xaml add following XAML

and this code on relative codebehind

if you now run the sample and change the value of the slider you will see the rectangle moving this way

cb

From the code is evident that each time the value of the slider changes we invalidate the CanvasControl so that OnDraw method gets called and content is redrawn with the new rectangle position.

To save CanvasControl content we basically need to draw actual content into an offscreen render target and use the SaveAsync method to get the stream content.
Here’s the code:

code just draws the same content into a CanvasRenderTarget representing the offscreen renderer and then gets that stream, the remaining code just saves it into a StorageFile.
Off course what’s drawn into offscreen renderer is up to you (as example you might add a watermark) and output format can be changed via CanvasFormatBitmap parameter.

HTH

Fix Xamarin Form compilation errors

I’ve recentily repaved my development machine and installed Visual Studio 2017 adding nearly all features including, of course, Xamarin and all subsequent updates.
Today I’ve tried to create a blank new Xamarin Forms project targeting .Net Standard for the common part but as soon as I tried to compile it I got a strange sequence of errors on Android project:

error APT0000: 1: error: Error retrieving parent for item: No resource found that matches the given name ‘Theme.AppCompat.Light.Dark
error APT0000: 2: error: Error: No resource found that matches the given name: attr ‘colorAccent’.
error APT0000: 1: error: Error: No resource found that matches the given name: attr ‘colorPrimary’.
error APT0000: 1: error: Error: No resource found that matches the given name: attr ‘colorPrimaryDark’.
error APT0000: 1: error: Error: No resource found that matches the given name: attr ‘windowActionBar’.
error APT0000: 3: error: Error: No resource found that matches the given name: attr ‘windowActionModeOverlay’.
error APT0000: 1: error: Error: No resource found that matches the given name: attr ‘windowNoTitle’.
error APT0000: 3: error: Error retrieving parent for item: No resource found that matches the given name ‘Theme.AppCompat.Light.Dial
error APT0000: 3: error: Error: No resource found that matches the given name: attr ‘colorAccent’.

Totally nonsense for me.
After a chat with my friend Laurent we’ve discovered that problem depends on missing installation of Android SDK 24 (Nugat 7.0) after installing it using the new SDK Manager (via Tools->Android->Android SDK manager) problem was gone.

Cause probably depends on referenced packaged used in default templates that no longer support Android Marshmallow (6.0) the version that gets installed by default by Visual Studio.

« Newer PostsOlder Posts »