Supporting RTL on Flutter Apps 7 Development Tips

This is the slide, "Supporting RTL on Flutter Apps 7 Development Tips" at モバイルエンジニアLT新年会 2024
#モバイルエンジニアLT新年会 #Flutter

Transcript

1. 2024.01.18 Kenichi Kambara (@korodroid) ϞόΠϧΤϯδχΞ LT৽೥ձ 2024 Supporting RTL on Flutter Apps 7 Development Tips
2. About me •Mobile App Development •Speeches (e.g. 16 Int’l/100+ Domestic) •Writings (e.g. 8 Dev Books) •[Of fi cial] Evangelist at NTT TechnoCross •[Private] iplatform.org Kenichi Kambara (X:@korodroid)
3. About my Flutter product (Private works) Sekaiphone Pro(Flutter/Kotlin/Swift) MyToDo(Flutter)
4. My Motivation  English/Japanese… 4ZTUFN
   -BOHVBHF
   4FUUJOHT
   
   
   Arabic
5.  Wear OS ΞϓϦ։ൃೖ໳ with Jetpack Compose 7 Development Tips for supporting RTL
6. Tips1: What’s RTL (Right To Left)?  Google Translation
7. Tips2: Mixing LTR & RTL  https://m2.material.io/design/usability/bidirectionality.html
8.  Tips3: Using Icons
9.  Tips3: Using Icons
10. e.g.  Image.asset( 'assets/images/chara.png', matchTextDirection: true, ), on LTR on RTL
11.  ref. https://api. fl utter.dev/ fl utter/widgets/Image/matchTextDirection.html
12.  Tips4: Managing Layout on LTR on RTL
13. e.g.  Row( children: [ BlueArea(), GreyArea(), ], ), on LTR on RTL
14.  Tips5: Managing TextAlign LTR LTR RTL RTL
15. e.g.  Column( children: [ Text( “Text1", ), Text( “Text2", ), ], ), on LTR on RTL
16. e.g.  Column( children: [ Text( “TextAlign.left", textAlign: TextAlign.left, ), Text( "TextAlign.right", textAlign: TextAlign.right, ), ], ), on LTR on RTL
17.  Tips6: Combined on LTR on RTL •Icon •Layout matchTextDirection: true for reversing Widget The order of each Widget is automatically reversed in Row
18.  Tips7: Deep Dive: more Widgets 8JUIPVU
    DBSJOH
    (MPCBM 8JUI
    DBSJOH
    (MPCBM "MJHONFOU "MJHONFOU%JSFDUJPOBM #PSEFS #PSEFS%JSFDUJPOBM #PSEFS3BEJVT #PSEFS3BEJVT%JSFDUJPOBM &EHF*OTFUT &EHF*OTFUT%JSFDUJPOBM
19. Supporting RTL for getting more Users Conclusion
20. 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