Flutter 플러터에서의 오른쪽에서 왼쪽 (RTL), right-to-left (RTL) in flutter

질문

나는 한 주 이상 동안 플러터를 사용하고 있었고, 아랍어 (오른쪽에서 왼쪽으로) 앱을 만들고 싶었습니다.

플러터 앱 국제화를 읽었지만, 레이아웃 방향을 설정하는 방법에 대해 언급되지 않았습니다.

그래서 플러터에서 오른쪽에서 왼쪽 (RTL) 레이아웃을 어떻게 보여줄 수 있을까요?

답변

두 가지 선택지가 있습니다 :

1. 모든 장치에 로캘 (및 방향)을 강제로 지정

-- 방법 1: 로컬라이제이션 사용

flutter_localizations 패키지를 pubspec.yml에 추가하십시오.

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter

그런 다음

import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';

MaterialApp(
  localizationsDelegates: [
    GlobalCupertinoLocalizations.delegate,
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
  ],
  supportedLocales: [
    Locale("fa", "IR"), // 또는 Locale('ar', 'AE') 또는 기타 RTL 로케일
  ],
  locale: Locale("fa", "IR") // 또는 Locale('ar', 'AE') 또는 기타 RTL 로케일,
  .
  .
  .
);

-- 방법 2: 로컬라이제이션 없이

MaterialApp(
  .
  .
  .
  builder: (context, child) {
    return Directionality(
      textDirection: TextDirection.rtl,
      child: child,
    );
  },
  .
  .
  .
);

2. 장치 로케일에 따라 레이아웃 방향 설정 (사용자 전화 로케일이 RTL 언어이고 supportedLocales에 있는 경우, 앱은 RTL 모드로 실행되고 그렇지 않으면 앱은 LTR입니다.)

flutter_localizations 패키지를 pubspec.yml에 추가하십시오.

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter

그런 다음

import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';

MaterialApp(
  localizationsDelegates: [
    GlobalCupertinoLocalizations.delegate,
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
  ],
  supportedLocales: [
    Locale("en", "US"),
    Locale("fa", "IR"), // 또는 Locale('ar', 'AE') 또는 기타 RTL 로케일
  ],
  .
  .
  .
);

참고 : 플러터에서 RTL 언어는 다음과 같습니다:

[
  'ar', // 아랍어
  'fa', // 페르시아어
  'he', // 히브리어
  'ps', // 파슈토어
  'ur', // 우르두어
];