New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Localization

  • Print Image
  • Save Image
  • Export Image
  • Undo
  • Redo
  • Reset Changes
  • Crop
  • Resize
  • Zoom
    • Zoom
    • Zoom In
    • Zoom Out
  • Opacity
  • Rotate
    • Rotate
    • Rotate Right by 90 deg
    • Rotate Left by 90 deg
  • Flip
    • Flip
    • Flip Vertically
    • Flip Horizontally
  • Add Text
  • Insert Image
  • Brightness/Contrast
    • Brightness/Contrast
    • Hue/Saturation
    • Blur
    • Sharpen
    • Greyscale
    • Sepia
    • Invert Colors (negative)
  • Pencil
    • Pencil
    • Line
    • DrawRectangle
    • DrawCircle
Zoom:100%Size:0x0pxPos.:(-,-)Last Action:None
  • Demo Configurator
From App_GlobalResources
Localization files from different folder (fr-FR)

With RadImageEditor you can easily create a new language pack or alter some of the labels of an existing one.

Localization is contained in resourse files .resx which are within the product dll. There are three built-in localizations (English, French and German) which can be set through the Language property. For example to localize the image editor in German set Language="de-DE".

To create your own localizations for the image editor, you need to create the  App_Global Resources folder in the root of your web application and copy the English resx files (which will be provided for download from our site) into it. These files are:

  • RadImageEditor.Dialogs.resx - contains all dialogs' localization strings
  • RadImageEditor.Main.resx - contains the spell's, paste and other localization strings

After you have copied the resx files, you must duplicate each copy of these files and rename them using the syntax shown in the few examples below:

  • RadImageEditor.Main.<Your_Language>.resx
  • RadImageEditor.Dialogs.<Your_Language>.resx

All resx file contain two columns: Name and Value.

It is mandatory to set the ReservedResource string in the Name column of the RadImageEditor.Tools.<Language>.resx file. Without this string the resource files will not be recognized.

Once you do that you can localize the strings in the Value column. You need to localize the strings in the Value column of your new resx files.

The next step is to set the Language property of RadImageEditor to the name of the <localization> string in the RadImageEditor.Tools.<language>.resx file.

Inline in the RadImageEditor's declaration:

<telerik:RadImageEditor runat="server" ID="RadImageEditor1" Language="it-IT" />

In the CodeBehind

C#

RadImageEditor1.Language = "it-IT";

VB.NET

RadImageEditor1.Language = "it-IT"

Changing the location of the Localization files:

The LocalizationPath property indicates where the image editor will look for its .resx localization files in the web application. By default the .resx localization files of RadImageEditor are placed in the App_GlobalResources folder. However, if it is not possible to put the resource files in the default location or .resx files compilation is disabled for some reason (e.g. in a DotNetNuke environment), then the LocalizationPath property should be set to point to the new location of the resource files.

All labels, buttons, tooltips and error messages are located in external resx resource files, so that the language of the ImageEditor can be switched with a single property (Language). By default, the resx files are located in the App_GlobalResources folder. To load the localization files from another directory, set the LocalizationPath property to point to the new folder location.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Language="C#" Theme="Default" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs"Inherits="Telerik.Web.Examples.ImageEditor.Localization.DefaultCS"  %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="../../common/styles.css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container size-wide">
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
            <telerik:RadImageEditor RenderMode="Lightweight" runat="server" ID="RadImageEditor1" ImageUrl="~/ImageEditor/images/11.jpg" Width="790px">
            </telerik:RadImageEditor>
        </telerik:RadAjaxPanel>
    </div>
    <qsf:ConfiguratorPanel runat="server">
        <Views>
            <qsf:View>
                <qsf:ConfiguratorColumn runat="server" Title="From App_GlobalResources" Size="Medium">
                    <qsf:RadioButtonList CellPadding="0" CellSpacing="0"
                        CssClass="text" ID="RadioButtonListLanguage" title="Choose the desired language."
                        runat="server" AutoPostBack="True" OnSelectedIndexChanged="RadioButtonListLanguage_SelectedIndexChanged">
                        <asp:ListItem Value="en-US" Selected="True">English (en-US)</asp:ListItem>
                        <asp:ListItem Value="de-DE">Deutsch (de-DE)</asp:ListItem>
                        <asp:ListItem Value="fr-FR">Francais (fr-FR)</asp:ListItem>
                    </qsf:RadioButtonList>
                </qsf:ConfiguratorColumn>
                <qsf:ConfiguratorColumn runat="server" Title="Localization files from different folder (fr-FR)" Size="Wide">

                    <span class="checkbox"><asp:CheckBox ID="LocalizationPathCheckBox" runat="server" Text="~/ImageEditor/Examples/Localization/Resources" OnCheckedChanged="LocalizationPathCheckBox_CheckedChanged" AutoPostBack="true" /></span>
                </qsf:ConfiguratorColumn>

            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance