Guide for building C# apps on Ubuntu: Language quickies

Introduction and Background

In the last post, I talked about many things that C# programmers usually look forward to in their IDEs and environment. If you didn’t read the previous post, please read it at Guide for building C# apps on Ubuntu: MonoProject Introduction. In that post, I talked about usual features and tools that C# developers want to use while working on their projects. In yet another post, I talked about using C# for cross-platform development and technically, that post had most of the content for C# programming on cross-platform environment, but in this post I am specifically talking about the Ubuntu environment only. You may want to read that post first, so head over to “Using C# for cross-platform development” and read that post too. I think you will find that post also very much helpful.

C# programming language has already become very popular in programmers, many beginners are taught C# for their object-oriented programming lessons. The concept of object-oriented is very intuitive and understandable, and praising the .NET, it has been made very easy and simple to program an entire object-oriented project in C# to run on any device having .NET framework installed on it.

In this post, I am going to talk about the language quick help toolkit provided in MonoDevelop environment. MonoDevelop has a great toolkit for C# language help in building the small snippets of code blocks in your programs.

Helpful tools and features in MonoDevelop

Let us count the helpful items and features provided in MonoDevelop. MonoDevelop has some great tools and features, available just for language guide and help while development, but however, we will only talk about a few of them in this section as discussing them all won’t be available in this one small post of mine and I will hopefully cover those topics in the book that I am going to write later. Make sure to check that book once it gets released.

1. Language specification

Sometimes, when you are working on a project, the specification for the language is a “must have” part in your “have this” setup! I have myself found it very hard to get the project running when I forget a single piece of code or how to write this and similar things. It just happens, and you have no control over it. However, usually tools do not come with the language specification and language references and guides. MonoDevelop and Mono Project however do come shipped with the language guide for you! You can get the offline version of their documentation on your machine so that you can reference it whenever you want to.

Mono Documentation is the application that contains the references to the technical part of the language, framework and the software platform itself.

Figure 1: Mono Documentation application in the All Applications list on Ubuntu Studio.

Mono Documentation is an application package downloaded and installed while you are installing the Mono Project. This applications contains almost everything that you would ever need while programming a project on MonoDevelop IDE. The library tooling contains almost everything, a few of them can be enlisted as:

1. Mono embedding
   • JIT, Object, Reflection and other core features are listed and described here.
2. Language
   • Language references: Contains the language information, syntax and structures.
   • Exceptions and errors: Compiler errors are also listed here so that you can search for one.
3. Commands
   • Some commands for the platform itself.
4. Mono libraries
   • Of course, Mono wouldn’t run without them! They are native Mono assemblies written to make sure that your .NET code runs on the Ubuntu.

You can use this guide, you can even update this guide because Mono Project is open source and relies on help from the community. Each contribution that you make, is pushed to others! “Sharing is caring“, right? 🙂

This is just a guide, so you are going to have the same one there. But I am just going to show you a few of the pages that you would find interesting and “much wanted”.

Figure 2: Mono Embedding window open in Mono Documentation. 

These are core components and I would personally recommend that you read them out before using Mono Project for development. Having an understanding at core level is very helpful, even while programming C#!

Language specification can also be captured from this application, C# language has been greatly explained in this application. You will find the explanation for everything in C#, from objects, to strings, to classes to structs and to anything that you would find to learn about in C# and while programming an application.

Figure 3: C# language overview window opened in Mono Documentation.

However, posting an image and description of each of the page would go out of scope here and it would take a lot of time. I am not going to do that, you can surf that yourself.

2. Compile time error specification

Another main thing that C# programmers usually want to get is a compile time error specification. Of course, you can tell by the message, “Constant value 256 cannot be converted to byte“. But, the compiler error for this is, CS0031. For an intermediate programmer (like me!) that can be easily solvable, and maybe generated from the following code:

// Saving the value '256' to byte type.
byte b = 256;

We can solve that easily, by just changing the value to 255 (or less), or by changing the type to integer and so on. However, what in case when you need to get an example of the context when the errors are somewhat complex.

Remember, errors are thrown when you do not follow the rules defined when a compiler is designed and created. Compiler would always follow those rules, you need to stick to them. These documentations would have those rules defined. So, for example for our problem above, the sample error documentation is like below:

Figure 4: Compile-time error specification window open in Mono Documentation.

This page would contain many examples of the cases when you may raise this compile-time error. You can read this guide, learn what you did wrong and then solve the problem. Although most of the beginners want to ask questions, however that is not a good way of learning. At least, not in my case. I have always prefered learning by doing it wrong again. This way, I could get an idea of fixing my problems easily. This way would:

1. Give you a better idea of compiler theory; not that subject, instead the way compiler is trying to compile the code.
2. Show you other scenarios when the code goes wrong.
3. Teach you how to fix the code.
4. Give you a few other helpful resources in the code itself.

There are many other error codes discussed and shared about, you may want to find yourself some help and guidance in those guides. MSDN is a great resource for any C# programmer and you can surely find help by trying to Google for the problem and looking for an answer, but I find this method also very much helpful if you are a beginner and want to learn C# programming.

3. Toolbox support

If you have ever built applications for graphical user-interface, then you are already aware of the toolbox. A toolbox is an element that contains the most used controls ready for you to drag-and-drop or double-click to create in your application project’s currently open window. Now, what MonoDevelop has in it is that it also allows you to create code-snippets by double-clicking on the items in the toolbox. You don’t have to write the long codes yourself, you are provided with the templates for the code snippets and you can then allow MonoDevelop to create them up for you.

Just for the sake of example, have a look at this image below:

Figure 5: List of C# program structures provided in MonoDevelop Toolbox.

Now, if you have ever programmed in C#, you would know that these are all keywords and structures provided by C# to their programmers. You can chose from these and create a new structure at once. MonoDevelop would do the honor to write down the code for you.

For the sake of example, have a look at our class (this class was created in the previous post of this series, you should consider giving it a look), it doesn’t actually have a constructor so we will create a constructor using this toolbox.

Figure 6: Class without a constructor.

Once we double-click the item from the Toolbox, (ctor is constructor), our class would now have the following code: (Remember to place the cursor where you want to enter this constructor, or any other code-snippet)

Figure 7: A sample constructor in our class. 

It just added the constructor to the class… We can now refine it to look better or to add the logic that we want, MonoDevelop doesn’t know of the logic so it would just leave that to us. Maybe it is not intelligent enough. 🙂

Figure 8: A sample constructor with a comment in it.

Looks better now, doesn’t it? There are many other methods, structures, loops and even class templates that you may want to try out. I have just demonstrated the basic one, and I leave the rest to you. Try them all.

4. Unsafe code in MonoDevelop

C# is a high-level language, agreed! But it does allow developers and programmers to go in an unsafe context and work around with pointers, references and other low-level stuff that C and C++ programmers usually brag about. Well, not anymore, MonoDevelop also supports unsafe context and they can use the power of low-level and “on-demand” memory-management!

By default that is not enabled, so if would like to write something like that,

unsafe {
   // Some "unsafe" code here...
}

You will get an error when you would try to compile the code.

Figure 9: Unsafe context code with error.

You can fix that in the settings for your project. Right under the general settings, select, “Allow unsafe” and you’re good to go then.

Figure 10: Allowing the unsafe context in MonoDevelop project configuration window.

The code would now execute and run successfully (unless there are other errors in the source code that you may want to fix first!).

Figure 11: Unsafe context code compiled successfully and application runs. No code in unsafe context, just for demonstration. 

Good to this point, I guess.

5. IntelliSense in MonoDevelop

Just a quick overview of IntelliSense in MonoDevelop for C# programmers. The IntelliSense feature is very friendly feature, in MonoDevelop for C# programmers as it helps them to:

1. Write long codes, shortly.
2. Provide suggestions based on current context and the APIs and references selected.
3. Show errors and warnings.
4. Show the list of constructors available to the developers and their description.

However, basically, IntelliSense works and shows the code API suggestions, like in the case of a Console.

Figure 12: IntelliSense showing code suggestions plus the description of the suggested object (functions are also considered to be objects).

You can see how powerful this feature is. It suggests the programmers with the possible candidate for the function or object and also describes the object to them. Share the overloading of the functions and also gives a brief summary of the function. It is deemed helpful in many cases. However, most of you are already aware of these features in your own IDE as every IDE supports this feature.

Finally: A Visual Studio fan? Like me?

If you are a Visual Studio fan, then chances are that you are also not going to enjoy the default Linux look and feel of the IDE and the code structures. Trust me, I also didn’t like it and I wanted to change the look and feel of the code blocks at least because the code was really hard for me to read and understand.

Figure 13: Default code and syntax highlighting in MonoDevelop.

You can edit the settings in the Preferences window. Find the Preferences window under Edit header and then chose the syntax highlighting.

Figure 14: Opening up the Preferences in the Edit category. 

You can then find the settings for the syntax highlighting and select Visual Studio there. That would set up the code and syntax highlighting as per Visual Studio look.

This would then change the theme and you would get the same syntax highlighting as you had in Visual Studio.

Points of Interest

Well, finally I finished up this post, in which I have covered the quick and helpful material for C# programmers in MonoDevelop. Actually, there are plenty of tools and services available to C# programmers in MonoDevelop but for this short guide, I am going to write a few of them and the ones that I find handy in many cases.

I will post a few other posts discussing the features of MonoDevelop for C# programmers, and however, I will also publish a book collective of all of these features and other tips for C# programmers, soon.

Do let me know what you think is missing, or what you think I shared and you didn’t know of. Looking forward to your replies. 🙂

Printing the page

I had to go through the printing process as I got a new project from my cousin. On my way, I never ever did such a job which involved printers or hard copy format for the documents. Now that I had the job for that, I started looking up for some resources. I did know that I can use CTRL + P key command to print. But, how to integrate all that inside the HTML document, I was making up some assumptions. And this was what I got.

First thing was to print the page. So for that you can create a button element inside your HTML document and handle it using jQuery for the print event. Here is the code for that:

<button>Print</button>

/* Script part */
$('button').click(function () {
  window.print();
}

Now the browser would show a simple window, where you would get more options to control the printed version of the page. You can either set them there, or you can use the code to control the page layout even more better. What you would try here is CSS3’s Media Query.

Here is the example, lets assume we’re having a div inside the body element. Which is having the id of printable and all the other body is given the id of non-printable. Now in the CSS you were taught for the usage of Media Query.

You can use this code:

@media print {
  #printable {
    display: block;
  }
  #non-printable {
    display: none;
  }
}

That was enough here. Now you can use this code to view only the printable part of the page. Which would be helpfull to save the page and to get the desired output.

Some other tips you might need to use:

1. Always use CSS3 media query to stylize the printable version.
2. Always keep the width larger so that height of the page is less. Saves the page!
3. Always keep the note on the page by clicking the button or by Print command. To keep a note on the printed version too.
4. Keep the font-size short and easy to read.
5. Use short sentences and good punctuations. It makes the document better to be read. Less words save the space
6. Always remember to remove the margins and paddings from the body element. Printer would automatically add the margin and paddings to the page which would be enough.

CSS3 Media Queries

You are all now well aware of the usage of CSS, and how to style this all with just small amout of code. For example to add the margins to the body element you just write this

body {
   margin: 10px; /* comment: or what so ever the value */
}

Now, what CSS3 includes is a new thing, that is known as Media Query. Media is something that is being a medium in between you and the object. You’re using a Laptop, then your media is Screen, you’re reading the text on the Page in a Hard Copy form. Your media is Printed page.

It is just what is providing you with the facility to read the information that has to be sent to you.

Using CSS3, you can manage to style the document according to the Media the user would have access to. For example some people would have wide screen monitors (well LDCs in today’s world) and some would be using Mobile Phones, all of these are Screens but have different screen sizes. You can use the code to check for them.

@media type and (anyparam: value) {
   /* all the CSS properties you want to alter for different objects */
}

Using this code, you can change the properties of the objects depending on the media that is being used and the properties of the media. Please note you can only get the properties for the screen as you won’t be able to get the properties of a paper like how much wide it is or how much height it has.

Lets begin the coding

Ok, first of all we try to add a background-color, margin, color, text-decoration to the body element. We use this:

body {
  background-color: rgba(255, 0, 0, .2); /* red and a slightly visible */
  margin: 10px; /* 10 pixels margin to all the sides */
  color: #f00; /* red colored text */
  text-decoration: underline;
}

Now if we want the user on a mobile device to be able to see the text clearly as there was no style, and the margins should go away. We can do that using CSS3 media query. Have a look at the stuff below:

@media only screen and (max-width: 500px) { 
   /* for screened media with screen size only 500px */
   background-color: transparent;
   color: #fff; /* white */
   margin: 0; /* none */
   text-decoration: none;
}

If we add this code to the end of the CSS file, we will see that if the screen size if just 500px (a mobile device off course) then the website would lack all of the features and styles that were visible to the desktop version of the website such as background color, color of the text, margins, text decoration of the underline etc. Now, there is another thing about the printed copy too. CSS3 allows us to change the properties for the copy of our document that would be in the printed form. Have a look below:

@media print {
   /* note that the paper won't provide its dimensions */
   background-color: rgba(0, 0, 255, .2); /* blue but slightly visible */
   color: #00f;
   margins: 2px; /* 2px margin around the sides */
   text-decoration: italic; /* same as the italic */
}

Now, go ahead and print the page, using the above code you will see that the document that was in desktop mode, was never the same as it is in the printed form, and you’ll be like what the… How did that all go so different?

That is because of the CSS3 Media Query. In this you can change the view of the HTML document for every different media, and the properties of the media. You can change the view of the document if the screen size is not enought then you can hide some of the elements or lessen down the size of all the elements to fill the elements in the screen, if the user’s screen is very short, then you can try to change the layout using the media query. And if you want the user to get a whole new design while he prints the copy, then use

@media print {
  /* all the css properties that are to be used, would be here */
}

Viola! You just changed the look of the document. Go ahead give it a try!