Monday, January 15, 2018

Emulators for Windows 10

If you do not have a Windows 10 device (say, Windows 10 Mobile) you can use a Windows 10 Emulator instead. There are various versions for Windows 10 as well as for even earlier Windows versions.

Here are the ones for Windows 10:

10.1.15254.1


10.1.15063.137


10.1.14393.0


10.1.10586.11


10.0.26624.0


You may download them from this site here.


Tuesday, January 9, 2018

Deploying a Universal Windows Project to Lumia 950

We will be using the Lumia 950 as the connected device and it has been set to Developer Mode as described earlier.

We start with the HelloWorld Universal Windows Project(UWP) that has been tested to run without errors on the Local Machine as described here.

Open the project in Visual Studio 2017 as shown.



LumiaDeploy_0 and LumiaDeploy_7

Build (Using Menu Build and its context menu) the Project and verify it is successful.
--------
1>------ Build started: Project: HelloWorld, Configuration: Debug x86 ------
1>  HelloWorld -> C:\Users\Owner\source\repos\HelloWorld\HelloWorld\bin\x86\Debug\HelloWorld.exe
========== Build: 1 succeeded, 0 failed, 0 up-to-date, 0 skipped =====
------------------

Click Local Machine along Debug as shown.


LumiaDeploy_1

Pick Device from the list, the display changes as shown.



LumiaDeploy_2

Connect your Windows 10 Mobile(Lumia 950) to one of the USB ports.


This will result in an error as it is not x64 architecture.
LumiaDeploy_9

Pick ARM from the list.

Click Configuration Manager... to display the Configuration Manager window as shown.


LumiaDeploy_4

Make sure configuration is as shown above.

Click Build and from drop-down click Deploy.


Deploy succeeds and you should see the HelloWorld app appears in the apps list.

Here are the deployed apps.


 After clicking the 'Hello' button.



Monday, January 8, 2018

Deploying to Windows 10 Mobile: Phone Settings

I deploy my UWP apps to Microsoft Lumia 950. One of the first things you need to do is to set it for Developers.

There are three options and you should choose Developer mode as shown here:


Lumia950_0

You should turm on option to make your phone visible to USB connections to your local network as shown here:


Lumia950_1

Also turn on remote diagnostics over USB and authentication as shown above.


Lumia950_2

Now you can connect the Windows 10 Mobile(=Lumia 950) to one of the USB connections on your laptop/computer where you are running Visual Studio 2017 used for creating Universal Windows Projects. You set up your project deploying it to the device.

Here are my phone details:
Microsoft Lumia 950
Version 1709
Windows 10 Mobile
OS Build:10.0.15254.124
Screen Res: 1440x2560

Here is HelloWorld deployed to Lumia950


Lumia950_3

Click Event to change Background color of a Button using VS 2017

Sometimes you need to change the background color from its default to a different color. Let us say, we have a button whose Background color needs changing by an event such as the CLICK event.

How is it done?
Well, I could give you a line of code to do that. Perhaps it will work and all that there is to it. However, if you are beginner and wondering how the hell it is coded with so much of background code, namespaces; classes, methods, events etc.

This post tries to show how you may find yourselves how to do it.

If you are looking for the one line of code, please go to the end and you will find it there. If you are beginning to code and new to Microsoft; new to Visual Studio in particular, follow on.

As mentioned in my previous post Universal Windows Project use XAML for the UI and the pages.
Some of the things you should remember is that you should use intellisense as much as possible. You should also use code hints you get when your code is not doing what you except.

In order to illustrate let us start with the code for a BUTTON click event for a button named ClickMe as shown:
=========
public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }
    
        private void ClickMe_Click(object sender, RoutedEventArgs e)
        {
            ClickMe.FontSize = 50;
           
        }
    }
}
===============

The above code changes the font-size to 50 when the button is clicked. We add one more line which changes the BACKGROUND color to red.

Start with ClickMe (the object) by typing below ClickMe in the above code.

As soon as you typein Click you will see this:


ClickMeEvent_0

Pick ClickMe from the above and add a period to it after that and you will get more pop-up as shown.


ClickMeEvent_1

Pick Background and your code looks like this:


ClickMeEvent_3

You try the 'dot trick' again by typing a dot after Background as shown. You do get a pop-up which does not seem to have anything to do with color.


ClickMeEvent_4

Now you need to know that color is given by using a brush and you have an Object called SolidColorBrush besides other kinds.


ClickMeEvent_5

Now you type in SolidColorBrush but you get the red wiggly (oops, something not right).


ClickMeEvent_6

You place your cursor on SolidColorBrush and you get a hint. SolidColorBrush is a class name and you are looking for a color value. Instead of using the class, you should use an instant of the class with the 'new' keyword as shown.


ClickMeEvent_7

The red wiggly is still there but you have made progress.

Well this gives a hint that you must follow up this with one of [], {},or ().

Let us type the parenthesis-begin as shown


ClickMeEvent_8

There are two options as shown.


ClickMeEvent_9

The first method gives no color and the second options uses one of the Windows colors.


ClickMeEvent_10.jpg

Now I use the hint from the image one previous to the above. And we continue with code as shown.


ClickMeEvent_11.jpg

Well, again we are getting the class COLOR. Place the cursor on the color and find out what is needed.

Now with the dot trick we are ahead to choose a color we want.


ClickMeEvent_12.jpg

Now we have to choose the color from inserting proper values for the arguments of the function

Let us choose a ALPHA (transparency)channel value of 255 and a RED channel value of 255, BLUE channel value 0 and Green channel vlaue of 0 as shown. Type these into FromArgb() as shown.


ClickMeEvent_14.jpg

Now we are rid of the pesky red wiggly line. Ready to rock and roll.

Build the code from the main menu and deploy it to the local machine as described in my earlier post.

The Build succeeds as shown.


ClickMeEvent_15.jpg

Now Deploy the solution and you get this result as there are no errors:
========
Deploy started: Project: HelloWorld, Configuration: Debug x86 ------
Updating the layout...
Copying files: Total <1 br="" layout...="" mb="" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;" to="">1>Checking whether required frameworks are installed...
Registering the application to run from layout...
Deployment complete (0:00:18.287). Full package name: "b940c521-2fb5-429c-9486-69bb2a425e90_1.0.0.0_x86__ckpvgz13cfhxc"

========== Build: 0 succeeded, 0 failed, 1 up-to-date, 0 skipped ==========
========== Deploy: 1 succeeded, 0 failed, 0 skipped ==========
Now run the project and you get this display of  your application
<1 br="" layout...="" mb="" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;" to="">
<1 br="" layout...="" mb="" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;" to="">
<1 br="" layout...="" mb="" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;" to="">ClickMeEvent_16

Now click the Hello button to see the Background color and font size change as shown.


ClickMeEvent_17

After verifying close the application and you get the following response:
==================
The program '[15840] HelloWorld.exe' has exited with code 1 (0x1).

That's it folks!