Slide 1

Slide 1 text

2023.11.23 ਆݪ ݈Ұ (@korodroid) ABC 2023 Autumn Go Global with Flutter Apps

Slide 2

Slide 2 text

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 ਆݪ ݈Ұ (X:@korodroid) NEW

Slide 3

Slide 3 text

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

Slide 4

Slide 4 text

ߨԋςʔϚͷഎܠ 

Slide 5

Slide 5 text

 ӳޠ/೔ຊޠ… ୺຤ͷݴޠઃఆ ΞϥϏΞޠ  ߨԋςʔϚͷഎܠ

Slide 6

Slide 6 text

ݴޠͦͷ1(LTR)ͷੈք (ྫ. ΪϦγϟ) 

Slide 7

Slide 7 text

ݴޠͦͷ2(RTL)ͷੈք (ྫ. Τδϓτ/Χλʔϧ) 

Slide 8

Slide 8 text

RTL(Right To Left)ͱ͸?  Google຋༁

Slide 9

Slide 9 text

RTLݴޠͷ࿩ऀ  • 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

Slide 10

Slide 10 text

FlutterΞϓϦʹ͓͚ΔRTLରԠखॱ  1. RTLݴޠ”جૅ”ͷཧղ 2. ࣮૷લʹΞϓϦͷςετ 3. ৄࡉͳཧղˍ࣮૷

Slide 11

Slide 11 text

Wear OS ΞϓϦ։ൃೖ໳ with Jetpack Compose 1. RTLݴޠ”جૅ”ͷཧղ

Slide 12

Slide 12 text

RTLݴޠͷجૅ: Learning Guidelines  https://m2.material.io/design/usability/bidirectionality.html

Slide 13

Slide 13 text

 RTLݴޠͷجૅ: Learning Guidelines

Slide 14

Slide 14 text

 RTLݴޠͷجૅ: Learning Guidelines

Slide 15

Slide 15 text

 RTLݴޠͷجૅ: Learning Guidelines

Slide 16

Slide 16 text

Wear OS ΞϓϦ։ൃೖ໳ with Jetpack Compose 2. ࣮૷લʹΞϓϦͷςετ

Slide 17

Slide 17 text

ίʔυमਖ਼લʹ·ͣ͸”ಈ࡞֬ೝ”  Good Bad

Slide 18

Slide 18 text

ൃݟ͞Εͨ໰୊ͱରॲ(1)  Good Bad

Slide 19

Slide 19 text

ൃݟ͞Εͨ໰୊ͱରॲ(2)  Good Bad

Slide 20

Slide 20 text

ൃݟ͞Εͨ໰୊ͱରॲ(3)  Good Bad

Slide 21

Slide 21 text

Wear OS ΞϓϦ։ൃೖ໳ with Jetpack Compose 3. ৄࡉͳཧղˍ࣮૷

Slide 22

Slide 22 text

Flutterඪ४ͷi18nରԠ( fl utter_localizations) https://docs. fl utter.dev/ui/accessibility-and-internationalization/internationalization 

Slide 23

Slide 23 text

Deep dive 1 (Icon)  b. ϚςϦΞϧ a. ΦϦδφϧ on RTL on LTR

Slide 24

Slide 24 text

a. ΦϦδφϧΞΠίϯ  Image.asset( 'assets/images/chara.png', matchTextDirection: true, ), on LTR on RTL

Slide 25

Slide 25 text

b. ϚςϦΞϧΞΠίϯ  https://api. fl utter.dev/ fl utter/material/Icons-class.html

Slide 26

Slide 26 text

b. ϚςϦΞϧΞΠίϯ 

Slide 27

Slide 27 text

 Icon( Icons.arrow_back, size: 80.0, ), on LTR on RTL b. ϚςϦΞϧΞΠίϯ

Slide 28

Slide 28 text

 Icon( Icons.attach_money, size: 80.0, ), on LTR on RTL b. ϚςϦΞϧΞΠίϯ

Slide 29

Slide 29 text

Deep dive 1 (Icon): ݁Ռ  on LTR on RTL

Slide 30

Slide 30 text

Deep dive 2 (Layout)  Row( children: [ BlueArea(), GreyArea(), ], ), on LTR on RTL

Slide 31

Slide 31 text

Deep dive 2 (Layout)  on LTR on RTL Row( mainAxisAlignment: MainAxisAlignment.start, children: [ BlueArea(), GreyArea(), ], ), Row( mainAxisAlignment: MainAxisAlignment.end, children: [ BlueArea(), GreyArea(), ], ),

Slide 32

Slide 32 text

Deep dive 2 (Layout): ݁Ռ  on LTR on RTL

Slide 33

Slide 33 text

 on LTR on RTL 㲔 㲔 Deep dive 2 (Layout): ݁Ռ چόʔδϣϯ

Slide 34

Slide 34 text

Deep dive 3 (Text)  Column( children: [ Text( “Text1", ), Text( “Text2", ), ], ), on LTR on RTL

Slide 35

Slide 35 text

Deep dive 3 (Text)  Column( children: [ Text( “TextAlign.left", textAlign: TextAlign.left, ), Text( "TextAlign.right", textAlign: TextAlign.right, ), ], ), on LTR on RTL

Slide 36

Slide 36 text

 چόʔδϣϯ LTR LTR RTL RTL Deep dive 3 (Text): ݁Ռ ৽όʔδϣϯ

Slide 37

Slide 37 text

ࠃࡍԽରԠͰ͞Βʹଟ͘ͷϢʔβ΁Ϧʔν Go Global 🚀 ·ͱΊ

Slide 38

Slide 38 text

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