การพัฒนา Windows 10 - การแปลเป็นภาษาท้องถิ่น
Windows ถูกนำไปใช้ทั่วโลกในตลาดที่แตกต่างกันและสำหรับกลุ่มเป้าหมายที่แตกต่างกันไปในวัฒนธรรมภูมิภาคหรือภาษา การแปลเป็นภาษาท้องถิ่นคือการแปลทรัพยากรของแอปพลิเคชันเป็นเวอร์ชันที่แปลเป็นภาษาท้องถิ่นสำหรับวัฒนธรรมเฉพาะที่แอปพลิเคชันรองรับ
เมื่อคุณพัฒนาแอปพลิเคชันในภาษาเดียวหมายความว่าคุณกำลัง จำกัด ธุรกิจและลูกค้าของคุณ หากคุณต้องการเพิ่มฐานลูกค้าซึ่งจะเพิ่มธุรกิจของคุณด้วยแอปพลิเคชันของคุณจะต้องพร้อมใช้งานและเข้าถึงได้ทั่วโลก การแปลผลิตภัณฑ์ของคุณให้คุ้มค่าเป็นหนึ่งในวิธีที่ดีที่สุดและประหยัดที่สุดในการเข้าถึงลูกค้าได้มากขึ้น
ใน Windows 10 แอปพลิเคชันที่แปลเป็นภาษาท้องถิ่นนั้นสร้างได้ง่ายมาก resx ซึ่งเป็นวิธีที่ง่ายที่สุดสำหรับการแปล
ให้เราเข้าใจสิ่งนี้ด้วยความช่วยเหลือของตัวอย่างง่ายๆโดยทำตามขั้นตอนที่กล่าวถึงด้านล่างทั้งหมด
การแปลทรัพยากร UI
คุณสามารถใส่ทรัพยากรสตริงสำหรับ UI ของคุณลงในทรัพยากร (resw) แทนที่จะใส่ไว้ในโค้ดหรือมาร์กอัปโดยตรงจากนั้นคุณสามารถอ้างอิงสตริงเหล่านั้นจากโค้ดหรือมาร์กอัปของคุณ ทำตามขั้นตอนด้านล่างเพื่อเพิ่มสตริงให้กับไฟล์ทรัพยากร
สร้างแอปพลิเคชัน Universal Windows Platform (UWP) ใหม่
ใน Solution Explorerคลิกขวาที่โปรเจ็กต์แล้วเลือก Add > New Folder.

เปลี่ยนชื่อโฟลเดอร์ใหม่เป็น "Strings".
คลิกขวาที่ไฟล์ Strings โฟลเดอร์และเพิ่มโฟลเดอร์ใหม่ที่มีชื่อ "en-US". เหล่านี้จะถูกตั้งชื่ออนุสัญญาที่เฉพาะเจาะจงกับภาษาและประเทศ / ภูมิภาคชื่อและมันสามารถพบได้ในการสนับสนุนภาษาแห่งชาติ (NLS) อ้างอิง API msdn.microsoft.comหน้า
คลิกขวาที่ไฟล์ en-US โฟลเดอร์และเลือก Add > New Item….

- กล่องโต้ตอบต่อไปนี้จะเปิดขึ้น

เลือก "Resources File (.resw)" แล้วคลิกไฟล์ Add ปุ่ม.
ตอนนี้ให้เราไปที่ไฟล์ XAML และเพิ่มตัวควบคุม Hub พร้อมคุณสมบัติบางอย่างดังที่แสดงด้านล่าง
<Page
x:Class = "UWPLocalizationDemo.MainPage"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local = "using:UWPLocalizationDemo"
xmlns:d = "http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable = "d">
<Grid Background = "{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Hub x:Name = "textBlock" x:Uid = "HubControl" Background = "Black"
Foreground = "White" Header = "Localization Demo"/>
</Grid>
</Page>
x:Uid = "HubControl" เป็นตัวระบุที่ใช้สำหรับการแปล
ตอนนี้เมื่อรวบรวมและดำเนินการโค้ดด้านบนคุณจะเห็นหน้าต่างต่อไปนี้
ข้อมูลทั้งหมดที่เกี่ยวข้องกับ Hub เช่น Header, Foreground และสีพื้นหลังถูกตั้งค่าใน XAML

ตอนนี้เพิ่มข้อมูลบางส่วนใน Resource.resw ไฟล์ในไฟล์ Strings/en-US ตามที่แสดงด้านล่าง

คุณต้องเชื่อมโยงทุกตัวควบคุมที่ต้องการข้อความที่แปลเป็นภาษาท้องถิ่นกับไฟล์.reswไฟล์. คุณสามารถทำได้โดยใช้ไฟล์x:Uid แอตทริบิวต์ในองค์ประกอบ XAML ของคุณเช่นนี้ -
x:Uid = "HubControl" ใช้ใน resw ไฟล์เพื่อกำหนดสตริงสำหรับสีส่วนหัวพื้นหน้าและพื้นหลัง
ตอนนี้เมื่อคุณรวบรวมและเรียกใช้แอปพลิเคชันของคุณบนโปรแกรมจำลองคุณจะเห็นหน้าต่างต่อไปนี้ คุณจะเห็นว่าค่าสีส่วนหัวพื้นหน้าและพื้นหลังถูกเลือกจากไฟล์Resources.resw ไฟล์.

คุณสามารถเพิ่มอื่น ๆ Resource.resw ไฟล์สำหรับภาษาอื่น ๆ เช่นฝรั่งเศสเยอรมันและญี่ปุ่นเป็นต้นด้วยตนเองเช่นเดียวกับที่เราทำสำหรับภาษาอังกฤษ - สหรัฐอเมริกา แต่ Microsoft ยังมี Multilingual App Toolkit ด้วยความช่วยเหลือซึ่งคุณสามารถแปลไฟล์ Resource.resw ในภาษาอื่น ๆ
ไปที่ไฟล์ Tools > Extensions และอัปเดตเมนูและค้นหาไฟล์ Multilingual app ชุดเครื่องมือ

ดาวน์โหลดและติดตั้งชุดเครื่องมือนี้ เมื่อการติดตั้งเสร็จสิ้นให้รีสตาร์ท Visual Studio และเปิดโครงการเดียวกัน
ตอนนี้เปิดใช้งานชุดเครื่องมือนี้จากไฟล์ Tools > Multilingual App ตัวเลือกเมนู Toolkit

ตอนนี้คุณสามารถเพิ่มคำแปลสำหรับภาษาอื่น ๆ
คลิกขวาที่โครงการในไฟล์ Solution Explorer และเลือก Multilingual App Toolkit > Add Translation ตัวเลือกภาษาจากเมนู

ดังต่อไปนี้ Translation Languagesกล่องโต้ตอบจะเปิดขึ้น คุณสามารถเลือกภาษาใดก็ได้ที่คุณต้องการเพื่อแปลแอปพลิเคชันของคุณสำหรับวัฒนธรรมเหล่านั้น

ให้เราเลือก German ภาษาแล้วคลิกไฟล์ OK ปุ่ม.

คุณยังสามารถดูว่าไฟล์ Resources.resw ไฟล์ถูกสร้างขึ้นภายในโฟลเดอร์ Strings\de.
ตอนนี้คุณจะเห็นว่าอีก MultiLingualResources ถูกเพิ่มเข้าไปในไฟล์ *.xlfไฟล์. ดับเบิลคลิกที่ไฟล์นี้ซึ่งจะเปิดไฟล์Multilingual บรรณาธิการเพื่อตรวจสอบและตรวจสอบสตริงที่แปลและทำการเปลี่ยนแปลงบางอย่างหากจำเป็น

ทำการเปลี่ยนแปลงและตรวจสอบว่าสีพื้นหลังเปลี่ยนเป็นสีน้ำตาลหรือไม่และข้อความส่วนหัวได้รับการแปลเป็นภาษาเยอรมันอย่างถูกต้อง
ดังตัวอย่างข้างต้นสีพื้นหลังของ Hub ได้เปลี่ยนจากสีฟ้าเป็นสีน้ำตาลและสีพื้นหน้ายังคงเหมือนเดิม
ตอนนี้เปิดไฟล์ Resources.reswซึ่งอยู่ภายในไฟล์ Strings\de โฟลเดอร์

คุณจะเห็นว่ามีการกล่าวถึงเพียงสองสตริงที่นี่เนื่องจากเราไม่ได้เปลี่ยนสีพื้นหน้าในโปรแกรมแก้ไขหลายภาษา
หากต้องการตรวจสอบเวอร์ชันที่แปลเป็นภาษาท้องถิ่นของแอปพลิเคชันของคุณให้เปลี่ยนวัฒนธรรมของเครื่องของคุณ ในการเปลี่ยนวัฒนธรรมของเครื่องของคุณให้ทำตามขั้นตอนที่กำหนด
- ให้เราไปที่การตั้งค่าพีซีและเลือกเวลาและภาษา

จากบานหน้าต่างด้านซ้ายเลือก Regions & language และคลิกที่ไฟล์ Add a language.

เลือก Deutsch German ภาษาดังที่แสดงด้านบนซึ่งจะเปิดกล่องโต้ตอบอื่น

ตอนนี้เลือก German (Germany) และปิดกล่องโต้ตอบนี้

- กำหนดให้ Deutsch เป็นภาษาเริ่มต้น
- ตอนนี้เรียกใช้แอปพลิเคชันของคุณมันจะแสดงหน้าต่างต่อไปนี้

- ตอนนี้คุณสามารถเห็นผลลัพธ์ของแอปพลิเคชันของคุณเป็นภาษาเยอรมัน