Less Used Properties in WinRT – Boredom Challenge Day 23

Standard

In my previous article, I’ve talked about some XAML controls which I never needed to use or learn what they are for. In this article, I’ll continue this concept and write about the Properties in WinRT (or .NET, in general) that I didn’t need to use, not even once in years, and how they work.

A glance of our Properties panel.

A glance of our Properties panel.

1) UIElement.AllowDrop Property

As the name suggests, this property allows our UIElement to be a target of a drag and drop operation. However, this property only defines that it can be a drop target, so we’d need to implement this dragging feature ourselves. (If you would like to learn how we can do this, take a look at this article.)

2) UIElement.CacheMode Property

The definition of CacheMode property says that CacheMode value indicates if rendered content should be cached as a composite bitmap when possible. The practical meaning of this is that, if we set a cache mode, the rendering operations from RenderTransform and Opacity properties will be executed on the GPU.

Apparently, this is an advanced feature for complex UIs to gain performance.

➤ Read on to see the full list of less used properties

Advertisements

Less Used XAML Controls in WinRT and What They Do – Boredom Challenge Day 22

Standard

I’ve developed apps for desktop (using WPF and Silverlight), Windows Phone and WinRT for about 3 years now, and one thing that I’ve noticed is that there are some XAML controls which I never needed to use and have no idea what they are for. So, today I’ve decided to search around and play with those controls to find out what their purposes are. 🙂

A glance of our Toolbox.

A glance of our Toolbox.

In this article, we’ll look around the Toolbox for controls in WinRT that are not so commonly used and see what they are used for and how they work.

Note: I’m writing this article from my point of view (says Captain Obvious). I mean, some of them may not be “less used” for you; I may not just needed to use them so far.

1) Pointer

You see that at the top of each and every tab in Toolbox, there is an item called Pointer. However, if you try to drag and drop it to the Designer it won’t work, and you can’t just add a Pointer control to the xaml code like <Pointer/>. Well, this is because Pointer isn’t a control. 🙂

Pointer is used in the following scenario: Assume you’re going to add a control to your app, like a Button. You select the Button in the Toolbox, and instead of dragging it to the designer, you wish to click on a location on the designer to add the button there. However, halfway through, you change your mind and wish to select something else on the designer, but you can’t click anywhere or you would add a Button. So, you go to the Toolbox and select Pointer instead, and return to the designer and select whatever you wish.

This is what Pointer is for: It allows you to clear your current Toolbox selection. 🙂

➤ Read on to see the full list of less used controls

Tip: “Path” Control in XAML – Boredom Challenge Day 21

Standard

The default controls in Visual Studio for WPF, Windows Phone and WinRT contain a XAML control called Path, which allows us to display simple shapes and drawings in our apps. The advantage of using it comes from the fact that it uses vectoral graphics, which provides us flexibility in several situations, the most prominent of which is, of course, resizing.

What it does is mix parts of different shapes together via a special markup syntax.

What it does is mixing parts of different shapes together via a special markup syntax.

For example, the above Skype logo is a Path object, which looks like the following in our XAML code:

        <Path Stretch="Uniform" UseLayoutRounding="False" Fill="White" Height="50" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="145,100,0,0" Data="F1 M 15.364,15.168C 14.9453,15.7707 14.3307,16.2427 13.5267,16.5813C 12.7213,16.9186 11.7707,17.088 10.6693,17.088C 9.35334,17.088 8.26267,16.86 7.4,16.3933C 6.79067,16.06 6.29467,15.612 5.91334,15.0546C 5.52801,14.4973 5.33601,13.9507 5.33601,13.4173C 5.33601,13.1027 5.45467,12.8306 5.68934,12.6066C 5.92533,12.3826 6.228,12.2693 6.58801,12.2693C 6.88267,12.2693 7.13334,12.36 7.33734,12.5333C 7.54134,12.708 7.71334,12.964 7.85334,13.3C 8.02001,13.688 8.20267,14.0133 8.39468,14.276C 8.58801,14.5293 8.86001,14.744 9.21201,14.9133C 9.55868,15.0813 10.02,15.164 10.5973,15.164C 11.388,15.164 12.028,14.9933 12.5173,14.656C 13.008,14.316 13.244,13.9013 13.244,13.4C 13.244,13.0014 13.116,12.684 12.856,12.436C 12.5933,12.1867 12.2533,11.996 11.8307,11.8627C 11.4067,11.728 10.8373,11.5853 10.124,11.436C 9.16801,11.2267 8.36667,10.9827 7.71734,10.704C 7.06667,10.4226 6.55067,10.04 6.16801,9.55463C 5.78268,9.06666 5.592,8.45866 5.592,7.74C 5.592,7.05335 5.79333,6.43732 6.2,5.904C 6.604,5.36933 7.18668,4.95866 7.952,4.672C 8.71334,4.38667 9.60934,4.24403 10.6333,4.24403C 11.4533,4.24403 12.164,4.33866 12.764,4.52799C 13.364,4.72001 13.8613,4.97065 14.2627,5.284C 14.6587,5.60001 14.9493,5.92933 15.1373,6.27869C 15.3227,6.628 15.4133,6.97065 15.4133,7.30134C 15.4133,7.61066 15.2933,7.89066 15.06,8.13734C 14.828,8.38264 14.528,8.508 14.1787,8.508C 13.864,8.508 13.6187,8.43464 13.4453,8.27998C 13.2787,8.13334 13.104,7.896 12.916,7.56666C 12.676,7.10401 12.3907,6.74799 12.0573,6.49198C 11.7307,6.24 11.1947,6.10932 10.452,6.11066C 9.76267,6.11066 9.21201,6.25065 8.79467,6.52665C 8.37467,6.80668 8.17467,7.13065 8.17467,7.51066C 8.17467,7.75065 8.24401,7.95069 8.38267,8.12397C 8.52001,8.29731 8.71734,8.44666 8.96667,8.57331C 9.21734,8.70267 9.47334,8.80399 9.728,8.87333C 9.98934,8.94666 10.4173,9.05335 11.0147,9.19465C 11.7653,9.35465 12.4453,9.53602 13.0573,9.73331C 13.6667,9.92933 14.1867,10.1693 14.616,10.4533C 15.0493,10.736 15.388,11.096 15.6293,11.5333C 15.872,11.9706 15.9947,12.5027 15.9947,13.1307C 15.9947,13.8867 15.7827,14.5667 15.364,15.168 Z M 20.4413,12.2106C 20.52,11.708 20.5613,11.1933 20.5613,10.6667C 20.5613,5.19999 16.132,0.769325 10.664,0.769325C 10.14,0.769325 9.624,0.812019 9.11868,0.890663C 8.20801,0.326668 7.13201,7.62939e-006 5.97867,7.62939e-006C 2.676,7.62939e-006 0,2.67731 0,5.98133C 0,7.13468 0.32534,8.20936 0.890678,9.12269C 0.810669,9.628 0.768005,10.14 0.768005,10.6667C 0.768005,16.1333 5.2,20.564 10.664,20.564C 11.1893,20.564 11.7053,20.524 12.2107,20.444C 13.1213,21.0067 14.1973,21.3333 15.3507,21.3333C 18.656,21.3333 21.3333,18.656 21.3333,15.3533C 21.3333,14.2 21.004,13.1253 20.4413,12.2106 Z "/>

The extremely long string value in the Data property of the Path object is how our shape is defined; meaning, it is the mathematical calculation. We can find many icons and symbols for Path control on the internet (I usually use http://www.thexamlproject.com, which contains hundreds of them). However, if you are interested in how you can create them yourself, Blend can import Adobe Illustrator files, so could draw them in Adobe Illustrator and import them to your project via Blend. And if you wonder how the syntax works, this article might be a good place to start.

Now, you might be saying “Why bother with this when I can just use images?”. Well, there are a few specific situations where using a Path has advantages.

➤ Read on to see when we should use a Path instead of an Image

Tip: Using Code Snippets in Visual Studio – Boredom Challenge Day 20

Standard

Code Snippets feature of Visual Studio allows us to save pieces of code in snippet files, and then easily put them to our projects with the press of a few shortcut keys. This is useful if there is a specific code that you have to use again and again in different projects (for example, the code that handles Facebook login), so instead of writing it each and everytime (or opening another project and then pasting from there) we can just use the code snippet. This is also useful if you are giving presentations about a technical topic since you can prepare the code you’ll use beforehand and don’t bother to write them from scratch during the presentation.

If you have Visual Studio open now, try it yourself: Press Ctrl+K, X; then select a snippet and press enter. The related code will be automatically added to that line.

1

Under “Documents\Visual Studio 2012\Code Snippets” folder, you’ll see that there are folders for different programming languages, each with a My Code Snippets subfolder where you can put your custom code snippets. If you also wish, you can go to Tools -> Code Snippet Manager in Visual Studio and add other code snippet folders.

2

3

➤ Read on if you wish to learn how we can make our own code snippets

Making Simple Windows Store Games in XAML – Boredom Challenge Day 19

Standard

If you wish to develop games for Windows 8, you’ll need to learn how to use Direct3D, HTML5 or a game engine that supports Windows 8 (like Unity or Construct2). Since XNA is not supported in Windows Store apps (and also since Microsoft has announced XNA will be discontinued), if you were using only XNA (like me) and you didn’t have enough time to learn the technologies I’ve listed, you may end up wondering how to create a game without you requiring to learn something entirely new.

If that is the case, you’ve found your easy solution. As long as the game is simple (don’t expect to put a physics engine or 3d models in there), we can use XAML’s features (like animations) and add the game logic to the codebehind files for a simple game.

Don't expect something like Angry Birds, but I bet we could make a side-scrolling platformer.

It may not be something like Angry Birds, but I bet we could make something enjoyable.

In this article, we’ll make an example game called… Catch the Cage!, starring Nicolas Cage. 😛 It will be a classic game where you tap the ball on the screen to keep it from falling out of the screen. Here’s a screenshot to whet your appetite. 🙂

2

➤ After this masterpiece, you won’t even bother to look at Angry Birds

Using Microsoft Advertising SDK in Windows Store Apps – Boredom Challenge Day 18

Standard

The main reason for developing software is, of course, earning money. 🙂 For desktop applications, the most common way of monetization is directly purchasing a license – the user pays a specific sum and gets to use the software. In the case of mobile development however, apps need to be very addictive or very useful, and overall need a lot of effort put into them to be successfully sold directly for a price. Another aspect of mobile apps is that paying for applications is usually a new (and alien) concept for many mobile users, and you can guess that they don’t like it much (I’ve seen many cases where a user gives bad ratings to a quite good game priced at a few dollars, just because it wasn’t free).

Click the image and view it in full size. You'll see that nearly all of the top "paid" apps are games, and they require a lot of effort to develop.

Click the image and view it in full size. You’ll see that “paid” apps require a lot of work to be successful (most of them are games, too).

This situation has resulted in alternative monetization techniques for mobile apps. One of them was adding trial versions which gave the users a taste of the app, and told them to buy it if they liked it. Another was to make the app free but to add in-app purchases such as removing limits or adding new items, characters or levels. And the final one was to put ads to gain revenue, either by making the app free and using ads as the main funding source, or making two versions of the app (a free version with (usually annoying) ads and a paid version without them).

In this article, we’ll see how we can go with using ads, and we’ll create an example Windows Store app that uses them. For this purpose, we have Microsoft Advertising SDK (for Windows Phone and Windows 8), that makes it very easy for us to include ads in our apps (with nice features such as using location to show more relevant ads). Now, I haven’t seen anyone who likes ads, but they are actually quite effective if used correctly, especially if your app has a high usage value (that is, if users would not just open your app once and don’t touch it ever again). This way, you can actually have a slow and steady income.

➤ This article has been sponsored by Nescafe and Visual Studio (no, not really)

Storing User Credentials Securely in Windows Store Apps – Boredom Challenge Day 17

Standard

It is quite common to need to store our users’ usernames and passwords (or other critical information, such as access tokens) in our apps, so our users won’t have to sign in each time they use the app. However, although I’ve said this is commonly needed, we need to be careful when storing them because we can’t afford even a slightest chance of them being exposed.

So we're talking about "Remember me" or "Keep me signed in" functionality.

So we’re talking about “Remember me” or “Keep me signed in” functionality.

In Windows Store apps, there is a small but potentially deadly pitfall when implementing this feature: Using application local settings for storing username and password. Application settings may be kept isolated from other apps and users but that isn’t enough. They are kept in the registry, and if you dig deep enough and know what you are doing, you may find a way to read them (check this link for starters). For example, in my previous blog posts where we integrated Facebook, we kept the user’s access token this way (for simplicity, of course), and if anyone were to read the application settings and find that token they could read our user’s timeline and/or post stuff on his/her behalf.

This is what will happen when your Facebook access token is exposed, at best.

This is what will happen when your Facebook access token is exposed, at best.

Anyway, joking aside, the correct way to store critical information in Windows Store Apps is to use credential lockers; namely, the PasswordVault and PasswordCredential classes under Windows.Security.Credentials workspace, and in this article we’ll make an example app that keeps the user’s username and password securely.

➤ I have a feeling that “gay” joke is going to give me some headaches when my friends see it