์‹œ๋ฆฌ์ฆˆ

[Flutter] Key

20210122
dart
flutter
globalkey
key
localkey
objectkey
valuekey

๐Ÿ—️

keys

https://flutter.dev/docs/development/ui/widgets-intro#keys

https://www.youtube.com/watch?v=kn0EOS-ZiIc&list=PLOU2XLYxmsIJyiwUPCou_OVTpRIn_8UMd&index=5

https://api.flutter.dev/flutter/foundation/Key-class.html

ํ‚ค๋ฅผ ์–ธ์ œ ์“ฐ๋Š”๊ฐ€?

adding, removing , reordering collection of stateful widgets in same type.

์ •๋„๋กœ ์ดํ•ดํ•˜๋Š” ๊ฒฝ์šฐ๊ฐ€ ์žˆ๋‹ค.

StatefulWidget ์ด๋ผ๋„ ํ‚ค๊ฐ€ ํ•„์š”์—†๋Š” ๊ฒฝ์šฐ๊ฐ€ ์žˆ๋‹ค.

state ๋ฅผ ์“ฐ์ง€ ์•Š๊ณ  widget์—๋งŒ ๋ณ€์ˆ˜๊ฐ€ ์žˆ์„ ๋•Œ๋Š” ํ•„์š”์—†๋‹ค.

์ดํ›„์—๋Š” state๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ์ง„์งœ statefulwidget๋งŒ ์ทจ๊ธ‰ํ•˜๊ฒ ๋‹ค.

์–ด๋””์— ํ‚ค๋ฅผ ๋†“์„๊นŒ?

์œ ์ง€ํ•ด์•ผ ํ•  ์„œ๋ธŒํŠธ๋ฆฌ์˜ ๊ฐ€์žฅ ์ƒ๋‹จ.

(at the top of the widget subtree you need to preserve)

๊ฐ€์žฅ ์ตœ์ƒ์œ„์— ์žˆ๋Š” stateful ์œ„์ ฏ์ด ์•„๋‹ˆ๋‹ค.

์•„๋ž˜ ์ฝ”๋“œ๋Š” ํŒจ๋”ฉ์„ ๋„ฃ์—ˆ์„ ๋•Œ ๋žœ๋คํ•˜๊ฒŒ ๊ณ„์† ์ƒ‰์ด ๋ฐ”๋€Œ๋Š” ์˜ˆ์ œ์ด๋‹ค.

์—ฌ๊ธฐ์„œ๋Š” ํŒจ๋”ฉ์— ํ‚ค๋ฅผ ๋„ฃ์–ด์ค˜์•ผ ํ•œ๋‹ค.

์–ด๋–ค ํ‚ค๋ฅผ ์“ธ ๊นŒ?

์œ„์ ฏ ํด๋ž˜์Šค(state ํด๋ž˜์Šค ๋ง๊ณ ) ์— ์žˆ๋Š” ๋‹ค๋ฅธ ๋ฐ์ดํ„ฐ๊ฐ€ ์žˆ์œผ๋ฉด ๊ทธ๊ฒƒ์„ ๊ธฐ์ค€์œผ๋กœ ์‚ผ์„ ์ˆ˜ ์žˆ๋‹ค.

  • LocalKey - ๊ฐ™์€ ๋ถ€๋ชจ๋ฅผ ๊ฐ€์ง„ Element ๋ผ๋ฆฌ uniqueํ•ด์•ผ ํ•œ๋‹ค.
    • ValueKey - ํ•˜๋‚˜์˜ primitive ๋ณ€์ˆ˜
    • ObjectKey - ํ•˜๋‚˜์˜ ๊ฐ์ฒด ๋ณ€์ˆ˜
    • UniqueKey - ๊ธฐ์ค€์ด ๋˜๋Š” ๋ฐ์ดํ„ฐ๊ฐ€ ์—†์„ ๋•Œ
  • GlobalKey - ์ „์ฒด ์•ฑ —> ๋ฏผ๊ฐํ•œ ๋ฐ์ดํ„ฐ๋ฅผ ๋‹ค๋ฃจ๋Š” ์œ„์ ฏ์ธ ๊ฒฝ์šฐ์—๋Š” bloc, provider ๊ฐ™์€ ๋‹ค๋ฅธ ๋ฐฉ์‹์„ ์•Œ์•„๋ณด๋Š”๊ฒŒ ๋‚ซ๋‹ค.

.

piano (press key Q)

Categories

flutter ( 82 ) dart ( 34 ) android ( 32 ) kotlin ( 11 ) plugin ( 8 ) provider ( 8 ) vim ( 7 ) bloc ( 6 ) iOS ( 6 ) state management ( 6 ) ํ”Œ๋Ÿฌํ„ฐ ( 6 ) PS ( 5 ) algorithm ( 5 ) architecture ( 5 ) async ( 5 ) getx ( 5 ) java ( 5 ) API ( 4 ) BOJ ( 4 ) class ( 4 ) daily ( 4 ) git ( 4 ) golang ( 4 ) memo ( 4 ) riverpod ( 4 ) state ( 4 ) stream ( 4 ) test ( 4 ) web ( 4 ) widget ( 4 ) windows ( 4 ) HTTP ( 3 ) androidX ( 3 ) app state ( 3 ) context ( 3 ) crash ( 3 ) db ( 3 ) editor ( 3 ) error ( 3 ) extension ( 3 ) github ( 3 ) hive ( 3 ) ide ( 3 ) package ( 3 ) pubspec ( 3 ) python ( 3 ) syntax ( 3 ) vscode ( 3 ) app icon ( 2 ) await ( 2 ) chocolatey ( 2 ) consumer ( 2 ) cp949 ( 2 ) deployment ( 2 ) dev ( 2 ) flavor ( 2 ) gesture ( 2 ) globalkey ( 2 ) go ( 2 ) google ( 2 ) hack ( 2 ) js ( 2 ) json ( 2 ) key ( 2 ) keystore ( 2 ) list ( 2 ) listview ( 2 ) lock ( 2 ) mac ( 2 ) map ( 2 ) navigation ( 2 ) nosql ( 2 ) project ( 2 ) pub ( 2 ) recyclerview ( 2 ) rxdart ( 2 ) sdk ( 2 ) selector ( 2 ) setting ( 2 ) size ( 2 ) soc ( 2 ) synchronized ( 2 ) tdd ( 2 ) tip ( 2 ) version ( 2 ) viewmodel ( 2 ) vundle ( 2 ) webview ( 2 ) xcode ( 2 ) yaml ( 2 ) ์ฑ… ( 2 ) ํ”Œ๋Ÿฌํ„ฐ ๋‹จ์  ( 2 ) 16.0 ( 1 ) 2.0 ( 1 ) 2023 ( 1 ) AATP2 ( 1 ) ChangeNotifierProvider ( 1 ) Example ( 1 ) Guava ( 1 ) ImageReader ( 1 ) Mo's algorithm ( 1 ) OAuth2 ( 1 ) OpenGL ( 1 ) Oreo ( 1 ) ProgressBar ( 1 ) REST API ( 1 ) Trie ( 1 ) activity ( 1 ) adaptive ( 1 ) android P ( 1 ) android context ( 1 ) android11 ( 1 ) apktool2 ( 1 ) app exit ( 1 ) append ( 1 ) appicon ( 1 ) arkit ( 1 ) array ( 1 ) asciidoc ( 1 ) async * ( 1 ) async* ( 1 ) audio ( 1 ) authorization ( 1 ) await for ( 1 ) behaviorsubject ( 1 ) beta ( 1 ) binary ( 1 ) binarysearch ( 1 ) blender ( 1 ) book ( 1 ) bottomsheet ( 1 ) break ( 1 ) broadcast ( 1 ) browser ( 1 ) bubbles ( 1 ) bug ( 1 ) build ( 1 ) buildcontext ( 1 ) buildnumber ( 1 ) bundle ( 1 ) button ( 1 ) bytecode ( 1 ) cache ( 1 ) camera2 ( 1 ) cameramanager ( 1 ) cd ( 1 ) chrome ( 1 ) ci ( 1 ) circle ( 1 ) clean ( 1 ) clean architecture ( 1 ) cli ( 1 ) clip ( 1 ) clipboard ( 1 ) cloud ide ( 1 ) cmdlet ( 1 ) code ( 1 ) coding test ( 1 ) command ( 1 ) comparator ( 1 ) complexity ( 1 ) concurrency ( 1 ) conditional ( 1 ) const ( 1 ) constraint ( 1 ) constraintlayout ( 1 ) controlc ( 1 ) controlv ( 1 ) converter ( 1 ) copy ( 1 ) copy project ( 1 ) coupling ( 1 ) coverage ( 1 ) cp ( 1 ) css ( 1 ) cupertino ( 1 ) cursor ( 1 ) cv ( 1 ) data class ( 1 ) data structure ( 1 ) dataBinding ( 1 ) database ( 1 ) debounce ( 1 ) decompile ( 1 ) delegate ( 1 ) deno ( 1 ) design pattern ( 1 ) development ( 1 ) device ( 1 ) di ( 1 ) dialog ( 1 ) dio ( 1 ) drawable ( 1 ) drug ( 1 ) emmet ( 1 ) encoding ( 1 ) english ( 1 ) entries ( 1 ) environment ( 1 ) equality ( 1 ) equatable ( 1 ) euc-kr ( 1 ) euckr ( 1 ) exit ( 1 ) expand ( 1 ) expanded ( 1 ) export ( 1 ) extension method ( 1 ) facade ( 1 ) fake ( 1 ) field ( 1 ) figma ( 1 ) final ( 1 ) fixed ( 1 ) flutter pub ( 1 ) flutter web ( 1 ) flutter_inappwebview ( 1 ) flutter_test ( 1 ) flutterflow ( 1 ) fold ( 1 ) fonts ( 1 ) form ( 1 ) frame ( 1 ) future ( 1 ) gestureDetector ( 1 ) gestureRecognizer ( 1 ) gesturearena ( 1 ) get-command ( 1 ) get_cli ( 1 ) getbuilder ( 1 ) getx๋‹จ์  ( 1 ) gitignore ( 1 ) glut ( 1 ) google fonts ( 1 ) gopath ( 1 ) goto ( 1 ) gradient ( 1 ) graphics ( 1 ) gvim ( 1 ) hackaton ( 1 ) hash ( 1 ) hashmap ( 1 ) hot reload ( 1 ) how to ( 1 ) html ( 1 ) i18n ( 1 ) icon ( 1 ) id ( 1 ) impeller ( 1 ) implementation ( 1 ) import ( 1 ) indicator ( 1 ) inkwell ( 1 ) interrupt ( 1 ) intl ( 1 ) introduction ( 1 ) io ( 1 ) isar ( 1 ) iterable ( 1 ) iteration ( 1 ) javascript ( 1 ) julia ( 1 ) juno ( 1 ) jupyter ( 1 ) kakaomap ( 1 ) keytool ( 1 ) korean ( 1 ) kotlin syntax ( 1 ) l10n ( 1 ) lambda ( 1 ) language ( 1 ) layer ( 1 ) layout ( 1 ) lineageOS ( 1 ) localkey ( 1 ) localtoglobal ( 1 ) long list ( 1 ) ls ( 1 ) mac osx ( 1 ) markdown ( 1 ) markup ( 1 ) material ( 1 ) method ( 1 ) microtask ( 1 ) migrate ( 1 ) mintlify ( 1 ) mock ( 1 ) module ( 1 ) monitor ( 1 ) moor ( 1 ) mouse ( 1 ) mouseregion ( 1 ) multiplatform ( 1 ) multiset ( 1 ) multithread ( 1 ) mutable ( 1 ) mvvm ( 1 ) new ( 1 ) node ( 1 ) nodejs ( 1 ) nosuchmethod ( 1 ) null-safety ( 1 ) numberformat ( 1 ) nvim ( 1 ) object ( 1 ) objectbox ( 1 ) objectkey ( 1 ) obx ( 1 ) online ide ( 1 ) operator ( 1 ) orientation ( 1 ) parabeac ( 1 ) parse ( 1 ) paste ( 1 ) path ( 1 ) pattern ( 1 ) pitfall ( 1 ) play store ( 1 ) pod ( 1 ) podfile ( 1 ) pointer ( 1 ) pointers ( 1 ) powershell ( 1 ) private ( 1 ) programming ( 1 ) pull to refresh ( 1 ) puzzle ( 1 ) pycharm ( 1 ) realitykit ( 1 ) recursion ( 1 ) reduce ( 1 ) reference ( 1 ) regex ( 1 ) regular expression ( 1 ) release note ( 1 ) renderbox ( 1 ) renderobject ( 1 ) repl ( 1 ) repository ( 1 ) response ( 1 ) rm ( 1 ) rotue ( 1 ) round ( 1 ) run ( 1 ) scope ( 1 ) scroll ( 1 ) search ( 1 ) server ( 1 ) serverless ( 1 ) service ( 1 ) sharp ( 1 ) singlerepo ( 1 ) singleton ( 1 ) sketch ( 1 ) sliver ( 1 ) sliverlist ( 1 ) snippets ( 1 ) sogae ( 1 ) sorting ( 1 ) source ( 1 ) sparse ( 1 ) sparse array ( 1 ) spec ( 1 ) split ( 1 ) sqflite ( 1 ) sqlite ( 1 ) sqrt decomposition ( 1 ) stateful ( 1 ) statefulwidget ( 1 ) step ( 1 ) stepper ( 1 ) string ( 1 ) stringbuffer ( 1 ) stringbuilder ( 1 ) studio ( 1 ) study ( 1 ) sub-directory ( 1 ) svn ( 1 ) swiftui ( 1 ) swipe to refresh ( 1 ) system_alert_window ( 1 ) system_cache ( 1 ) systemnavigator ( 1 ) tail recursion ( 1 ) tailrec ( 1 ) tap test ( 1 ) text ( 1 ) texteditingcontroller ( 1 ) textfield ( 1 ) texttheme ( 1 ) themedata ( 1 ) then ( 1 ) thread ( 1 ) throttle ( 1 ) time ( 1 ) tool ( 1 ) tools ( 1 ) tooltip ( 1 ) ts ( 1 ) tutorial ( 1 ) typescript ( 1 ) ui ( 1 ) unittest ( 1 ) update ( 1 ) usb ( 1 ) utf8 ( 1 ) ux ( 1 ) valuekey ( 1 ) variable ( 1 ) vector ( 1 ) versioncode ( 1 ) very_good ( 1 ) view ( 1 ) vim plugin ( 1 ) vimrc ( 1 ) virtualenv ( 1 ) wasm ( 1 ) web app ( 1 ) webview_flutter ( 1 ) while ( 1 ) widget tree ( 1 ) window ( 1 ) wsl ( 1 ) yield ( 1 ) ๊ฐ•์˜ ( 1 ) ๊ฐœ๋ฐœ ( 1 ) ๊ฐœ๋ฐœ ๊ณต๋ถ€ ( 1 ) ๊ณต๋ถ€๋ฒ• ( 1 ) ๊ทธ๋ž˜ํ”ฝ์Šค ( 1 ) ๊ผฌ๋ฆฌ์žฌ๊ท€ ( 1 ) ๊ฟ€ํŒ ( 1 ) ๋ฐ๋…ธ ( 1 ) ๋‘์ค„ ( 1 ) ๋””๋…ธ ( 1 ) ๋ฒˆ์—ญ ( 1 ) ๋ธ”๋ก ( 1 ) ์ƒํƒœ๊ด€๋ฆฌ ( 1 ) ์‹คํ—˜ ( 1 ) ์•ˆ๋“œ๋กœ์ด๋“œ ( 1 ) ์•ˆ๋“œ๋กœ์ด๋“œํ”„๋กœ์ ํŠธ ( 1 ) ์•ˆ๋“œ๋กœ์ด๋“œํ”„๋กœ์ ํŠธ๋ณต์‚ฌ ( 1 ) ์–ด์ด์—†๋Š” ( 1 ) ์กฐ๊ฑด๋ถ€ ์ž„ํฌํŠธ ( 1 ) ์ฃผ์ ˆ์ฃผ์ ˆ๋ถ„๋…ธ์กฐ์ ˆ์‹คํŒจ์˜์‹์œผํ๋ฆ„ ( 1 ) ํŒจํ‚ค์ง€ ( 1 ) ํ”„๋กœ์ ํŠธ๋ณต์‚ฌ ( 1 ) ํ”Œ๋Ÿฌ๊ทธ์ธ ( 1 )