แปล UI ด้วยเครื่องมือแก้ไขคำแปล (มุมมอง)

แนวคิดและการใช้งาน Jetpack Compose

เครื่องมือแก้ไขคำแปลจะแสดงมุมมองแบบรวมและแก้ไขได้ของทรัพยากรสตริงเริ่มต้นและทรัพยากรสตริงที่แปลทั้งหมด

หากต้องการดูข้อมูลเบื้องต้นเกี่ยวกับการแปลแอปเป็นภาษาต่างๆ โปรดอ่าน หัวข้อการรองรับภาษาและวัฒนธรรมอื่น

รูปที่ 1 เครื่องมือแก้ไขคำแปล แสดงข้อความในแอปก่อน แปล

เปิดเครื่องมือแก้ไขคำแปลจากเครื่องมือแก้ไขการออกแบบ

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

  1. ในแผงโปรเจ็กต์ > Android ทางด้านซ้าย ให้เลือก ModuleName > res > layout
  2. ดับเบิลคลิก content_main.xml เพื่อเปิดไฟล์สำหรับแก้ไข
  3. คลิกแท็บการออกแบบ ที่มุมซ้ายล่างเพื่อแสดงเครื่องมือแก้ไขการออกแบบ
  4. ในเครื่องมือแก้ไขการออกแบบ ให้เลือกรายการแบบเลื่อนลงภาษา
  5. เลือกแก้ไขคำแปล

แสดงข้อความที่แปลในเครื่องมือแก้ไขการออกแบบ

หากต้องการดูว่าข้อความที่แปลจะแสดงในเลย์เอาต์ของแอปอย่างไร ให้สลับข้อความระหว่างเวอร์ชันเริ่มต้นกับเวอร์ชันที่แปลในเครื่องมือแก้ไขการออกแบบโดยทำดังนี้

  1. ในแผงโปรเจ็กต์ > Android ทางด้านซ้าย ให้เลือก ModuleName > res > layout
  2. ดับเบิลคลิก content_main.xml เพื่อเปิดไฟล์สำหรับแก้ไข
  3. คลิกแท็บการออกแบบ ที่มุมซ้ายล่างเพื่อแสดงเครื่องมือแก้ไขการออกแบบ
  4. ในเครื่องมือแก้ไขการออกแบบ ให้เลือกรายการแบบเลื่อนลงภาษา
  5. เลือกแก้ไขคำแปล
  6. เลือกภาษาที่ต้องการใช้เพื่อดูแอป

    รูปที่ 2 รายการแบบเลื่อนลงของภาษาที่เลือกภาษาสเปน

เครื่องมือแก้ไขการออกแบบจะแสดงเลย์เอาต์ของแอปในภาษาที่เลือก ซึ่งในกรณีนี้คือ ภาษาสเปน

รูปที่ 3 เครื่องมือแก้ไขการออกแบบแสดงข้อความที่แปลเป็นภาษาสเปน

ตั้งค่าเครื่องมือแก้ไขการออกแบบเป็นภาษาเริ่มต้น

หากต้องการตั้งค่าภาษาเป็นภาษาเริ่มต้นอีกครั้ง ให้เลือก es > ภาษา

จัดการและทดสอบข้อความที่แปลได้

แพลตฟอร์ม Android และ Android Studio มีฟีเจอร์มากมายที่จะช่วยคุณจัดการและทดสอบข้อความในแอปที่แปลได้ ฟีเจอร์เหล่านี้มีตัวเลือกที่จะช่วยคุณกำหนดเป้าหมายปัญหาเกี่ยวกับสคริปต์ที่อ่านจากขวาไปซ้าย (RTL) เช่น ภาษาอาหรับหรือภาษาฮีบรู การทดสอบข้อความที่แปลได้จะช่วยให้คุณปรับข้อความ UI และเลย์เอาต์ได้ก่อนที่จะคอมมิตข้อความลงในที่เก็บที่มาเพื่อส่งไปแปลในภายหลัง

ปรับโครงสร้างโปรเจ็กต์เพื่อรองรับ RTL

Android Studio มีคำสั่งปรับโครงสร้างที่เปิดใช้การรองรับข้อความสองทิศทาง ในองค์ประกอบ TextView, ConstraintLayout และ LinearLayout เพื่อให้แอปแสดงและอนุญาตให้ผู้ใช้แก้ไขข้อความในสคริปต์ที่อ่านจาก ซ้ายไปขวา (LTR) และสคริปต์ที่อ่านจากขวาไปซ้าย (RTL) ได้ นอกจากนี้ คำสั่งยังมีการมิเรอร์เลย์เอาต์ UI ของแอปและวิดเจ็ตมุมมองทั้งหมดโดยอัตโนมัติด้วย หากต้องการดูการเปลี่ยนแปลงทิศทางข้อความและการมิเรอร์เลย์เอาต์ คุณต้องตั้งค่าพร็อพเพอร์ตี้ทิศทางข้อความและเลย์เอาต์ในเครื่องมือสร้างเลย์เอาต์ด้วย

ขั้นตอนต่อไปนี้แสดงวิธีปรับโครงสร้างโปรเจ็กต์เพื่อรองรับ RTL

  1. เลือกปรับโครงสร้าง > เพิ่มการรองรับ RTL หากเป็นไปได้ เพื่อแสดงกล่องโต้ตอบที่แสดงในรูปที่ 4

    รูปที่ 4 เพิ่มการรองรับ RTL

    • หากองค์ประกอบ <application> ในไฟล์ AndroidManifest.xml ไม่มีแอตทริบิวต์ android:supportsRTL="true" ให้เลือกช่องทำเครื่องหมายอัปเดต AndroidManifest.xml
    • หาก targetSdkVersion ของแอปเป็น 17 ขึ้นไป ให้เลือกแทนที่พร็อพเพอร์ตี้ซ้าย/ขวาด้วยพร็อพเพอร์ตี้เริ่ม/สิ้นสุด ในกรณีนี้ พร็อพเพอร์ตี้ควรใช้ "start" และ "end" แทน "left" และ "right" เช่น android:paddingLeft จะกลายเป็น android:paddingStart
    • หาก targetSdkVersion ของแอปเป็น 16 ลงมา ให้เลือกสร้างเวอร์ชัน -v17 ในกรณีนี้ XML ควรใช้พร็อพเพอร์ตี้ทั้ง 2 ชุด เช่น XML ควรใช้ทั้ง android:paddingLeft และ android:paddingStart
  2. คลิกเรียกใช้ เพื่อแสดงหน้าต่างดูตัวอย่างการปรับโครงสร้าง

    รูปที่ 5 ตรวจสอบตัวอย่าง

  3. คลิกปรับโครงสร้าง

ดูข้อมูลเพิ่มเติมเกี่ยวกับการปรับโครงสร้างโปรเจ็กต์เพื่อรองรับ RTL ได้ที่การรองรับ RTL แบบเนทีฟใน Android 4.2

พร็อพเพอร์ตี้ทิศทางข้อความและเลย์เอาต์

หน้าต่างพร็อพเพอร์ตี้ทางด้านขวามีพร็อพเพอร์ตี้ textDirection สำหรับใช้กับวิดเจ็ตข้อความ และพร็อพเพอร์ตี้ layoutDirection สำหรับใช้กับวิดเจ็ตเลย์เอาต์เพื่อเปลี่ยนทิศทางของข้อความและคอมโพเนนต์เลย์เอาต์ พร็อพเพอร์ตี้ทิศทางจะแสดงอยู่ในหน้าต่างพร็อพเพอร์ตี้ ทางด้านขวา และใช้ได้กับ API ระดับ 17 ขึ้นไป

หากต้องการดูการเปลี่ยนแปลงทิศทางข้อความและการมิเรอร์เลย์เอาต์ คุณต้อง ปรับโครงสร้างโปรเจ็กต์เพื่อรองรับ RTL ด้วย ในภาษาอังกฤษ การเปลี่ยนแปลงทิศทางข้อความจะย้ายเฉพาะเครื่องหมายวรรคตอนจากด้านขวาไปด้านซ้ายของข้อความ เช่น "Hello World!" จะกลายเป็น "!Hello World" หากต้องการดูข้อความ LTR เปลี่ยนเป็น RTL คุณต้องใช้ภาษา RTL ในแอป หากต้องการใช้ภาษาอังกฤษและ ดูข้อความเปลี่ยนเป็น RTL เพื่อวัตถุประสงค์ในการทดสอบ ให้ใช้ ภาษาจำลอง ภาษาจำลองไม่ขึ้นอยู่กับคำสั่งปรับโครงสร้างและพร็อพเพอร์ตี้ทิศทาง

หากต้องการเข้าถึงและใช้พร็อพเพอร์ตี้ทิศทาง ให้ทำดังนี้

  1. เลือกวิดเจ็ตข้อความในเครื่องมือสร้างเลย์เอาต์

  2. เปิดหน้าต่างพร็อพเพอร์ตี้ แล้วค้นหาพร็อพเพอร์ตี้ RTL ที่ต้องการใช้ หากต้องการตั้งค่าพร็อพเพอร์ตี้ ให้เลือกตัวเลือกใดตัวเลือกหนึ่งต่อไปนี้

    • firstStrong: ค่าเริ่มต้นสำหรับมุมมองราก อักขระทิศทางที่เข้มงวดตัวแรกจะเป็นตัวกำหนดทิศทางย่อหน้า หากไม่มีอักขระทิศทางที่เข้มงวด ทิศทางย่อหน้าจะเป็นทิศทางเลย์เอาต์ที่กำหนดของมุมมอง
    • anyRtl: ทิศทางย่อหน้าจะเป็น RTL หากมีอักขระ RTL ที่เข้มงวด ไม่เช่นนั้นจะเป็น LTR หากมีอักขระ LTR ที่เข้มงวด หากไม่มีอักขระทั้ง 2 ประเภท ทิศทางย่อหน้าจะเป็นทิศทางเลย์เอาต์ที่กำหนดของมุมมอง
    • ltr: ทิศทางย่อหน้าจะเป็น LTR
    • rtl: ทิศทางย่อหน้าจะเป็น RTL
    • locale: ทิศทางย่อหน้ามาจากภาษาของระบบ
    • inherit: ค่าเริ่มต้น ใช้ทิศทางที่ตั้งไว้ในรายการหลัก

    หมายเหตุ: อักขระทิศทางที่เข้มงวดมีทิศทางที่กำหนดไว้ล่วงหน้า เช่น อักขระส่วนใหญ่ในชุดตัวอักษรและพยางค์ ตัวเลขที่ไม่ใช่ของยุโรปและที่ไม่ใช่ของอาหรับ อักษรจีน และอักขระเครื่องหมายวรรคตอนที่เฉพาะเจาะจงสำหรับสคริปต์เหล่านั้นเท่านั้น

  3. หากต้องการตรวจสอบข้อความและเลย์เอาต์ที่กลับด้าน ให้เรียกใช้แอป