연습: LightSwitch 응용 프로그램 지역화

아티클
06/10/2015

Silverlight 클라이언트나 HTML 클라이언트 또는 둘 다를 통해 다양한 언어의 UI를 자동으로 표시하는 LightSwitch 응용 프로그램을 만들 수 있습니다. 연습을 통해서 응용 프로그램과 2가지 유형의 클라이언트를 제작하고 프로그램을 독일어로 번역합니다(또는 다른 언어로도 번역 가능).

응용 프로그램을 지역화하려면 화면 디자이너에서 각 표시 문자열의 리소스 식별자를 추가합니다. 그런 후 클라이언트 및 서버 계층 모두에 대해 기본 언어에 대한 리소스 파일과 지역화된 언어에 대한 리소스 파일을 만듭니다. 클라이언트 유형이 한 가지라도 응용 프로그램을 지역화할 수 있습니다. 각각의 지역화를 연습할 수 있도록 두 형식을 모두 포함하였습니다.

참고

SilverLight 클라이언트만 지역화하는 경우 먼저 업그레이드해야 합니다.메뉴 모음에서 프로젝트, 프로젝트 업그레이드를 선택합니다.프로젝트 업그레이드 명령이 나타나지 않으면 프로젝트가 이미 업그레이드된 것입니다.

이 연습에서는 다음 작업을 수행하는 방법을 보여 줍니다.

응용 프로그램을 만듭니다.
서버 계층 지역화
Silverlight 클라이언트 화면 지역화
기본 언어 리소스 추가
지역화된 리소스 추가
코드에서 리소스 호출
HTML 클라이언트 지역화

사전 요구 사항

LightSwitch 응용 프로그램을 지역화하려면 Microsoft LightSwitch for Visual Studio Update 2가 필요합니다.

응용 프로그램을 만들려면

LightSwitch HTML 애플리케이션(Visual Basic) 템플릿 또는 LightSwitch HTML 애플리케이션(Visual C#) 템플릿을 사용하여 응용 프로그램을 만든 다음 Localization Sample이라는 이름을 지정합니다.
테이블을 추가하고 이름을 연락처로 지정한 후 다음 필드를 추가합니다.

Name

형식

필수

ContactName

String

예

ContactPhone

전화 번호

예
솔루션 탐색기에서 Localization_Sample.HTML Client 노드에 대한 바로 가기 메뉴를 열고 화면 추가를 선택합니다.
이름이 BrowseContacts인 데이터 찾아보기 화면을 추가한 다음 화면 데이터로 연락처를 선택합니다.
솔루션 탐색기에서 HTML 클라이언트 노드에 대한 바로 가기 메뉴를 열고 화면 추가를 선택합니다.
이름이 AddEditContact인 세부 정보 추가/편집 화면을 추가한 다음 화면 데이터로 연락처를 선택합니다.
BrowseContacts 를 열고, 화면 디자이너에서 행 레이아웃 | 연락처 목록 노드를 위한 바로 가기 메뉴를 연 다음 단추 추가를 선택합니다.
추가 단추 대화 상자의 showTab 목록에서 showAddEditContact를 선택합니다.
연락처 필드에서 **(새 연락처)**를 입력한 후 확인 단추를 선택합니다.
솔루션 탐색기에서 Localization Sample 노드에 대한 바로 가기 메뉴를 열고 클라이언트 추가를 선택합니다.
기본 데스크톱 클라이언트를 적용한 다음 확인 단추를 선택합니다.
솔루션 탐색기에서 데스크톱 클라이언트 노드에 대한 바로 가기 메뉴를 열고 화면 추가를 선택합니다.
이름이 NewContac인 새 데이터 화면을 추가한 다음 화면 데이터로 연락처를 선택합니다.
화면 디자이너에서 추가 노드를 선택한 다음 텍스트 추가를 선택합니다.
텍스트 편집 대화 상자에서 여기에 새 연락처 추가를 입력합니다.

Name	형식	필수
ContactName	String	예
ContactPhone	전화 번호	예

서버 계층을 지역화하려면

솔루션 탐색기에서 데이터 소스 노드를 확장한 다음 Contacts.lsml 엔터티를 엽니다.
엔터티 디자이너에서 ContactName 필드를 선택합니다.
속성 창에서 표시 이름 속성을 선택하고 $(ContactName)을 입력합니다.

$() 표기법은 표시 이름 속성 값이 리소스 식별자인지를 나타냅니다. 런타임에 LightSwitch는 리소스 파일에서 실제 값을 검색합니다.

참고

리소스 식별자는 문자와 숫자만 포함하고 공백을 포함하지 않을 수 있습니다.
엔터티 디자이너에서 ContactPhone 필드를 선택합니다.
속성 창에서 표시 이름 속성을 선택하고 $(ContactPhone)을 입력합니다.
솔루션 탐색기에서 Localization Sample.Server 노드의 바로 가기 메뉴를 열고 추가를 선택한 다음 새 항목을 선택합니다.
리소스 파일을 추가한 다음 이름을 Service.resx로 지정합니다.

중요

모든 LightSwitch 응용 프로그램 Service.resx에 대해 서버 리소스 파일의 이름을 항상 지정해야 하며 파일은 서버 프로젝트의 루트 노드에 있어야 합니다.
리소스 파일에 다음 값을 추가합니다.

Name

값

ContactName

Name

ContactPhone

Phone

이름 열의 값은 앞에서 추가한 리소스 식별자와 일치하지만 값에 $() 표기가 포함되지 않습니다. 값 문자열이 연락처 엔터티를 사용하는 모든 화면에 나타납니다.
솔루션 탐색기에서 Localization Sample.Server 노드의 바로 가기 메뉴를 열고 추가를 선택한 다음 새 항목을 선택합니다.
리소스 파일을 추가한 다음 이름을 Service.de-DE.resx로 지정합니다.
리소스 파일에 다음 값을 추가합니다.

Name

값

ContactName

Kontaktname

ContactPhone

Telefonnummer

지역화된 값 문자열이 연락처 엔터티를 사용하는 모든 화면에 나타납니다. 이제 응용 프로그램을 실행할 수 있으므로 ContactName 및 ContactPhone 문자열이 올바르게 나타나는지 확인합니다. 독일어로 설정된 컴퓨터에 응용 프로그램을 배포하여 지역화된 문자열이 표시되는지 확인할 수도 있습니다.

팁

가장 좋은 방법은 먼저 서버 계층에 있는 모든 엔터티에 대해 문자열을 지역화하는 것입니다.이러한 문자열은 엔터티가 사용되는 화면에만 표시되며, 필요에 따라 화면 수준에서 문자열을 재정의할 수 있습니다.

Name	값
ContactName	Name
ContactPhone	Phone

Name	값
ContactName	Kontaktname
ContactPhone	Telefonnummer

Silverlight 클라이언트 화면을 지역화하려면

솔루션 탐색기에서 NewContact.lsml 화면을 엽니다.
화면 디자이너에서 행 레이아웃 | 새 연락처 노드를 선택합니다.
속성 창에서 표시 이름 속성을 선택하고 $(AddContact)를 입력합니다.
화면 디자이너에서 텍스트 노드의 바로 가기 메뉴를 열고 콘텐츠 편집을 선택합니다.
속성 창에서 기존 텍스트를 $(Text)로 바꿉니다.

이 시점에서 응용 프로그램을 실행하면 실제 리소스 식별자가 화면에 나타나는 것을 알 수 있습니다. 이 문제는 다음 단계에서 언어 리소스의 기본 파일을 만들면 해결됩니다.

언어 리소스에 기본 파일을 추가하려면

솔루션 탐색기에서 Localization Sample.DesktopClient 노드의 바로 가기 메뉴를 열고 추가를 선택한 다음 새 항목을 선택합니다.
리소스 파일을 추가한 다음 이름을 Client.resx로 지정합니다.

중요

LightSwitch 응용 프로그램의 Silverlight 클라이언트의 경우 항상 언어 리소스 Client.resx의 기본 파일의 이름을 지정해야 하며 파일은 클라이언트 프로젝트의 루트 노드에 있어야 합니다.
리소스 파일에 다음 값을 추가합니다.

Name

값

AddContact

연락처 추가

Text

연락처 정보를 추가한 다음 저장 단추를 선택합니다.

이름 열의 값은 앞에서 추가한 리소스 식별자와 일치하지만 값에 $() 표기가 포함되지 않습니다. 값 열의 값은 사용자가 응용 프로그램 설정에서 기본 언어로 설정된 언어로 응용 프로그램을 실행할 때 표시되는 문자열입니다.

Name	값
AddContact	연락처 추가
Text	연락처 정보를 추가한 다음 저장 단추를 선택합니다.

지역화된 리소스 파일을 추가하려면

솔루션 탐색기에서 Localization Sample.DesktopClient 노드의 바로 가기 메뉴를 열고 추가를 선택한 다음 새 항목을 선택합니다.
리소스 파일을 추가한 다음 이름을 Client.de-DE.resx로 지정합니다.

중요

항상 지역화된 리소스 파일 Client.LocaleID.resx의 이름을 지정해야 합니다. 여기서 LocaleID는 대상으로 하는 언어의 Windows 로캘 ID이고 파일은 클라이언트 프로젝트의 루트 노드에 있어야 합니다.독일어 이외의 언어를 선택한 경우 de-DE 대신 해당 언어에 대한 로캘 ID를 입력하고 다음 단계에서 해당 언어 번역을 제공합니다.
리소스 파일에 다음 값을 추가합니다.

Name

값

AddContact

Einen Newen Kontakt erstellen

Text

Fügen Sie die Kontaktinformationen hinzu und speichern Sie dann.

이러한 문자열은 독일어(또는 사용자가 선택한 아무 언어)로 설정된 컴퓨터에서 응용 프로그램을 실행할 때 표시됩니다. 여러 언어로 지역화하려면 추가하는 언어마다 리소스 파일을 추가합니다.

참고

여러 언어로 지역화된 Silverlight 클라이언트의 경우 활성 Windows 언어 팩에 따라 표시 언어가 결정됩니다.

Name	값
AddContact	Einen Newen Kontakt erstellen
Text	Fügen Sie die Kontaktinformationen hinzu und speichern Sie dann.

코드에서 리소스를 호출하려면

솔루션 탐색기에서 Service.resx 파일을 열고 다음 값을 추가합니다.

Name

값

ErrorMessage

이름에 느낌표를 포함할 수 없습니다.
Service.de-DE.resx 파일을 열고 다음 값을 추가합니다.

Name

값

ErrorMessage

Name darf keine Ausrufezeichen enthalten.
솔루션 탐색기에서 Contacts.lsml 엔터티를 엽니다.
엔터티 디자이너 코드 작성 목록에서 Contacts_Validate 메서드를 선택합니다.

참고

엔터티 자체가 선택되어 있고 엔터티 필드가 아닌지 확인하십시오.그렇지 않으면 빌드 오류가 발생합니다.

Name	값
ErrorMessage	이름에 느낌표를 포함할 수 없습니다.

Name	값
ErrorMessage	Name darf keine Ausrufezeichen enthalten.

코드 편집기에서 Imports 또는 using 문을 추가합니다.

Imports My.Resources

using System;
using System.Collections.Generic;
using System.Linq;
using System.Reflection;
using System.Resources;
using System.Text;
using Microsoft.LightSwitch;
using Microsoft.LightSwitch.Security.Server;
namespace LightSwitchApplication

Contacts_Validate 메서드에 다음 코드를 추가합니다.

If entity.ContactName.Contains(“!”) Then
                results.AddEntityError(Service.ErrorMessage)
            End If

if (entity.ContactName.Contains("!"))
            {
                ResourceManager serviceResources = new ResourceManager(
                    "LightSwitchApplication.Service", Assembly.GetExecutingAssembly());
            results.AddEntityError(serviceResources.GetString("ErrorMessage"));
            }

응용 프로그램을 실행하고 느낌표가 있는 새 연락처 이름을 입력하고 저장하고 나서 오류 메시지가 나타나는지 확인합니다. 독일어로 설정된 컴퓨터에 응용 프로그램을 배포하여 독일어로 표시되는 메시지를 확인할 수도 있습니다.

HTML 클라이언트를 지역화하려면

솔루션 탐색기에서 BrowseContacts.lsml 화면을 엽니다.
화면 디자이너에서 연락처 표시 추가 편집 노드를 선택합니다.
속성 창에서 표시 이름 속성을 선택하고 $(add)를 입력합니다.
솔루션 탐색기에서 Localization Sample.HTMLClient 노드를 확장하고, Content 노드에 대한 바로 가기 메뉴를 열고, 추가를 선택한 후 새 폴더를 선택합니다.
폴더의 이름을 Resources로 지정합니다.
리소스 노드에 대한 바로 가기 메뉴를 열고 추가를 선택한 다음 새 항목을 선택합니다.
리소스 파일(.resjson) 항목을 추가한 다음 이름을 client.lang-en-US.resjson으로 지정합니다.

중요

LightSwitch 응용 프로그램의 모든 HTML 클라이언트에서는 항상 언어 리소스 client.lang-LocaleID.resjson에 대한 기본 파일의 이름을 지정해야 합니다. 여기서 LocaleID는 해당 개발 컴퓨터의 언어에 대한 Windows 로캘 ID입니다.Silverlight 클라이언트와는 달리, HTML 클라이언트에는 기본 언어의 개념이 없습니다.

코드 편집기에서 코드를 다음과 같이 바꿉니다.

{
   “add” : “Add a Contact”,
   “errorMessage” :  “Name can’t contain an exclamation mark.“
}

리소스 노드에 대한 바로 가기 메뉴를 열고 추가를 선택한 다음 새 항목을 선택합니다.
리소스 파일(.resjson) 항목을 한 번 더 추가한 다음 이름을 client.lang-de-DE.resjson으로 지정합니다.

코드 편집기에서 코드를 다음과 같이 바꿉니다.

{
   “add” : “Hinzufügen eines Kontakts”,
   “errorMessage” :  “Name darf keine Ausrufezeichen enthalten.“

}

솔루션 탐색기에서 Localization Sample.HTMLClient 노드의 바로 가기 메뉴를 연 후 시작 클라이언트로 설정을 선택합니다.
AddEditContact.lsml 스크린을 열고 나서 코드 작성 목록에 있는 화면 디자이너에서 beforeApplyChanges 메서드의 코드를 아래의 코드로 대체합니다.
```
myapp.AddEditContact.beforeApplyChanges = function (screen) {
    if (screen.Contact.ContactName.indexOf('!') != -1) {
        screen.findContentItem("ContactName").validationResults = [
            new msls.ValidationResult(
                screen.Contact.details.properties.ContactName,
                WinJS.Resources.getString("/client/errorMessage").value
            )
        ];
        return false;
    }

};
```
응용 프로그램을 실행하고 연락처 추가 단추의 문자열을 확인하면 오류 메시지가 정확하게 나타납니다. 독일어로 설정된 브라우저가 있는 컴퓨터에 응용 프로그램을 배포하여 지역화된 문자열이 표시되는지 확인할 수도 있습니다.

참고

여러 언어로 지역화된 HTML 클라이언트의 경우 브라우저 언어 설정에 따라 표시 언어가 결정됩니다.

다음 단계

LightSwitch 응용 프로그램을 지역화하는 데 필요한 모든 작업입니다. 화면 명령 모음 및 탐색 모음과 같은 사용자 인터페이스의 많은 부분이 자동으로 지역화되었음을 알 수 있습니다. 적절한 요소의 표시 이름 또는 설명 속성에 리소스 식별자를 추가하여 자동 번역을 재정의할 수 있습니다. 실제로 지금까지 배운 기술을 사용해서 LightSwitch 응용 프로그램의 어떤 부분이라도 지역화할 수 있습니다.

참고 항목

기타 리소스

프로젝트: LightSwitch 응용 프로그램의 컨테이너

리소스 대체 프로세스

NLS(National Language Support) API 참조

다음을 통해 공유