জেটপ্যাক কম্পোজ ডেভেলপারদের জন্য ফ্লাটার: সম্পূর্ণ ব্যবহারিক নির্দেশিকা

হোম » পাইথন » জেটপ্যাক কম্পোজ ডেভেলপারদের জন্য ফ্লাটার: সম্পূর্ণ ব্যবহারিক নির্দেশিকা

যদি আপনি ইতিমধ্যেই Jetpack Compose দিয়ে UI লেখার সময় স্বাচ্ছন্দ্য বোধ করেন এবং Flutter-এ স্থানান্তর করা কতটা কঠিন তা ভাবছেন, তাহলে আপনি একটি দুর্দান্ত অবস্থানে আছেন। উভয় টুলকিটই ঘোষণামূলক, প্রতিক্রিয়াশীল এবং গুগল দ্বারা নির্মিত, তাই আপনার মানসিক মডেলের একটি বিশাল অংশ প্রায় এক থেকে এক বহন করে। মূল পার্থক্যগুলি ভাষা (কোটলিন বনাম ডার্ট), প্রকল্পের কাঠামো এবং প্রতিটি ফ্রেমওয়ার্ক কীভাবে অন্তর্নিহিত অ্যান্ড্রয়েড (এবং, ফ্লটারের ক্ষেত্রে, iOS, ওয়েব এবং ডেস্কটপ) স্তরগুলির সাথে কথা বলে তার মধ্যে রয়েছে।

এই নির্দেশিকাটি বিশেষভাবে জেটপ্যাক কম্পোজ ডেভেলপারদের জন্য লেখা হয়েছে যারা ফ্লাটারকে গভীরভাবে বুঝতে চান, মার্কেটিং ফ্লাফ ছাড়াই। আপনি দেখতে পাবেন কিভাবে মূল ধারণাগুলি দুটি জগতের মধ্যে ম্যাপ করে: কম্পোজেবল বনাম উইজেট, মডিফায়ার বনাম কনস্ট্রাক্টর প্যারামিটার, লেজি লেআউট বনাম লিস্টভিউ/গ্রিডভিউ, ক্যানভাস বনাম কাস্টমপেইন্টার, নেভিগেশন কম্পোজ বনাম নেভিগেটর, রিমেম্বার বনাম স্টেটফুলউইজেট এবং আরও অনেক কিছু। আমরা আপনার বিস্তৃত অ্যান্ড্রয়েড ব্যাকগ্রাউন্ড (ভিউ, লাইফসাইকেল, রিসোর্স, ইন্টেন্ট, ব্যাকগ্রাউন্ড ওয়ার্ক) তাদের ফ্লটার সমতুল্যের সাথে সংযুক্ত করব যাতে শেখার বক্ররেখাটি আরোহণের চেয়ে পার্শ্ববর্তী ধাপের মতো মনে হয়।

জেটপ্যাক কম্পোজ থেকে ফ্লটারে: যেখানে আপনার দক্ষতা স্থানান্তরিত হয়

ডার্ট ভাষা ব্যবহার করে ক্রস-প্ল্যাটফর্ম অ্যাপ তৈরির জন্য ফ্লটার হল গুগলের UI ফ্রেমওয়ার্ক, অন্যদিকে জেটপ্যাক কম্পোজ হল কোটলিন ব্যবহার করে নেটিভ অ্যান্ড্রয়েডের জন্য গুগলের আধুনিক UI টুলকিট। আড়ালে তারা বিভিন্ন রানটাইম লক্ষ্য করে, কিন্তু স্থাপত্যের দিক থেকে তারা একই বড় ধারণা ভাগ করে নেয়: UI কে রাষ্ট্রের একটি ফাংশন হিসাবে বর্ণনা করুন, ফ্রেমওয়ার্ককে কখন এবং কীভাবে পুনরায় আঁকতে হবে তা নির্ধারণ করতে দিন।

জেটপ্যাক কম্পোজে আপনি কম্পোজেবল ফাংশন, মডিফায়ার এবং রিকম্পোজিশনের পরিপ্রেক্ষিতে চিন্তা করেন; ফ্লটারে আপনি উইজেট, কনস্ট্রাক্টর প্যারামিটার এবং পুনর্নির্মাণের পরিপ্রেক্ষিতে চিন্তা করেন। ভিন্ন ভিন্ন নামকরণ সত্ত্বেও, আচরণটি লক্ষণীয়ভাবে একই রকম: আপনি UI উপাদানের একটি ট্রি তৈরি করেন, প্রতিটি নোড অপরিবর্তনীয় থাকে এবং যখন state পরিবর্তন করে তখন ফ্রেমওয়ার্কটি আবার সেই ট্রিতে চলে যায় এবং একটি আপডেটেড ইন্টারফেস তৈরি করে।

একটি মূল পার্থক্য হল, ফ্লাটার ডিজাইনের দিক থেকে ক্রস-প্ল্যাটফর্ম। একই ডার্ট কোডবেস অ্যান্ড্রয়েড, আইওএস, ওয়েব, উইন্ডোজ, ম্যাকওএস এবং লিনাক্সকে লক্ষ্য করতে পারে। কম্পোজ অ্যান্ড্রয়েডের বাইরেও প্রসারিত হচ্ছে (উদাহরণস্বরূপ কম্পোজ মাল্টিপ্ল্যাটফর্মের সাথে), কিন্তু ফ্লটারের মাল্টি-ডিভাইসের গল্পটি এখন অনেক বেশি পরিপক্ক এবং সুসংহত, ঠিক এই কারণেই অনেক অ্যান্ড্রয়েড-প্রথম দল যখন iOS বা ডেস্কটপে পাঠাতে চায় তখন এটির দিকে নজর দেয়।

ফ্লাটার প্রকল্পগুলিতে অ্যান্ড্রয়েড প্ল্যাটফর্ম সম্পর্কে আপনার ধারণা এখনও অত্যন্ত মূল্যবান। যদিও UI স্তরটি সম্পূর্ণরূপে Dart এবং উইজেট, Flutter অনুমতি, সিস্টেম কনফিগারেশন, প্ল্যাটফর্ম API, বিজ্ঞপ্তি, ব্যাকগ্রাউন্ড কাজ এবং অন্যান্য অনেক ক্ষমতার জন্য Android (এবং iOS) এর উপর নির্ভর করে, যা প্লাগইন এবং প্ল্যাটফর্ম চ্যানেলের মাধ্যমে অ্যাক্সেস করা যায়। এর অর্থ হল Android কীভাবে আচরণ করে সে সম্পর্কে আপনার তৈরি করা সমস্ত অন্তর্দৃষ্টি নষ্ট হয় না - এটি কেবল একটি স্তরকে নীচে সরিয়ে দেয়।

ঘোষণামূলক UI মডেল: কম্পোজেবল বনাম উইজেট

জেটপ্যাক কম্পোজ এবং ফ্লাটার উভয়ই একটি ঘোষণামূলক UI মডেল বাস্তবায়ন করে: আপনি একটি নির্দিষ্ট অবস্থার জন্য UI "কিভাবে" দেখা উচিত তা বর্ণনা করেন, ধাপে ধাপে ভিউ পরিবর্তন করার "কিভাবে" তা নয়। ভিউতে সেটারদের ডাকার পরিবর্তে, যখন অবস্থা পরিবর্তন হয় তখন আপনি আপনার ট্রি পুনর্নির্মাণ করেন এবং ফ্রেমওয়ার্কটিকে দক্ষতার সাথে আলাদা এবং পুনরায় অঙ্কন করতে দেন।

জেটপ্যাক কম্পোজে, UI উপাদানগুলি হল কম্পোজেবল ফাংশন যা টীকাযুক্ত @Composable, প্রায়শই একটি দিয়ে কনফিগার করা হয় Modifier. একটি বোতাম হতে পারে Button(onClick = ..., modifier = Modifier.padding(16.dp))। মডিফায়ার চেইনটি একটি কম্পোজেবলকে তার অন্তর্নিহিত ধরণ পরিবর্তন না করেই সাজায় বা লেআউট করে, এবং কম্পোজ শুধুমাত্র গাছের সেই অংশগুলিকে রিফ্রেশ করার জন্য রিকম্পোজিশন ব্যবহার করে যার ইনপুট পরিবর্তিত হয়েছে।

ফ্লটারে, UI উপাদানগুলি হল উইজেট—প্লেইন ডার্ট অবজেক্ট যা কনফিগারেশন বর্ণনা করে। এগুলি অপরিবর্তনীয় এবং একটি ট্রিতে সাজানো থাকে, তবে একটি মডিফায়ার পাস করার পরিবর্তে আপনি সাধারণত কনস্ট্রাক্টর প্যারামিটারের মাধ্যমে সরাসরি লেআউট বা স্টাইলিং আর্গুমেন্ট পাস করেন, অথবা আপনি অন্য লেআউট উইজেটে একটি উইজেট মোড়ানো করেন। উদাহরণস্বরূপ, আপনি লিখতে পারেন Padding(padding: EdgeInsets.all(16), child: ElevatedButton(...)) অনুরূপ ফলাফল অর্জন করতে।

কম্পোজেবল এবং উইজেট উভয়ের জীবনচক্র ইচ্ছাকৃতভাবে স্বল্পস্থায়ী এবং অপরিবর্তনীয়। এগুলি কেবল ততক্ষণ পর্যন্ত বেঁচে থাকে যতক্ষণ না নতুন ইনপুট তাদের প্রতিস্থাপনের প্রয়োজন হয়; কেউই তাদের নিজস্ব জীবনকাল পরিচালনা করার বা সরাসরি নিজেকে পরিবর্তিত করার চেষ্টা করে না। এটি পুরানো অ্যান্ড্রয়েড ভিউ জগৎ থেকে একটি ধারণাগত পরিবর্তন যেখানে ভিউগুলি দীর্ঘস্থায়ী বস্তু, সময়ের সাথে সাথে পুনরায় ব্যবহৃত এবং পরিবর্তিত হয়, এবং এই কারণেই আপনার কম্পোজ মানসিকতা ফ্লটারে এত স্বাভাবিক বলে মনে হয়।

মূল কথা হলো, উভয় ফ্রেমওয়ার্কের লেআউট একই প্যারেন্ট-চালিত, সীমাবদ্ধতা-ভিত্তিক প্যাটার্ন অনুসরণ করে। পিতামাতা নিজেকে পরিমাপ করেন, সীমাবদ্ধতাগুলি অতিক্রম করেন, শিশুরা সেই সীমাবদ্ধতাগুলি মেনে একটি আকার বেছে নেয় এবং পিতামাতা তার সন্তানদের অবস্থান নির্ধারণ করে। Flutter-এ আপনি এটি সরাসরি দেখতে পাবেন যেমন BoxConstraints; কম্পোজে এটি MeasurePolicy বাস্তবায়নে পরিচালিত হয়। উভয় ক্ষেত্রেই, বাবা-মায়েরা শিশুদের সীমাবদ্ধ করতে পারেন—উইজেটগুলি কেবল তাদের পছন্দের কোনও আকার বা অবস্থান বেছে নিতে পারে না।

একটি অ্যাপ গঠন: প্রবেশ বিন্দু, ভারা এবং লেআউট

কম্পোজ সহ অ্যান্ড্রয়েডে, আপনার প্রবেশ বিন্দু সাধারণত একটি Activity (প্রায়শই একটি ComponentActivity) যেখানে আপনি কল করবেন setContent তোমার কম্পোজেবলগুলো হোস্ট করার জন্য। সেখান থেকে আপনি কম্পোজেবল ট্রি তৈরি করেন, সাধারণত a দিয়ে শুরু করেন MaterialTheme এবং একটি পৃষ্ঠ বা ভারা যা আপনার উচ্চ-স্তরের বিন্যাসকে সংজ্ঞায়িত করে।

ফ্লাটারে, প্রবেশ বিন্দু হল একটি ডার্ট main কল করার ফাংশন runApp আপনার অ্যাপ্লিকেশনের রুট উইজেট সহ। সেই মূলটি সাধারণত একটি MaterialApp or WidgetsApp উইজেট, যা রাউটিং, থিমিং, স্থানীয়করণ এবং বেস নেভিগেটর সেট আপ করে। আপনার দেখানো প্রথম "স্ক্রিন" প্রায়শই একটি ব্যবহার করে Scaffold উইজেট, যা এর অনুরূপ ভূমিকা পালন করে Scaffold ম্যাটেরিয়াল ৩ কম্পোজে: এটি আপনাকে অ্যাপ বার, বডি, ফ্লোটিং অ্যাকশন বোতাম, ড্রয়ার এবং আরও অনেক কিছু দেয়।

সাধারণ টেক্সট এবং স্ট্যাটিক কন্টেন্টের জন্য, কম্পোজ ডিফল্টভাবে কন্টেন্ট মোড়ানোর জন্য ব্যবহার করা যেতে পারে—অভ্যন্তরীণ কন্টেন্টের সাথে আকার মেলানোর জন্য—যেখানে অনেক ফ্লাটার উইজেট ডিফল্টভাবে আরও বেশি উপলব্ধ স্থান নেয় যদি না সীমাবদ্ধ থাকে। উদাহরণস্বরূপ, যদি আপনি একটি স্থাপন করেন Text একটি কলামের ভিতরে কম্পোজেবল, এটি স্বয়ংক্রিয়ভাবে প্রস্থ পূরণ করবে না। Flutter-এ, a Text ভিতরে a Column এর পিতামাতার সীমাবদ্ধতার উপর নির্ভর করে ভিন্নভাবে আচরণ করতে পারে। Flutter-এ বিষয়বস্তু কেন্দ্রীভূত করার জন্য, আপনি প্রায়শই জিনিসগুলিকে একটিতে মুড়ে ফেলবেন Center উইজেট, অথবা লেআউট উইজেট ব্যবহার করুন যেমন Align, Row, Column, এবং Expanded সারিবদ্ধকরণ বৈশিষ্ট্যের সাথে মিলিত।

লিনিয়ার লেআউট ম্যাপ প্রায় নিখুঁতভাবে তৈরি করে: কম্পোজে আছে Row এবং Column, এবং ফ্লাটারও তাই করে। ফ্লাটারে তুমি বাচ্চাদেরকে একজন হিসেবে পাস করো List<Widget> এবং এর মতো বৈশিষ্ট্যগুলির সাথে ব্যবধান এবং সারিবদ্ধকরণ নিয়ন্ত্রণ করুন MainAxisAlignment এবং CrossAxisAlignmentCompose-এ, আপনি নির্ভর করেন horizontalArrangement, verticalArrangement, horizontalAlignment এবং verticalAlignment। এটি সম্পর্কে চিন্তা করার একটি কার্যকর উপায়: "বিন্যাস" মানচিত্রে শেষ হওয়া বৈশিষ্ট্যগুলি ফ্লটারের প্রধান অক্ষের সাথে এবং "অ্যালাইনমেন্ট" মানচিত্রে শেষ হওয়া বৈশিষ্ট্যগুলি ক্রস অক্ষের সাথে।

যখন আপনার আপেক্ষিক বা ওভারল্যাপিং লেআউটের প্রয়োজন হয়, তখন পদ্ধতিগুলি ধারণাগতভাবেও সারিবদ্ধ হয়। অ্যান্ড্রয়েড এক্সএমএলে আপনি এর জন্য পৌঁছাতে পারেন RelativeLayout অথবা একটি নেস্টেড মিশ্রণ LinearLayout এবং FrameLayout. কম্পোজে আপনি রচনা করবেন Row, Column এবং Box (অথবা একটি কাস্টম লেআউট লিখুন)। ফ্লটারে অ্যানালগ হল Row, Column এবং Stack অবস্থানগত শিশু এবং সারিবদ্ধকরণ বিকল্পগুলির সাথে মিলিত। একে অপরের সাপেক্ষে উপাদানগুলিকে সাজানোর জন্য আপনার মানসিক মডেল প্রায় অপরিবর্তিতভাবে চলে।

বোতাম, ইনপুট এবং মিথস্ক্রিয়া

জেটপ্যাক কম্পোজে, একটি বোতাম তৈরি করার অর্থ সাধারণত ব্যবহার করা হয় Button অথবা এর উপাদান রূপগুলির মধ্যে একটি, যা উপাদান 3 এর অধীনে একটি নির্দিষ্ট বাস্তবায়নের সমাধান করে যেমন FilledTonalButton. তুমি একটি প্রদান করো onClick ল্যাম্বডা এবং ঐচ্ছিক স্টাইলিং, প্রায়শই প্যারামিটারের মাধ্যমে যেমন colors অথবা প্যাডিং, প্রস্থ এবং সারিবদ্ধকরণের জন্য সংশোধক।

Flutter-এ, সমতুল্য হল উইজেট ব্যবহার করা যেমন FilledButton, ElevatedButton, TextButton or OutlinedButton. প্রতিটি একটি করে নেয় onPressed কলব্যাক এবং একটি child উইজেট—প্রায়শই একটি Text. আপনি একটি পাস করে এগুলি কাস্টমাইজ করতে পারেন style মাধ্যমে ButtonStyle অথবা একটি গ্লোবাল থিম ওভাররাইড ব্যবহার করে, যা আপনাকে পুরো বোতাম পরিবারের জন্য রঙ, আকৃতি, উচ্চতা এবং আকার কেন্দ্রীয়ভাবে সামঞ্জস্য করতে দেয়।

অঙ্গভঙ্গি পরিচালনার জন্য, কম্পোজ যেমন মডিফায়ারের উপর নির্ভর করে Modifier.clickable অনেক ক্ষেত্রে, তবে প্রয়োজনে আপনি বিশেষায়িত অঙ্গভঙ্গি সনাক্তকারীর কাছেও যেতে পারেন। দীর্ঘক্ষণ চাপ, টেনে আনা এবং কাস্টম অঙ্গভঙ্গি সাধারণত ডেডিকেটেড মডিফায়ার API এবং ইন্টারঅ্যাকশন উৎসের মাধ্যমে তৈরি করা হয়।

ফ্লাটার একটি স্পষ্ট প্রকাশ করে GestureDetector উইজেট যা আপনি এমন যেকোনো কিছুর চারপাশে মোড়ানো যা অন্তর্নির্মিত অঙ্গভঙ্গি সমর্থন করে না। এটি বিস্তৃত পরিসরের কলব্যাক অফার করে: onTap, onDoubleTap, onLongPress, onVerticalDragStart, onVerticalDragUpdate, onHorizontalDragEnd এবং আরও অনেক কিছু। উইজেট যেমন ElevatedButton ইতিমধ্যেই একটি প্রকাশ করা হয়েছে onPressed সম্পত্তি, কিন্তু সম্পূর্ণ কাস্টম UI উপাদানের জন্য আপনি ব্যবহার করতে পারেন GestureDetector অথবা উচ্চতর স্তরের উইজেট যেমন InkWell ম্যাটেরিয়াল রিপল ফিডব্যাকের জন্য।

Flutter-এ টেক্সট ইনপুট পরিচালিত হয় এর মাধ্যমে TextField or TextFormField, যার স্টাইলিং কম্পোজের সাথে সাদৃশ্যপূর্ণ TextField এবং OutlinedTextField কম্পোজেবল। আপনি একটি ব্যবহার করে ইঙ্গিত, লেবেল, ত্রুটি এবং সীমানা কনফিগার করেন InputDecoration তুমি যেভাবে ব্যবহার করো তার অনুরূপ TextFieldDefaults অথবা কম্পোজ টেক্সট ফিল্ডে প্যারামিটার। কম্পোজের মতো, আপনি সাধারণত ভিউ ম্যানুয়ালি ম্যানিপুলেট করার পরিবর্তে অবস্থা পরিবর্তন করে এবং সাজসজ্জা পুনর্নির্মাণ করে প্রতিক্রিয়াশীলভাবে ত্রুটি বার্তা দেখান।

তালিকা, গ্রিড এবং স্ক্রোলিং কন্টেন্ট

জেটপ্যাক কম্পোজ তালিকার জন্য দুটি প্রধান কৌশল প্রদান করে: সহজ Column/Row ছোট সংগ্রহের জন্য পুনরাবৃত্তি সহ, এবং LazyColumn/LazyRow/LazyVerticalGrid/LazyHorizontalGrid বড় বা গতিশীল তালিকার জন্য। অলস পাত্রে কেবল দৃশ্যমান জিনিসই তৈরি করা হয়, যা হাজার হাজার আইটেমের সাথে কাজ করার সময় কর্মক্ষমতা উচ্চ রাখে।

ফ্লাটার একই ছোট বনাম বড় পদ্ধতি অনুসরণ করে কিন্তু ভিন্ন উইজেট সহ। স্ক্রিনে ফিট করে এমন একটি ছোট তালিকার জন্য আপনি কেবল একটি ব্যবহার করতে পারেন Column এবং আপনার ডেটা ম্যাপ করুন children। স্ক্রোল করা যেকোনো কিছুর জন্য, আপনি ListView or GridView, বিল্ডার কনস্ট্রাক্টরদের সাথে যারা অলসভাবে শুধুমাত্র প্রয়োজনের সময় শিশু তৈরি করে।

ফ্লটারের সাধারণ ধরণ হল ListView.builder, যা কম্পোজের অলস তালিকার আইটেম DSL-এর সাথে প্রতিফলিত হয়। তুমি একটি সরবরাহ করো itemCount এবং একটি itemBuilder কলব্যাক; ফ্লাটার সেই বিল্ডারকে কল করে যার সূচক 0 থেকে itemCount - 1 যখনই কোনও নতুন আইটেম সামনে আসে। বিল্ডারের ভিতরে আপনি প্রায় যেকোনো উইজেট ফেরত দিতে পারেন—একটি সাধারণ থেকে ListTile জটিল, কাস্টম তালিকার সারিগুলিতে টেক্সট এবং আইকন সহ।

গ্রিডের জন্য, কম্পোজ'স LazyVerticalGrid এবং LazyHorizontalGrid ফ্লাটারের মানচিত্র GridView উইজেট। কলাম গণনা সরাসরি গ্রিডে পাঠানোর পরিবর্তে, Flutter প্রায়শই একটি প্রতিনিধি ব্যবহার করে যেমন SliverGridDelegateWithFixedCrossAxisCount or SliverGridDelegateWithMaxCrossAxisExtent কোষগুলি কীভাবে সাজানো হবে তা নিয়ন্ত্রণ করতে। এই প্রতিনিধিরা "কলামের সংখ্যা" বা "সর্বোচ্চ কোষের প্রস্থ" এর মতো নিয়মগুলিকে অন্তর্ভুক্ত করে, যা কম্পোজে আপনার ব্যবহৃত গ্রিড আকারের প্যারামিটারের মতোই।

উভয় টুলকিটে স্ক্রোল আচরণও একই রকম। কম্পোজের অলস তালিকাগুলি স্ক্রলিং বেক ইনের সাথে আসে; আপনাকে সেগুলিকে অতিরিক্ত স্ক্রোল পাত্রে মুড়িয়ে রাখতে হবে না। ফ্লটারে, অনেক তালিকা এবং গ্রিড উইজেট নিজেই স্ক্রোলযোগ্য, তবে একক, পুনরাবৃত্তি না করা সামগ্রীর জন্য যা স্ক্রোল করা উচিত আপনি ব্যবহার করতে পারেন SingleChildScrollView। এরপর আরও উন্নত ব্যবহারের ক্ষেত্রে কাস্টম স্ক্রোলযোগ্য পৃষ্ঠা তৈরি করা নেস্টিং বা ছোট ছোট লেখার বিষয় হয়ে দাঁড়ায়।

অভিযোজিত এবং প্রতিক্রিয়াশীল UI প্যাটার্ন

কম্পোজ আপনাকে রেসপন্সিভ ডিজাইনের জন্য বেশ কিছু কৌশল দেয়: কাস্টম লেআউট, BoxWithConstraints, WindowSizeClass এবং ম্যাটেরিয়াল 3 অ্যাডাপ্টিভ লাইব্রেরি। এগুলি আপনাকে উপলব্ধ স্থান, ভঙ্গি এবং ডিভাইস বিভাগের উপর ভিত্তি করে আপনার রচনা পরিবর্তন করতে দেয় এবং আপনি প্রকল্পের জটিলতার উপর নির্ভর করে এগুলি মিশ্রিত করতে পারেন।

Flutter সরাসরি সেই API গুলিকে মিরর করার চেষ্টা করে না, তবে অন্তর্নিহিত ধারণাটি একই: সীমাবদ্ধতা এবং স্ক্রিন বৈশিষ্ট্যগুলি পরীক্ষা করুন, তারপর আপনার লেআউটকে শাখা করুন। দুটি প্রধান হাতিয়ার হল LayoutBuilder এবং MediaQuery. LayoutBuilder পাস BoxConstraints নিচে যাতে আপনি নির্দিষ্ট প্রস্থ বা উচ্চতার উপরে উইজেটগুলি অদলবদল বা পুনর্বিন্যাস করতে পারেন। MediaQuery উচ্চ-স্তরের ব্রেকপয়েন্টের জন্য স্ক্রিনের আকার, ওরিয়েন্টেশন, প্যাডিং এবং পিক্সেল ঘনত্ব প্রকাশ করে।

কম্পোজের অভিযোজিত সমাধান এবং ফ্লটারের মধ্যে এক-থেকে-এক ম্যাপিংয়ের লক্ষ্য রাখার পরিবর্তে, আপনার ডিজাইনের প্রয়োজনীয়তার দিক থেকে চিন্তা করা আরও কার্যকর। একবার আপনি যখন জানেন যে আপনার UI ফোন, ট্যাবলেট এবং ডেস্কটপ জুড়ে কীভাবে মানিয়ে নেওয়া উচিত, তখন আপনি কম্পোজের মাধ্যমে সেই যুক্তিটি প্রকাশ করতে পারেন WindowSizeClass এবং অভিযোজিত লেআউট অথবা ফ্লটারের সীমাবদ্ধতা-চালিত এবং মিডিয়া-চালিত শাখা। একই নকশা চিন্তাভাবনা—বিভিন্ন API।

রাষ্ট্র ব্যবস্থাপনা: মনে রাখবেন বনাম স্টেটফুলউইজেট এবং তার পরেও

জেটপ্যাক কম্পোজ ব্যবহার করে ক্ষণস্থায়ী UI অবস্থা সংরক্ষণ করে remember এবং রাষ্ট্রীয় মালিকদের মত mutableStateOf, প্রায়শই একত্রিত হয় ViewModel এবং দীর্ঘস্থায়ী অবস্থার জন্য স্থাপত্য উপাদান। যখন অবস্থা পরিবর্তন হয়, তখন পুনর্গঠন ঘটে এবং প্রাসঙ্গিক কম্পোজেবলগুলি নতুন মান পায়।

ফ্লটারের নিম্ন-স্তরের রাষ্ট্রের গল্পটি আবর্তিত হয় StatefulWidget এবং এর সাথে সম্পর্কিত State অবজেক্ট। আপনি এমন একটি উইজেট সংজ্ঞায়িত করেন যা প্রসারিত করে অবস্থা ধরে রাখতে চায় StatefulWidget, তারপর একটি পৃথক বাস্তবায়ন করুন State<MyWidget> পরিবর্তনযোগ্য ক্ষেত্রগুলি সংরক্ষণ করার জন্য ক্লাস। যখনই আপনি সেই ক্ষেত্রগুলি আপডেট করবেন, আপনি কল করবেন setState(), যা উইজেট ট্রির সেই অংশটিকে নোংরা হিসেবে চিহ্নিত করে এবং পুনর্নির্মাণ শুরু করে। এই স্তরে এটি কম্পোজ স্টেট সংরক্ষণের অনুরূপ remember এবং মান পরিবর্তন হলে কম্পোজেবলগুলিকে অবৈধ করে দেওয়া।

আরও জটিল অ্যাপের জন্য, Flutter সম্প্রদায় এবং প্রথম পক্ষের ধরণগুলির উপর খুব বেশি নির্ভর করে: Provider, রিভারপড, ব্লক, রেডাক্স-স্টাইলের দোকান এবং আরও অনেক কিছু। এগুলো আপনার অ্যান্ড্রয়েড আর্কিটেকচার স্ট্যাকের অ্যানালগ হিসেবে কাজ করে: ViewModel + LiveData/Flow + Compose প্রোজেক্টে রিপোজিটরি। এগুলো ব্যবসায়িক লজিককে কেন্দ্রীভূত করে এবং উইজেট পুনর্নির্মাণকে চালিত করে এমন ডেটার প্রতিক্রিয়াশীল স্ট্রিম প্রকাশ করে। একটি Compose ব্যাকগ্রাউন্ড থেকে, আপনি API গুলি ভিন্ন হলেও এই প্যাটার্নগুলির অনেকগুলি পরিচিত পাবেন।

অ্যান্ড্রয়েড ডেভেলপারদের প্রায়শই অবাক করে এমন একটি বিষয় হল যে Flutter-এ স্টেটলেস এবং স্টেটফুল উভয় উইজেটই ঘন ঘন পুনর্নির্মাণ করা হয়—সম্ভবত অ্যানিমেশন চলাকালীন প্রতিটি ফ্রেম। পার্থক্যটি পুনর্নির্মাণ ফ্রিকোয়েন্সি সম্পর্কে নয় বরং পরিবর্তনীয় অবস্থা কোথায় সংরক্ষণ করা হয় তা নিয়ে: StatefulWidget তোমাকে একজন সঙ্গী দেয় State যে বস্তুটি বেঁচে থাকে তা পুনর্নির্মাণ করে, অনেকটা কীভাবে remember কম্পোজে মানগুলিকে পুনর্গঠন টিকে থাকতে দেয়।

অঙ্কন, অ্যানিমেশন এবং ভিজ্যুয়াল পলিশ

আপনি যদি কখনও অ্যান্ড্রয়েডের সাথে সরাসরি কাজ করে থাকেন Canvas এবং Drawable, কম্পোজ এর Canvas কম্পোজেবল সম্ভবত সহজবোধ্য মনে হয়েছে। এটি কোটলিনে আকার, ছবি এবং লেখা আঁকার একটি ঘোষণামূলক উপায় প্রদান করে, যা ঐতিহ্যবাহী কাস্টম দৃষ্টিভঙ্গির অনেক অপরিহার্য অনুষ্ঠানকে লুকিয়ে রাখে।

ফ্লাটার একটি অনুরূপ অঙ্কন পৃষ্ঠকে প্রকাশ করে Canvas API, এর মাধ্যমে অ্যাক্সেস করা হয়েছে CustomPaint এবং CustomPainter. তুমি একটি বাস্তবায়ন করো CustomPainter যেখানে আপনি ওভাররাইড করেন paint ক্যানভাসে ছবি আঁকার পদ্ধতি Paint বস্তু, পথ, রূপান্তর ইত্যাদি। তারপর আপনি সেই চিত্রকরটিকে একটির সাথে সংযুক্ত করুন CustomPaint উইজেট। হুডের নিচে কম্পোজ এবং ফ্লাটার উভয়ই স্কিয়া ইঞ্জিনের উপর নির্ভর করে, তাই অ্যান্ড্রয়েডের 2D রেন্ডারিং থেকে আদিম - লাইন, পাথ, শেডার - খুব পরিচিত দেখায়।

অ্যানিমেশনের জন্য, ফ্লাটার একটি স্পষ্ট অ্যানিমেশন সিস্টেমের উপর নির্ভর করে যা চারপাশে তৈরি করা হয়েছে AnimationController, Animation<T> এবং টুইনস, এবং অ্যানিমেটেড উইজেটের একটি সমৃদ্ধ সেট। আপনি একটি নিয়ামক ইনস্ট্যান্টিয়েট করেন (সাধারণত এর সাথে SingleTickerProviderStateMixin vsync এর জন্য), CurvedAnimations বা Tweens সংজ্ঞায়িত করুন যা 0-1 অগ্রগতিকে ডোমেন মানগুলিতে ম্যাপ করে, এবং তারপর সেগুলিকে উইজেটে সংযুক্ত করে যেমন FadeTransition, ScaleTransition, AnimatedBuilder অথবা অন্তর্নিহিত উইজেট যেমন AnimatedContainer। অ্যানিমেশন সিস্টেমটিও প্রকাশ করে AnimationStatus শুরু, সমাপ্তি বা বিপরীত প্রতিক্রিয়ার জন্য কলব্যাক।

জেটপ্যাক কম্পোজের অ্যানিমেশন API গুলি উপর থেকে নীচে পর্যন্ত ঘোষণামূলক, যেমন ফাংশন সহ animate*AsState, রূপান্তর, এবং অ্যানিমেটেড দৃশ্যমানতা। বেশিরভাগ সাধারণ ক্ষেত্রে কন্ট্রোলারগুলিকে ম্যানুয়ালি পরিচালনা করার পরিবর্তে, আপনি লক্ষ্য অবস্থা বর্ণনা করেন এবং ফ্রেমওয়ার্ক সময়ের সাথে সাথে ইন্টারপোলেশন চালায়। যখন আপনার আরও কাস্টমাইজড নিয়ন্ত্রণের প্রয়োজন হয়, তখনও আপনার নিম্ন-স্তরের আদিমগুলিতে অ্যাক্সেস থাকে, তবে সাধারণ পথটি ক্লাসিক অ্যান্ড্রয়েড এক্সএমএল বা ইম্পেরিয়াল অ্যানিমেশন কোডের চেয়ে আরও সংক্ষিপ্ত।

ধারণাগতভাবে, আপনি উভয় টুলকিট একইভাবে ব্যবহার করেন: উইজেট/কম্পোজেবলগুলিকে হালকা এবং বিশুদ্ধ রাখুন, তাদের মাধ্যমে সময়-পরিবর্তিত মানগুলিকে পুশ করুন এবং ফ্রেমওয়ার্ককে ইন্টারপোলেশন এবং অবৈধকরণ পরিচালনা করতে দিন। একজন কম্পোজ ডেভেলপার হিসেবে, ফ্লটারের অতিরিক্ত স্পষ্টতা AnimationController প্রথমে একটু পুরনো দিনের মতো মনে হতে পারে, কিন্তু এটি আপনাকে সময়, বক্ররেখা এবং অর্কেস্ট্রেশনের উপর খুব সূক্ষ্ম নিয়ন্ত্রণ এনে দেয়।

স্টাইলিং, থিমিং, ফন্ট এবং সম্পদ

আধুনিক অ্যাপগুলি পোলিশের উপর নির্ভর করে বাঁচে অথবা মরে, তাই ফ্লাটার এবং কম্পোজ উভয়ই থিমিং এবং স্টাইলিংয়ের উপর অনেক জোর দেয়। রচনার ব্যবহার MaterialTheme রঙের স্কিম, টাইপোগ্রাফি এবং আকৃতির সংজ্ঞা সহ, এবং আপনি সাবট্রির জন্য মানগুলিকে ওভাররাইড করার জন্য থিমগুলিকে নেস্ট করতে পারেন—নির্দিষ্ট অঞ্চলের জন্য হালকা বা অন্ধকার পৃষ্ঠকে জোর করে।

ফ্লটারে, সমতুল্য হল ThemeData প্রেরণ করা MaterialApp or Theme উইজেট আপনি প্রাথমিক রঙ, উজ্জ্বলতা, টাইপোগ্রাফি এবং উপাদান-নির্দিষ্ট থিমগুলি সংজ্ঞায়িত করেন যেমন elevatedButtonTheme, textButtonTheme, appBarTheme এবং আরও অনেক কিছু। আপনি সাবট্রিগুলিকে মোড়ানোর মাধ্যমে স্থানীয়ভাবে থিমগুলিকে ওভাররাইড করতে পারেন Theme উইজেট যা মূল অনুলিপি করে এবং নির্দিষ্ট ক্ষেত্রগুলিকে পরিবর্তন করে। হালকা এবং অন্ধকার মোড অ্যাপ স্তরে টগল করা যেতে পারে প্রদান করে theme এবং darkTheme এবং নিয়ন্ত্রণ themeMode.

টেক্সট স্টাইলিং একটি পরিচিত অঞ্চল: কম্পোজে আপনি হয় সরল বৈশিষ্ট্যগুলি সরাসরি Text অথবা সরবরাহ করুন TextStyle অবজেক্ট। ফ্লাটার এটিকে একটি দিয়ে প্রতিফলিত করে Text উইজেট যা একটি গ্রহণ করে TextStyle এর মাধ্যমে style প্যারামিটার। TextStyle ফন্ট পরিবার, আকার, ওজন, অক্ষরের ব্যবধান, লাইনের উচ্চতা, সাজসজ্জা এবং আরও অনেক কিছু অন্তর্ভুক্ত করে। আপনি বিশ্বব্যাপী পাঠ্য থিমগুলি সংজ্ঞায়িত করতে পারেন ThemeData.textTheme এবং সর্বত্র তাদের উল্লেখ করুন, ঠিক যেমন আপনি টাইপোগ্রাফি ব্যবহার করেন MaterialTheme কম্পোজে।

ফন্ট এবং ছবিগুলি অ্যান্ড্রয়েডের ঐতিহ্যবাহী পদ্ধতির পরিবর্তে সম্পদের মাধ্যমে পরিচালিত হয় /res ডিরেক্টরি গাছ। Flutter একটি নির্দিষ্ট ফোল্ডার লেআউট প্রয়োগ করে না; আপনি সম্পদ ঘোষণা করেন pubspec.yaml এবং তারপর কোড থেকে তাদের উল্লেখ করুন। ছবিগুলি সাধারণত লোড করা হয় Image.asset(), যা সঠিক ঘনত্বের বালতিতে সমাধান করে devicePixelRatioলজিক্যাল পিক্সেল একই ভূমিকা পালন করে যেমন dp অ্যান্ড্রয়েডে, ভৌত পিক্সেল ঘনত্বকে বাদ দিয়ে।

কাস্টম ফন্টের জন্য, কম্পোজ আপনাকে ফন্ট রিসোর্স প্যাকেজ করতে দেয় অথবা রানটাইমে গুগল ফন্টের মতো প্রোভাইডারদের মাধ্যমে টেনে আনতে দেয়, তারপর সেগুলিকে তারের মাধ্যমে FontFamily এবং টাইপোগ্রাফি। ফ্লাটার প্রায় একই প্যাটার্ন ব্যবহার করে: ফন্ট ফাইলগুলিকে একটি সম্পদ ফোল্ডারে রাখুন, সেগুলিকে তালিকাভুক্ত করুন pubspec.yaml, এবং তারপর ফন্ট ফ্যামিলিকে নাম অনুসারে উল্লেখ করুন TextStyle. যদি আপনি রানটাইম-ফেটেড ফন্ট চান, তাহলে একটি জনপ্রিয় google_fonts প্লাগইন যা ফন্টের নাম অনুসারে ডার্ট ফাংশনগুলি প্রকাশ করে—যেমন GoogleFonts.robotoTextTheme()—তাদের দ্রুত আপনার থিমের সাথে সংযুক্ত করার জন্য।

উভয় ইকোসিস্টেমই স্ট্রিং এবং স্থানীয়করণকে প্রথম শ্রেণীর উদ্বেগ হিসেবে বিবেচনা করে, যদিও ফ্লটারের অ্যান্ড্রয়েডের XML স্ট্রিং রিসোর্সের সাথে সরাসরি সমতুল্য কোনও তথ্য নেই। পরিবর্তে, সর্বোত্তম অনুশীলন হল অনুবাদগুলিকে এখানে রাখা .arb ফাইলগুলি তৈরি করুন এবং ফ্লাটার লোকালাইজেশন টুলচেইনের সাহায্যে সেগুলিকে সংযুক্ত করুন। এরপর অ্যাক্সেস জেনারেটেড ডার্ট ক্লাসের মাধ্যমে ঘটে, যা প্রায় ব্যবহারের অনুরূপ R.string অ্যান্ড্রয়েড কোডে শনাক্তকারী।

ফ্লাটার লেন্সের মাধ্যমে অ্যান্ড্রয়েড প্ল্যাটফর্মের ধারণাগুলি

UI এর বাইরে, কম্পোজ ডেভেলপারদের সবচেয়ে বড় প্রশ্ন হল তাদের অ্যান্ড্রয়েড জ্ঞান কীভাবে ফ্লটারের আর্কিটেকচারের সাথে মানানসই। সৌভাগ্যবশত, অনেক মূল ধারণা—কার্যকলাপ, জীবনচক্র, উদ্দেশ্য, পটভূমির কাজ, সম্পদ, নেটওয়ার্কিং—এর স্পষ্ট প্রতিরূপ রয়েছে, এমনকি যদি পৃষ্ঠের API ভিন্ন দেখায়।

অ্যান্ড্রয়েডে, Activity এবং Fragment আপনার প্রাথমিক স্ক্রিন এবং কন্টেইনারগুলি; ফ্লটারে সবকিছুই একটি উইজেট, এবং নেভিগেশন এর মাধ্যমে ঘটে Navigator এবং Route অবজেক্ট। একটি রুট মোটামুটিভাবে একটি কার্যকলাপ বা খণ্ডের সাথে মিলে যায়, তবে সাধারণত শুধুমাত্র একটি হোস্টিং থাকে Activity অ্যান্ড্রয়েডে যা ফ্লটার ইঞ্জিন এম্বেড করে। আপনি ন্যাভিগেটরের স্ট্যাকে রুট পুশ এবং পপ করেন, হয় নামযুক্ত রুটগুলির মাধ্যমে যা সংজ্ঞায়িত করা হয়েছে MaterialApp অথবা সরাসরি নির্মিত মাধ্যমে PageRoute যেমন উদাহরণ MaterialPageRoute.

অ্যান্ড্রয়েডের জীবনচক্র কলব্যাক (onCreate, onStart, onResume, ইত্যাদি) ফ্লাটার কোডে ওয়ান-টু-ওয়ান হুক নেই, তবে আপনি অ্যাপের জীবনচক্র পর্যবেক্ষণ করতে পারেন WidgetsBindingObserver. এটি রাজ্যগুলিকে প্রকাশ করে যেমন resumed, inactive, paused এবং detached, যা মোটামুটিভাবে অ্যান্ড্রয়েডের দৃশ্যমান, পটভূমি এবং ধ্বংসপ্রাপ্ত পর্যায়গুলির সাথে মিলে যায়। যখন আপনার রিসোর্স ম্যানেজমেন্টের জন্য সত্যিই নিম্ন-স্তরের জীবনচক্র হুকের প্রয়োজন হয়, তখন আপনি সাধারণত নেটিভ অ্যান্ড্রয়েড দিকে সেগুলি বাস্তবায়ন করেন FlutterActivity অথবা একটি প্লাগইন, ডার্টে নয়।

অ্যান্ড্রয়েডে ইন্টেন্ট দুটি ভূমিকা পালন করে: ইন-অ্যাপ নেভিগেশন এবং ক্রস-অ্যাপ যোগাযোগ। যেমনটি উল্লেখ করা হয়েছে, Flutter-এর কোনও ইন্টেন্ট-ভিত্তিক নেভিগেশন API নেই—Navigator ডার্ট জগতের ভিতরে এটিকে সম্পূর্ণরূপে প্রতিস্থাপন করে। ক্রস-অ্যাপ কাজের জন্য (ক্যামেরা চালু করা, ফাইল পিকার, শেয়ারিং ইন্টেন্ট পরিচালনা করা), আপনি সাধারণত এমন প্লাগইন ব্যবহার করেন যা প্রয়োজনীয় অ্যান্ড্রয়েড (এবং iOS) কলগুলিকে মোড়ানো হয়। যদি কোনও প্লাগইন না থাকে, তাহলে আপনি MethodChannels ব্যবহার করে ডার্ট এবং নেটিভ কোডের মধ্যে কথা বলতে, ইন্টেন্ট এবং ফলাফলগুলিকে বার্তা হিসাবে ফরোয়ার্ড করতে আপনার নিজস্ব লিখতে পারেন।

ব্যাকগ্রাউন্ড ওয়ার্ক এবং থ্রেডিং সম্পর্কে আপনার ধারণাও স্থানান্তরিত হয়, কিন্তু আদিম বিষয়গুলি ভিন্ন দেখায়। অ্যান্ড্রয়েড আপনাকে কোরোটিন, অ্যাসিঙ্কটাস্ক (লেগেসি), ওয়ার্কম্যানেজার, জবশিডিউলার, আরএক্সজাভা ইত্যাদি ব্যবহার করে মূল থ্রেড থেকে নেটওয়ার্ক এবং ডিস্ক আই/ও সরাতে বাধ্য করে। বিপরীতে, ডার্ট প্রতি আইসোলেটে একটি একক থ্রেডেড ইভেন্ট লুপ ব্যবহার করে, যেখানে আই/ও-এর জন্য অ্যাসিঙ্ক/অপেক্ষা এবং সিপিইউ-ভারী কাজের জন্য পৃথক আইসোলেট ব্যবহার করা হয়। আই/ও-বাউন্ড যেকোনো কিছুর জন্য, কেবল আপনার ফাংশনগুলি চিহ্নিত করুন। async, await অপারেশনটি সম্পন্ন করুন এবং ইভেন্ট লুপটিকে UI-কে প্রতিক্রিয়াশীল রাখতে দিন; ভারী CPU কাজের জন্য আপনি একটি আইসোলেট স্পিন করেন এবং শেয়ার্ড মেমোরির পরিবর্তে মেসেজ পাসিংয়ের মাধ্যমে যোগাযোগ করেন।

নেটওয়ার্কিং ফ্রন্টে, Flutter এর জনপ্রিয় http প্যাকেজটি মৌলিক ব্যবহারের ক্ষেত্রে OkHttp + Retrofit এর মতোই ভূমিকা পালন করে। এটি নিম্ন-স্তরের সকেটের কাজ অনেকটাই লুকিয়ে রাখে এবং স্বাভাবিকভাবেই অ্যাসিঙ্ক/অপেক্ষার সাথে একীভূত হয়। জটিল প্রয়োজনের জন্য আপনি প্যাকেজগুলিতে পদক্ষেপ নিতে পারেন যেমন dio, কিন্তু মৌলিক প্যাটার্নটি রয়ে গেছে: একটি অ্যাসিঙ্ক কল করুন, ফলাফলের জন্য অপেক্ষা করুন, আপডেট অবস্থা setState() অথবা আপনার নির্বাচিত স্টেট ম্যানেজার, এবং প্রভাবিত উইজেটগুলি পুনর্নির্মাণ করুন।

প্লাগইন, স্টোরেজ, ফায়ারবেস এবং টুলিং

অ্যান্ড্রয়েডে আপনি গ্র্যাডলে নির্ভরতা ঘোষণা করতে অভ্যস্ত; ফ্লটারে আপনি সেগুলি ঘোষণা করেন pubspec.yaml এবং pub.dev থেকে সেগুলো আনুন। গ্রেডল ফাইলগুলি এর অধীনে android/ ফ্লাটার প্রজেক্টের ফোল্ডারটি বেশিরভাগই প্ল্যাটফর্ম-নির্দিষ্ট ইন্টিগ্রেশনের জন্য অথবা যখন আপনার কাস্টম নেটিভ লাইব্রেরির প্রয়োজন হয় - প্রতিদিনের অ্যাপ ডেভেলপমেন্ট ডার্ট ল্যান্ডেই থাকে।

শেয়ার্ড প্রেফারেন্স এবং SQLite-এরও রেডিমেড সমতুল্য রয়েছে। যেখানে অ্যান্ড্রয়েড অফার করে SharedPreferences ছোট কী-মান স্টোরেজের জন্য এবং স্ট্রাকচার্ড ডেটার জন্য SQLite (বা রুম), Flutter এগুলিকে প্লাগইনের মাধ্যমে মোড়ানো করে যেমন shared_preferences এবং sqflite। এই প্লাগইনগুলি অ্যান্ড্রয়েড এবং iOS আচরণকে একীভূত করে যাতে আপনি প্ল্যাটফর্ম নির্বিশেষে একটি একক ডার্ট API ব্যবহার করতে পারেন, যদিও অন্তর্নিহিত নেটিভ বাস্তবায়নের উপর নির্ভর করতে পারেন।

ফায়ারবেস ইন্টিগ্রেশন একইভাবে সহজবোধ্য এবং প্রথম শ্রেণীর। বেশিরভাগ Firebase পরিষেবা—প্রমাণীকরণ, Firestore, Realtime Database, Cloud Messaging, Analytics, Remote Config এবং আরও অনেক কিছু—এর অফিসিয়াল Flutter প্লাগইনগুলি Firebase এবং Flutter টিম দ্বারা রক্ষণাবেক্ষণ করা হয়। এগুলি Android এর Firebase SDK গুলির ধারণাগত মডেলের প্রতিফলন ঘটায় কিন্তু Dart-idiomatic API গুলির সাথে। সরাসরি অন্তর্ভুক্ত না হওয়া আরও বিশেষ Firebase বৈশিষ্ট্যগুলির জন্য, pub.dev-এ তৃতীয় পক্ষের প্লাগইনগুলির একটি সুস্থ ইকোসিস্টেম রয়েছে।

ডিবাগিং এবং প্রোফাইলিংয়ের জন্য, Flutter's DevTools স্যুট আপনাকে Android Studio-এর প্রোফাইলার এবং লেআউট ইন্সপেক্টরের সাথে সরাসরি তুলনীয় একটি সমৃদ্ধ টুলবক্স দেয়। আপনি উইজেট ট্রি পরিদর্শন করতে পারেন, পুনর্নির্মাণ ট্র্যাক করতে পারেন, মেমরি বরাদ্দ দেখতে পারেন, লিক এবং ফ্র্যাগমেন্টেশন নির্ণয় করতে পারেন এবং ডার্ট কোডের মাধ্যমে ধাপে ধাপে যেতে পারেন। অ্যান্ড্রয়েড স্টুডিও এবং ভিএস কোডে আইডিই সাপোর্ট, হট রিলোড এবং হট রিস্টার্টের সাথে মিলিত হয়ে, ফ্লটার ডেভেলপমেন্টে প্রতিক্রিয়া চক্রটি কমপক্ষে ততটাই টাইট - এবং প্রায়শই টাইট - যা আপনি কম্পোজের সাথে অভ্যস্ত।

পুশ নোটিফিকেশন, আরেকটি সাধারণ অ্যান্ড্রয়েড উদ্বেগ, ফ্লটারে প্লাগইনের মাধ্যমে পরিচালনা করা হয় যেমন firebase_messaging. গোপনে, এই অ্যাপগুলি Firebase Cloud Messaging এবং Android এবং iOS-এর নেটিভ নোটিফিকেশন ফ্রেমওয়ার্কের সাথে কথা বলে, কিন্তু আপনার অ্যাপ লজিক একটি ইউনিফাইড Dart API-তে বাস করে। কনফিগারেশন এবং প্ল্যাটফর্ম-নির্দিষ্ট আচরণ (যেমন Android-এ নোটিফিকেশন চ্যানেল) এখনও গুরুত্বপূর্ণ, এবং সেই প্ল্যাটফর্মের বিবরণগুলির সাথে আপনার বিদ্যমান অভিজ্ঞতা অত্যন্ত প্রাসঙ্গিক।

এমনকি অ্যান্ড্রয়েডের হোম স্ক্রিন উইজেটগুলি, যা সম্পূর্ণরূপে ফ্লটারে প্রয়োগ করা যায় না, তবুও ফ্লটার কোডের সাথে একীভূত হতে পারে। আপনি সাধারণত Jetpack Glance অথবা XML লেআউট দিয়ে এগুলো তৈরি করেন এবং তারপর একটি প্যাকেজ ব্যবহার করেন যেমন home_widget আপনার Flutter অ্যাপের সাথে যোগাযোগ করতে, ডেটা শেয়ার করতে এবং এমনকি রাস্টারাইজড Flutter UI কে নেটিভ উইজেটের ভিতরে একটি চিত্র হিসাবে এম্বেড করতে। এই হাইব্রিড পদ্ধতিটি আপনাকে প্ল্যাটফর্মের সীমাবদ্ধতাগুলিকে সম্মান করে Flutter-এ আপনার মূল অভিজ্ঞতা বজায় রাখতে দেয়।

এই সমস্ত সমান্তরালতার দিকে তাকালে, একজন জেটপ্যাক কম্পোজ ডেভেলপার ফ্লটারে পা রাখছেন, তিনি মোটেও শূন্য থেকে শুরু করছেন না। ঘোষণামূলক UI, অ্যান্ড্রয়েড জীবনচক্র, নেভিগেশন, অবস্থা, সম্পদ এবং অ্যাসিঙ্ক কাজের মানচিত্র সম্পর্কে আপনার বোধগম্যতা ফ্লটারের জগতের সাথে খুব স্বাভাবিকভাবেই মিলে যায়; সবচেয়ে বেশি পরিবর্তন আসে নাম, ভাষা (ডার্ট) এবং মাল্টি-প্ল্যাটফর্ম মানসিকতা। একবার আপনি উইজেট এবং নেভিগেটরকে মৌলিক ধারণা হিসেবে অভ্যন্তরীণ করে নিলে, বাকি স্ট্যাকটি বেশ দ্রুত জায়গায় ক্লিক করে।