Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Supporting RTL on Flutter Apps

Supporting RTL on Flutter Apps

This is the slide, "Supporting RTL on Flutter Apps" on mobile seminor.
#flutter #flutterjp #mobile勉強会

Kenichi Kambara

October 17, 2023
Tweet

More Decks by Kenichi Kambara

Other Decks in Technology

Transcript

  1. 2023.10.17


    Kenichi Kambara (@korodroid)
    Mobileษڧձ#11
    Supporting RTL on Flutter Apps

    View full-size slide

  2. About me
    •Mobile App Development


    •Speeches (e.g. 15 Int’l/100+ Domestic)


    •Writings (e.g. 8 Dev Books)


    •[Of
    fi
    cial] Evangelist at NTT TechnoCross


    •[Private] iplatform.org
    Kenichi Kambara (X:@korodroid)

    View full-size slide

  3. About my Flutter product (Private works)
    Sekaiphone Pro(Flutter/Kotlin/Swift) MyToDo(Flutter)

    View full-size slide

  4. My Motivation

    View full-size slide

  5. My Motivation

    English/Japanese…
    4NBSU1IPOF
    -BOHVBHF4FUUJOHT
    Arabic

    View full-size slide

  6. What’s RTL (Right To Left)?

    Google Translation

    View full-size slide

  7. RTL (Right To Left) Speakers

    • Arabic: 310 million speakers/26 countries


    • Urdu: 101 million speakers


    • Hebrew: 9 million speakers


    • and some more…
    LingoHub: https://lingohub.com/academy/best-practices/rtl-language-list

    View full-size slide

  8. My steps for supporting RTL on Flutter

    1. Learning LTR Guidelines


    2. Checking our UI without modi
    fi
    cations


    3. Adding some modi
    fi
    cations


    4. And more…

    View full-size slide

  9. 1. Learning RTL Guidelines

    View full-size slide

  10. 1. Learning RTL Guidelines

    https://m2.material.io/design/usability/bidirectionality.html

    View full-size slide

  11. 2. Checking our UI without modi
    fi
    cations

    View full-size slide

  12. 3. Adding some modi
    fi
    cations

    Image.asset(
    'assets/images/chara.png',
    matchTextDirection: true,
    ),
    on LTR on RTL

    View full-size slide

  13. Supporting RTL for getting more Users
    Conclusion

    View full-size slide

  14. Please let me know if you have any requests

    such as technical speeches, technical writings and so on.
    Facebook:http://fb.com/kanbara.kenichi


    X:@korodroid


    LinkedIn:http://www.linkedin.com/in/korodroid
    Thank you so much

    View full-size slide