Click here to Skip to main content
15,867,308 members
Articles / Programming Languages / Java
Article

Localization in JSF

Rate me:
Please Sign up or sign in to vote.
5.00/5 (2 votes)
15 Nov 2017CPOL2 min read 12.6K   93   1   2
In this article I cover localizing text, date and currency

Introduction

This is a simple demonstration of localization implemented in a JSF application. Localization is the process of adapting an application to the language, culture and formats of a particular region known as locale. In this article I cover localizing text, date and currency.

Background

The Locale class from the java.util package is used to specify a geographical location to be used to implement Localization. The Locale class has the following constructors:

  • Locale(String language)
  • Locale(String language, String country)
  • Locale(String language,String country,String variant)

For example, you can use the following code to specify the french language as spoken in France.

Locale locale=new Locale("fr","FR");

The ResourceBundle class from the java.util package is used to load resource bundle files. A resource bundle is a Java .properties file which contains locale specific strings. It consists of Key-Value pairs for each property. The resource bundle file is named as BaseFileName_LanguageCode_CountryCode.properties. For example, the resource bundle file for French language as spoken in France will be MessageBundle_fr_FR.properties.

The following code shows how we can use the ResourceBundle class to load the resource bundle for French language:

ResourceBundle bundle=ResourceBundle.getBundle("MessageBundle",locale);

The corresponding MessageBundle_fr_FR.properties file contains the following code:

# To change this license header, choose License Headers in Project Properties.
# To change this template file, choose Tools | Templates
# and open the template in the editor.

message=Bonjour
language=French
imageUrl=france.png

The DateFormat class from the java.text package is used to localize dates. The following is an example of how to localize the current date:

DateFormat df=DateFormat.getDateInstance(DateFormat.SHORT, locale);
currDate=df.format(new Date());

The NumberFormat class from the java.text package is used to localize numbers. The following is an example of how to localize an amount as currency:

NumberFormat nf=NumberFormat.getCurrencyInstance(locale);
amount=nf.format(12345.67);

Using the code

Since this article is based on JSF, I have created a Resource Scoped Managed Bean class called HelloBean to perform the actual localization and return localized data to the JSF page. The Managed Bean consists of the following properties:

private String language;
private String message;
private String currDate;
private String amount;
private String imageUrl;

It consists of getter methods for the above properties and methods to localize these properties in different languages and countries. The following code shows localization in English and French languages:

public void showEnglishMessage()
{
    Locale locale=new Locale("en","US");
    ResourceBundle bundle=ResourceBundle.getBundle("MessageBundle",locale);
    localize(bundle, locale);
}
public void showFrenchMessage()
{
    Locale locale=new Locale("fr","FR");
    ResourceBundle bundle=ResourceBundle.getBundle("MessageBundle",locale);
    localize(bundle, locale);
}
public void localize(ResourceBundle bundle,Locale locale)
{
    message=bundle.getString("message");
    language=bundle.getString("language");
    imageUrl=bundle.getString("imageUrl");
    DateFormat df=DateFormat.getDateInstance(DateFormat.SHORT, locale);
    currDate=df.format(new Date());
    NumberFormat nf=NumberFormat.getCurrencyInstance(locale);
    amount=nf.format(12345.67);
}

In the above code, showEnglishMessage() and showFrenchMessage() user defined methods call another user defined method called localize() which performs localization using the Locale and ResourceBundle parameters.

Following are the English and French language resource bundle files:

# To change this license header, choose License Headers in Project Properties.
# To change this template file, choose Tools | Templates
# and open the template in the editor.

message=Hello
language=English
imageUrl=us.png
# To change this license header, choose License Headers in Project Properties.
# To change this template file, choose Tools | Templates
# and open the template in the editor.

message=Bonjour
language=French
imageUrl=france.png

The properties of the Managed Bean are bound to JSF controls on the index.xhtml JSF page as follows:

XML
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
    <h:head>
        <title>Localization Demo</title>
    </h:head>
    <h:body>
        <h:form>
            <div align="center">
            <h1>Localization Demo</h1>
            <h:panelGrid columns="2" border="5">
                <h:outputLabel for="txtLanguage" value="Language: "/>
                <h:outputText id="txtLanguage" value="#{helloBean.language}"/>
                <h:outputLabel for="txtMessage" value="Message: "/>
                <h:outputText id="txtMessage" value="#{helloBean.message}"/>
                <h:outputLabel for="txtDate" value="Date: "/>
                <h:outputText id="txtDate" value="#{helloBean.currDate}"/>
                <h:outputLabel for="txtAmount" value="Amount(Currency): "/>
                <h:outputText id="txtAmount" value="#{helloBean.amount}"/>
                <h:outputLabel for="imgFlag" value="Flag: "/>
                <h:graphicImage id="imgFlag" url="#{helloBean.imageUrl}"
                                width="100" height="100" />
                <h:commandButton id="cmdEnglish" value="English Hello"
                                 action="#{helloBean.showEnglishMessage}"
                                 style="width: 170px" />
                <h:commandButton id="cmdFrench" value="French Hello"
                                 action="#{helloBean.showFrenchMessage}"
                                 style="width: 170px" />
                <h:commandButton id="cmdGerman" value="German Hello"
                                 action="#{helloBean.showGermanMessage()}"
                                 style="width: 170px" />
                <h:commandButton id="cmdSpanish" value="Spanish Hello"
                                 action="#{helloBean.showSpanishMessage()}"
                                 style="width: 170px" />
                <h:commandButton id="cmdItalian" value="Italian Hello"
                                 action="#{helloBean.showItalianMessage()}"
                                 style="width: 170px" />
                <h:commandButton id="cmdTurkish" value="Turkish Hello"
                                 action="#{helloBean.showTurkishMessage()}"
                                 style="width: 170px" />
            </h:panelGrid>
            </div>
        </h:form>
    </h:body>
</html>

Points of Interest

As this article demonstrates, Java provides a very easy way to localize data. The same approach can be used in any kind of Java environment.

The flag images used in this article were downloaded from the following site:

https://www.countryflags.com/en/

License

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


Written By
Instructor / Trainer NIIT, India
India India
I am a trainer by profession. Currently I am working with iFuture Technologies(India) as a Senior Faculty. I enjoy programming as a hobby. During my career I have seen the growth and decline of many technologies, many of them being my favorites like Flash, WPF, Windows Mobile Development. Few of my current favorites are Android, Xamarin and Python, though I also like traditional and evergreen languages like PHP, C#, Visual Basic and Java.

Apart from computers, my favorite pastime is bicycling.

Comments and Discussions

 
GeneralMy vote of 5 Pin
DrABELL26-Nov-17 8:37
DrABELL26-Nov-17 8:37 
GeneralRe: My vote of 5 Pin
Azim Zahir28-Nov-17 5:39
Azim Zahir28-Nov-17 5:39 

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.