Click here to Skip to main content
15,867,686 members
Articles / Desktop Programming / XAML

How to Use New Rupee Symbol of India in Silverlight?

Rate me:
Please Sign up or sign in to vote.
4.93/5 (19 votes)
20 Jul 2010CPOL4 min read 62.1K   291   8   28
In this post, I will describe how to integrate the new symbol for the Indian Rupee in Silverlight application.

Introduction

In July 2010, the Indian Cabinet selected a new Symbol for the Indian Rupee which looks like the snapshot shown below. In this post, I will describe you how to integrate the same symbol in Silverlight application.

As the Unicode is not present for that till now, we need to use some font to write the letter using that. Fordian Technologies has the font and you can download it from their official Blog. The latest version of the font is available here: Rupee Font Version 2.0.

Let us have a quick tutorial on it to create a Silverlight application with the new Rupee Symbol of India in it.

Installation of Font

To start with the development process, you must have to download the Font from Fordian Technologies Official Blog. Once downloaded, install it in your system. If you are using Windows 7, just right click on the downloaded “Rupee_Foradian.TTF file and click “Install”. This will install the font in the System and will be available throughout the applications available in the system. If you are using any other Microsoft OS, just copy the .TTF file to the “%WINDIR%\Fonts” directory.

Verify the Installation of the Font

Once installation of the font is done, it is time to validate whether the font is available for you in any application in your system. Open “Notepad” and go to “Format” –> “Font”.

image

Now in the font dialog, type “Rupee Foradian” (this is the name of the font) in the Font TextBox field. If it shows as below in the ListBox, it mean that your font has been installed successfully in your system. Wohooo… Open-mouthed smile

image

Using the Symbol (for Blend Users)

Hey, if you are familiar with Microsoft Expression Blend, then it is very easy to embed the font and then use it in your Silverlight application. For Visual Studio users, it is also easy but you need to know more things. I will come into this point later. First, let us discuss it for Expression Blend users.

Open your Silverlight project and add a TextBlock inside your .xaml page. Assuming you know the basic XAML designing, go to the properties panel of your TextBlock and enter the following string inside the “Text” attribute: “Product Rate: ` 103.50”. The character (`) mentioned in the string generates the new Rupee symbol of India if you are using the “Rupee Foradian” font.

Your text will look like the entered text (i.e. Product Rate: ` 103.50) in your page. Now from the property panel, click “Font Manager” in the step no: 1. This will bring up the Font Manager dialog to the screen. Enter “Rupee Foradian” (without the quote) in step number 2 and you will see the font appears in the below panel. Select the checkbox for the font name and click OK in the 3rd step.

image

Once done, select the “Rupee Foradian” from the font dropdown list and mark the checkbox of the “Embed” attribute as selected (see the below snapshot). This will embed the font in your application.

image

Now have a look into the entered text in the UI or else just run the application. You will see that, the ` character has been converted to the new Rupee symbol. See the below output screen:

image

It’s so easy to do that using Expression Blend. Have a look into the solution folder. You will see that there is a folder named “Fonts” created automatically and the font file has been copied inside it. Blend added this for you. Surprised smile

Using the Symbol (for Visual Studio Users)

In Visual Studio also, it is very easy. Create a directory named “Fonts” in your Silverlight project and copy the font file inside that.

image

Now go to the properties pane of the font file from your Visual Studio IDE itself. Select “BlendEmbeddedFont” from the “Build Action” dropdown and set “Copy to Output Directory” as “Do not copy”. See the below snapshot for details.

image

Go to your XAML and add the following code and be sure that you inserted the proper path and filename to the embedded FontFamily.

XML
<TextBlock Text="Product Rate: ` 103.50"
            FontFamily="/IndianRupeeDemo;component/Fonts/Fonts.zip#Rupee Foradian"
            HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="32"/>

Run your application and you will see the string in the UI has the new Indian Rupee Symbol on it. Enjoy! Party smile

Don't forget to vote for it. Your feedback and suggestions are always welcome.

History

  • 20th July, 2010: Initial post

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Technical Lead
India India

Kunal Chowdhury is a former Microsoft "Windows Platform Development" MVP (Most Valuable Professional, 2010 - 2018), a Codeproject Mentor, Speaker in various Microsoft events, Author, passionate Blogger and a Senior Technical Lead by profession.

He is currently working in an MNC located in India. He has a very good skill over XAML, C#, Silverlight, Windows Phone, WPF and Windows app development. He posts his findings, articles, tutorials in his technical blog (www.kunal-chowdhury.com) and CodeProject.


Books authored:


Connect with Kunal on:





Comments and Discussions

 
GeneralMy vote of 5 Pin
Sandesh M Patil26-Nov-10 23:37
Sandesh M Patil26-Nov-10 23:37 
GeneralRe: My vote of 5 Pin
Kunal Chowdhury «IN»30-Jul-11 8:02
professionalKunal Chowdhury «IN»30-Jul-11 8:02 
GeneralMy vote of 5 Pin
Milind R Chavan27-Sep-10 4:39
Milind R Chavan27-Sep-10 4:39 
GeneralMy vote of 5 Pin
Abhinav S4-Sep-10 3:36
Abhinav S4-Sep-10 3:36 
AnswerRe: My vote of 5 Pin
Kunal Chowdhury «IN»21-Sep-10 5:14
professionalKunal Chowdhury «IN»21-Sep-10 5:14 
GeneralRe: My vote of 5 Pin
Abhinav S21-Sep-10 5:40
Abhinav S21-Sep-10 5:40 
GeneralMy vote of 4 Pin
srinivas_here27-Aug-10 22:42
srinivas_here27-Aug-10 22:42 
AnswerRe: My vote of 4 Pin
Kunal Chowdhury «IN»21-Sep-10 5:20
professionalKunal Chowdhury «IN»21-Sep-10 5:20 
GeneralMy vote of 5 Pin
kamalsen17-Aug-10 6:04
kamalsen17-Aug-10 6:04 
GeneralRe: My vote of 5 Pin
Kunal Chowdhury «IN»17-Aug-10 7:57
professionalKunal Chowdhury «IN»17-Aug-10 7:57 
GeneralMy vote of 1 Pin
Patel Maulik26-Jul-10 19:05
Patel Maulik26-Jul-10 19:05 
GeneralRe: My vote of 1 Pin
kamalsen17-Aug-10 6:12
kamalsen17-Aug-10 6:12 
GeneralRe: My vote of 1 Pin
Kunal Chowdhury «IN»17-Aug-10 8:14
professionalKunal Chowdhury «IN»17-Aug-10 8:14 
GeneralMy vote of 2 Pin
drhender26-Jul-10 11:00
drhender26-Jul-10 11:00 
GeneralThis doesn't work [modified] Pin
Tendoors26-Jul-10 6:44
Tendoors26-Jul-10 6:44 
AnswerRe: This doesn't work Pin
Kunal Chowdhury «IN»26-Jul-10 7:51
professionalKunal Chowdhury «IN»26-Jul-10 7:51 
GeneralRe: This doesn't work Pin
Tendoors26-Jul-10 8:49
Tendoors26-Jul-10 8:49 
GeneralRe: This doesn't work Pin
Kunal Chowdhury «IN»26-Jul-10 8:56
professionalKunal Chowdhury «IN»26-Jul-10 8:56 
AnswerRe: This doesn't work Pin
Kunal Chowdhury «IN»26-Jul-10 9:14
professionalKunal Chowdhury «IN»26-Jul-10 9:14 
GeneralRe: This doesn't work Pin
Kunal Chowdhury «IN»27-Jul-10 8:13
professionalKunal Chowdhury «IN»27-Jul-10 8:13 
GeneralHey.. Pin
Abhishek Sur21-Jul-10 9:23
professionalAbhishek Sur21-Jul-10 9:23 
GeneralRe: Hey.. Pin
Kunal Chowdhury «IN»21-Jul-10 15:53
professionalKunal Chowdhury «IN»21-Jul-10 15:53 
GeneralMy vote of 5 Pin
divyang448120-Jul-10 18:59
divyang448120-Jul-10 18:59 
GeneralRe: My vote of 5 Pin
Kunal Chowdhury «IN»20-Jul-10 22:36
professionalKunal Chowdhury «IN»20-Jul-10 22:36 
GeneralMy vote of 3 Pin
Priyank Bolia20-Jul-10 1:14
Priyank Bolia20-Jul-10 1:14 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.