خوب دوستان عزیز بریم سراغ یکی از ویجت های جذاااااب فلاتر یعنی Hero
ادم با شنیدن اسم این ویجت یاد بازی Dota می افته :) در فلاتر با استفاده Hero انیمیشنی موقع جابه جایی بین صفحات به وِیجت مورد نظر داده می شود
بی وقفه بریم سراغ کد نویس ان
در صفحه ی اول این کد را به ایکون مورد نظر می دهیم و یک ایدی در پارامتر tag به ان می دهیم تا بتوانیم در صفحه ی دوم ان را به ویجتی مورد نظر بشناسانیم و انیمیشن را ایجاد کنیم
Hero( tag: "DemoTag", child: Icon( Icons.add, size: 70.0, ), ),
در صفحه ی دوم کافی است به همین شکل عمل کنید
Hero( tag: "DemoTag", child: Icon( Icons.add, size: 150.0, ), ),
و خروجی ان
اما این روش استاندارد ان است کلی میشه شخصی سازی کرد به طور مثال دوست دارید قبل از ان که ویجت با انیمیشن به مکان مورد نظر برسد در صفحه ی دوم عکس العملی وجود داشته باشد کد زیر و خروجی ان را دقت کنید
Hero( tag: "DemoTag", child: Icon( Icons.add, size: 150.0, ), placeholderBuilder: (context, widget) { return Container( height: 150.0, width: 150.0, child: CircularProgressIndicator(), ); }, ),
با استفاده از placeholderBuilder به راحتی این کار شدنی است شما هر ویجت دیگه ای هم می تونید جایگزینش کنید یک مثال دیگه
فرض کنید می خواهید این ویجت که در اینجا ایکون ماست در مسیر به شکل دیگر باشد خوب کافی است از کد زیر استفاده کنید
Hero( tag: "DemoTag", child: Icon( Icons.add, size: 150.0, ), flightShuttleBuilder: (flightContext, animation, direction, fromContext, toContext) { return Icon(FontAwesomeIcons.rocket, size: 150.0,); }, ),
با استفاده از flightShuttleBuilder به راحتی حرکت بین صفحه را با ویجت مورد نظر میشه مدیریت کرد
خسته که نشدی ؟ وقتی در مورد Hero میخونی خودت هم باید توی زندگی Hero باشی :)
حالا اگر بخواهی مسیر رفت و برگشت را مدیریت کنی فقط کافی است از کد زیر استفاده کنید
if(direction == HeroFlightDirection.push) { return Icon( FontAwesomeIcons.rocket, size: 150.0, ); } else if (direction == HeroFlightDirection.pop){ return Icon( FontAwesomeIcons.rocket, size: 70.0, ); }
زمان رفت از Push و برگشت از Pop
وکلی کار ها و شخصی سازی دیگر که به طور نمونه
به همین سادگی به همین خوشمزگی.
و اگر براتون مفید بوده ان را با دوستاتون در لینکدین تلگرام و و و انتشار دهید تا به طرفداران فلاتر روز به روز افزوده شود
روز های زیبا و جذاااااااااااااااااابی داشته باشید قلب یادتون نره :)
نوشته شده توسط پژمان حاجی حیدری یک دوستدار برنامه نویسی
ایدی کانال برای دسترسی به تمام اموزش ها @Learnpg
لینک کانال https://t.me/joinchat/AAAAAFDR-mppe-ciC6X1Qg
ایدی تلگرام بنده @pejmanprogrammer