Tag: C#

Returning to C and C++

Since the start of my third year of my Computer Science degree I have not really done much C or C++ programming. My primary programming language at the moment is Java and on the side I am doing some C# work. C++ was the very first programming language that I learnt by myself and during my bachelor’s degree it was the first language along with C that I was taught. There is some stuff that I really like and there is some stuff *cough* pointers *cough* that really annoy me.

With a fairly new laptop (my Surface Book 2), I thought it might be worthwhile to get back into some C and C++ programming. Java and C# are great programming languages but sometimes it is good to go back to your roots and program in a language that is significantly more low level. The attention to detail and level of understanding is significantly higher in C and C++, than Java and C#. If I ever start to feel lazy while programming in Java or C# I think back to how difficult it was to implement some things in C or C++.

I have Visual Studio 2017 installed on my Surface Book 2, but what I really want to do in C and C++ does not require the overhead for the projects that come with using Visual Studio. So instead I am going to use Cygwin (gcc and g++) instead. If you want to use Visual Studio then that is fine but to help others I am going to go into detail about setting up Cygwin so that you can run the gcc and g++ commands to compile and build your C and C++ programs.

Cygwin

Just like on the Cygwin web page “Get that Linux feeling – on Windows“, installing, configuring and using Cygwin is super easy. You can download the 32 or b4 bit versions of Cygwin at the following location. I am going to go over the installation and customization so that you can easily compile and build your C and C++ applications.

Installation Wizard

Once you have downloaded the relevant executable for your OS, run your executable. You should be presented with an installation wizard. Just follow the installation wizard. I used the default settings for the installation. I didn’t change anything and I suggest that you don’t either unless there is a specific reason to. All the paths and command line information presented below assumes the default information.

Note: When you are presented with the following screen on the installation wizard, ignore selecting any package and just press the “Next >“ button. We will be using command prompt to get the necessary gcc and g++ packages.

Cygwin Installation Wizard Select Packages

Continue with the installation wizard and let the dependency download commence. Depending on your download speeds it may take some time to download all the necessary dependencies.

Package Installation

Now one of the very most important components for getting a compiler working outside of using an IDE like Visual Studio is making sure that you have the necessary packages. Open Command Prompt and enter the following in the command line:

setup-x86_64.exe -q -P wget -P gcc-g++ -P make -P diffutils -P libmpfr-devel -P libgmp-devel -P libmpc-devel

Note: The location of the executable was placed in my Download folder and the command was executed from that directory after I navigated to it.

After you have executed the command, the Cygwin setup should relaunch and it should proceed with the download and installation of the packages that were listed in the command line.

Verification

That is it 🙂

The compiler is installed and you can verify this by launching the Cygwin Terminal and entering in the command:

gcc --version

or

g++ --version

You should see the following displayed on the terminal. The versions of the compilers may be different depending when you install Cygwin and/or if you manually update to an even later version of the compiler (this has not been done here).

Cygwin Terminal Compi;er Versions

To test the compiler out (I’ll be testing the C++ compiler here) we can create a very simple C++ application and use the g++ compiler. The very first C++ program that I ever wrote was a simple Hello World program. What better way to test the installation of the g++ compiler than to use that simple C++ program. Below is the sample code in case you want to start learning C++ and/or you just want to quickly test your compiler but not actually write any code yourself.

#include <iostream>

using namespace std;

int main() {
    cout << "Hello World!" << endl;
    cin.get();
    return 0;
}

Save the above code as HelloWorld.cpp or use your own piece of C++ code and place it in the location of your Cygwin home user directory. By default it should be under C drive, ie. C:\cygwin64\home\<username>.

To compile the C++ code all you need to do is run the following command in the Cygwin Terminal:

g++ HelloWorld.cpp -o HelloWorld

What this will do is create an executable that is called “HelloWorld.exe” that you can then run from either the terminal or straight from the Windows Explorer. If you run the above piece of code in the Cygwin Terminal then the output should match exactly what is shown below; note that the program is waiting on user input before it terminates.

Cpp HelloWorld Terminal Compile And Run

There you go. You now have a Linux like C and C++ compiler installed on Windows and you do not need to have an IDE to compile and build your C or C++ projects. Hopefully this little guide and my desire to go back to C/C++ has fueled your own fire. Enjoy!

UWP: Dynamic UI 1/2

If you are new to C#/UWP programming then one of the furthest things that may have crossed your mind is a UI that is dynamic and fluid based on the screen size or the device form factor your application is running on. However this concept is very important and is super easy to implement. So I thought I might do a little write up about this and help some people out. I know I may not have all the information presented here but I would like this to be a starting point that others can build on and hopefully this post is useful to some.

When I first started working on developing UWP applications I tried to have the core functionality working for a desktop PC, i.e. anything from a 12” screen sized device and up; and I did not really consider other form factors like mobile devices or the HoloLens. But the more I work on UWP applications and how simple it is to implement this functionality I ask myself, why not consider it up front? Microsoft actually has some really useful information and even provides a worthwhile example, see here. Plus there are numerous StackOverflow questions with answers and blogs/articles that discuss this exact topic. So now when I work on any UWP application I consider what UI elements need to be placed where for the various form factors and screen sizes.

If you use the link provided above then it will already place you to the correct spot in the article that outlines how to modify the UI layout based on screen sizes/form factors. The method to have your UI change based on your form factor or screen size I will be discussing is the use of Setters, StateTriggers, and AdaptiveTriggers.

Setters, StateTriggers and AdaptiveTriggers

Some of the advantages of using the new Setters designed for Windows 10 over the Storyboards that you would have had to previously use are:

  1. No more GoToState method call in your code: there is no C# code that needs to be written when using the new Setters; your application will dynamically change layouts when the state condition is met.
  2. Cleaner XAML Code: syntactically the XAML for using the Setters is cleaner and easier to read. The Storyboard objects could sometimes get very complex and large I found.
  3. No empty DefaultState: the properties in your XAML outside the Setters appear as your default properties and the Setter values will not be triggered until the state condition is met. You do not need to define an empty DefaultState.

Using the Setters, StateTriggers, and AdaptiveTriggers are extremely easy as well. The Microsoft article provides a solid example but I am going to provide two more for reference. In the first example I will showcase the change in font size when the screen changes size, and the second example will showcase rearranging of TextBlock objects when changing screen sizes and on a small form factor device like a mobile.

Example 1: TextBlock Font Size Change

This was actually one of my very first attempts to have the UI dynamically change with a changing screen size and form factor. Below is the XAML code that I wrote to get the font size to change for a TextBlock object that is displayed to the user; some of the unnecessary XAML code has been omitted.

<Page>
  <ScrollViewer>
    <VisualStateManager.VisualStateGroup>
      <VisualStateGroup>
        <VisualState>
          <VisualState.StateTriggers>
            <AdaptiveTrigger MinWindowWidth="720"/>
          </VisualState.StateTriggers>
          <VisualState.Setters>
            <Setter Target="TitleTextBlock.FontSize" Value="24"/>
          <VisualState.Setters>        
        <VisualState>
      </VisualStateGroup>
    </VisualStateManager.VisualStateGroup>
  </ScrollViewer>
  <Grid>
    ...
    <TextBlock Name="TitleTextBlock" Text="Bill" FontSize="12"/>
    ...
  </Grid>
</Page>

As you can see the amount of XAML that needs to actually be written is fairly minimal. How does the StateTrigger actually work? The AdaptiveTrigger object defined specifies that if the screen size is more than 720 pixels (that is the state condition) then the TextBlock object will have the font size set to 24; however if the screen size is less than 720 pixels the TextBlock object will have the font size set to 12. This can be seen working below (using the exact XAML code above).

DynamicUIFontSizeChange
Example 1: Dynamic UI TextBlock Font Size Change

My next example will be in a follow up blog post, so stay tuned for another post real soon about Dynamic UI. That one I feel is more important and relevant as it moves UI objects around to ensure an optimal layout for a change in screen size and what it looks like on a mobile device.

%d bloggers like this: