Using ProgressRing in Windows Phone

26 Mart 2014Windows Phone

ProgressRingAs you know, ProgressRing Control is only available for Windows 8. So, I tried to use it on my Windows Phone project and I failed but I found the right answer to add ProgressRing Control to my Windows Phone project.

If you have no idea about ProgressRing Control, I can easily say that, this is the most smooth and the best waiting screen ProgressBar control I’ve ever seen! And at this tutorial we’ll have that perfect ProgressBar control on Windows Phone too :).

Let’s see how can we add that control to our Windows Phone project step-by-step from the beggining of creating a new project.

Firstly, I’m creating an empty Windows Phone project.


After creation of the project you’ll see an empty project page on your screen like this:


After this step we can start to add ProgressRing Control to our own project. If you want to add this control to an existing project, you can start from this step.

We have a style code to add our Resources. Firstly we’re going to add that code to our MainPage.xaml (or any page name that you want to add this control). But, please remember, you have to put this code between that XAML tag.

So, here is our code which going to be added between our XAML tag, this is “a little” long, so be careful while you’re using copy-paste method. This code contains some animations and styles that lets us show and use ProgessRing on our project:

After this step we’ll create a class file to add some runtime code for ProgressRing. The upper style code contains some XAML stuff, but this C# code gonna make our ProgressRing able to run correctly.

Now, create a class from Solution Explorer and right click to your project, after that point to Add label and you’ll see “Class…” button right there, it should be look like this:


After you created your class, you can give any name to your class it but I’m giving “ProgressRing.cs” name to it, so you can to the same!


After this step, our ProgressRing.cs should be visible on our page, if it doesn’t, please open it from your Solution Explorer window by double-clicking.

On your ProgressRing.cs file you should see a few lines of codes. We won’t need them, delete them and make yourself sure there aren’t any lines of codes. It should be completely empty. After that we can add our code C# code to our ProgressRing.cs file. Here is the code:

After that step we’re going back to our XAML page to add a few line codes. I’m giving the code to add it XAML:

Add this code into the red point, here is the point:


After you add the code your XAML page should be look like this:


So, after this step we’ll add the ProgressRing Control to MainPage.xaml, and it’ll be ready to use after this step!

Add this code to a place where you want to show ProgressRing Control. I’ll add it into my ContentPanel Grid. So do the same thing 🙂 Here is the image and the code.


We’re geting close to end of the adding ProgressRing Control to our project 🙂

Let’s test our control, here is Screenshot and Preview of Screenrecord for ProgressRing Control.


If you want to see a Screenrecord, check this:

I hope you like the tutorial and ProgressRing Control.


If you want to download sample project, you can get it here;





"Using ProgressRing in Windows Phone" yazısı için hiç yorum yapılmamış..

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

bodrum escort bodrum escort