Adobe Flex-এ বিভিন্ন built-in components (পূর্বনির্ধারিত কম্পোনেন্ট) থাকে, যেগুলি ডেভেলপারদের দ্রুত এবং সহজে ইউজার ইন্টারফেস (UI) তৈরি করতে সহায়ক। এর মধ্যে Button, List, এবং DataGrid অত্যন্ত ব্যবহৃত কম্পোনেন্ট, যেগুলির মাধ্যমে ইন্টারেক্টিভ এবং ডেটা ড্রিভেন অ্যাপ্লিকেশন তৈরি করা যায়।
এখানে Button, List, এবং DataGrid কম্পোনেন্টগুলোর ভূমিকা এবং ব্যবহার ব্যাখ্যা করা হলো।
১. Button Component
Button কম্পোনেন্ট ব্যবহারকারীদের কোনও অ্যাকশন সম্পাদনের জন্য একটি ক্লিকযোগ্য বাটন প্রদান করে। এটি অ্যাপ্লিকেশনটির ইউজার ইন্টারফেসে সবচেয়ে সাধারণ এবং গুরুত্বপূর্ণ কম্পোনেন্টগুলির মধ্যে একটি।
Button কম্পোনেন্টের বৈশিষ্ট্যসমূহ:
- label: বাটনের টেক্সট সেট করতে ব্যবহৃত হয়।
- click event: ব্যবহারকারী যখন বাটনে ক্লিক করে, তখন একটি ইভেন্ট ঘটে, যা অ্যাকশন চালায়।
উদাহরণ:
<s:Button label="Submit" click="submitForm()"/>
এখানে, label="Submit" বাটনের টেক্সট এবং click="submitForm()" ব্যবহারকারী যখন বাটনে ক্লিক করবেন, তখন submitForm() ফাংশনটি কল হবে।
ActionScript (submitForm ফাংশন):
private function submitForm():void {
trace("Form submitted!");
}
২. List Component
List কম্পোনেন্ট ডেটার একটি তালিকা প্রদর্শন করার জন্য ব্যবহৃত হয়। এটি সাধারণত ArrayCollection বা XML ডেটার সাথে যুক্ত থাকে এবং ব্যবহারকারীরা তালিকাভুক্ত আইটেম নির্বাচন করতে পারেন।
List কম্পোনেন্টের বৈশিষ্ট্যসমূহ:
- dataProvider: তালিকায় প্রদর্শন করার জন্য ডেটার উৎস।
- itemRenderer: তালিকার আইটেমের জন্য কাস্টমাইজড ভিউ তৈরি করার জন্য ব্যবহৃত হয়।
উদাহরণ:
<s:List id="itemList" dataProvider="{myItems}" width="200" height="100"/>
এখানে, myItems একটি ArrayCollection বা XML হতে পারে যা List কম্পোনেন্টে ডেটা প্রদর্শন করবে।
ActionScript (ডেটা প্রোভাইডার):
private var myItems:ArrayCollection = new ArrayCollection(["Item 1", "Item 2", "Item 3"]);
এটি একটি সাধারণ List কম্পোনেন্টের উদাহরণ, যেখানে আইটেমগুলি একটি অ্যারে থেকে প্রদর্শিত হবে।
৩. DataGrid Component
DataGrid কম্পোনেন্ট ডেটার একটি টেবিলরূপে প্রদর্শন করতে ব্যবহৃত হয়। এটি বড় ডেটা সেটগুলি দেখানোর জন্য এবং ব্যবহারকারীদের ডেটা সজ্জিত এবং পরিচালনা করার জন্য অত্যন্ত উপযুক্ত। DataGrid সাধারণত কলাম এবং রো দ্বারা সাজানো হয় এবং এটি ইউজারদের জন্য ডেটা সাজানোর, ফিল্টার করার বা পৃষ্ঠায় বিভক্ত করার সুবিধা প্রদান করে।
DataGrid কম্পোনেন্টের বৈশিষ্ট্যসমূহ:
- dataProvider: টেবিলের জন্য ডেটার উৎস।
- columns: টেবিলের কলামগুলি সংজ্ঞায়িত করতে ব্যবহৃত হয়।
- sortableColumns: কলামগুলোকে সাজানোর জন্য সক্ষম করে।
উদাহরণ:
<s:DataGrid id="myDataGrid" dataProvider="{myData}" width="400" height="200">
<columns>
<s:ArrayList>
<s:DataGridColumn headerText="Name" dataField="name"/>
<s:DataGridColumn headerText="Age" dataField="age"/>
</s:ArrayList>
</columns>
</s:DataGrid>
এখানে, DataGrid কম্পোনেন্টে দুটি কলাম Name এবং Age প্রদর্শিত হবে, এবং ডেটা একটি ArrayCollection থেকে আসবে।
ActionScript (ডেটা প্রোভাইডার):
private var myData:ArrayCollection = new ArrayCollection([
{name: "John", age: 30},
{name: "Jane", age: 25},
{name: "Bob", age: 40}
]);
এটি একটি DataGrid কম্পোনেন্টের উদাহরণ, যেখানে তিনটি রো এবং দুটি কলাম রয়েছে: Name এবং Age।
সারাংশ
- Button Component: ব্যবহারকারীর ইন্টারঅ্যাকশন ব্যবস্থাপনা করতে ব্যবহৃত হয়। এটি সাধারণত একটি click event হ্যান্ডল করতে ব্যবহৃত হয়।
- List Component: ডেটার তালিকা প্রদর্শন করার জন্য ব্যবহৃত হয়। এটি ব্যবহারকারীদের বিভিন্ন আইটেম নির্বাচন করতে দেয় এবং এটি একটি dataProvider দিয়ে ডেটা প্রদর্শন করে।
- DataGrid Component: টেবিল আকারে ডেটা প্রদর্শন করার জন্য ব্যবহৃত হয় এবং এটি বিভিন্ন কলাম এবং রো দ্বারা ডেটা সংগঠিত করে। এটি বড় ডেটা সেটগুলির সাথে কাজ করতে উপযুক্ত।
Flex-এর Button, List, এবং DataGrid কম্পোনেন্টগুলি আপনাকে অ্যাপ্লিকেশনের ইউজার ইন্টারফেসে ইন্টারঅ্যাকটিভ এবং ডেটা ড্রিভেন উপাদান তৈরি করতে সহায়ক।
Read more
