গুগল ওয়েব টুলকিট (Google Web Toolkit বা GWT) একটি ওপেন সোর্স টুলকিট যা ডেভেলপারদের সহজে জাভাস্ক্রিপ্ট অ্যাপ্লিকেশন তৈরি করতে সাহায্য করে। এটি ব্যবহার করে জাভা কোড লিখে তা ব্রাউজার-সমর্থিত জাভাস্ক্রিপ্টে রূপান্তর করা যায়।
Grid এবং FlexTable Layout
Grid Layout
Grid হল GWT-তে একটি সাধারণ উইজেট যা টেবিল ফরম্যাটে উপাদান (elements) সাজাতে ব্যবহৃত হয়। এটি রো (Row) এবং কলাম (Column)-এর মাধ্যমে উপাদানগুলিকে নির্দিষ্ট কাঠামোতে সাজায়।
Grid তৈরি করার ধাপসমূহ
Grid ইনস্ট্যান্স তৈরি করুন:
Grid grid = new Grid(rows, columns);এখানে
rowsএবংcolumnsহলো গ্রিডে রো এবং কলামের সংখ্যা।ডেটা বা উইজেট যোগ করুন:
grid.setText(0, 0, "Cell 0,0"); grid.setText(0, 1, "Cell 0,1"); grid.setWidget(1, 0, new Button("Click Me"));Root Panel-এ গ্রিড যোগ করুন:
RootPanel.get().add(grid);
উদাহরণ কোড
Grid grid = new Grid(2, 2); // ২ রো এবং ২ কলামের গ্রিড
grid.setText(0, 0, "Header 1");
grid.setText(0, 1, "Header 2");
grid.setText(1, 0, "Row 1, Col 1");
grid.setWidget(1, 1, new Button("Button"));
RootPanel.get().add(grid);
FlexTable Layout
FlexTable গ্রিডের মতই, তবে এটি আরও বেশি ফ্লেক্সিবল। এটি আপনাকে নির্দিষ্ট রো এবং কলামের স্টাইলিং এবং কাস্টমাইজেশনের সুবিধা দেয়।
FlexTable তৈরি করার ধাপসমূহ
FlexTable ইনস্ট্যান্স তৈরি করুন:
FlexTable flexTable = new FlexTable();ডেটা বা উইজেট যোগ করুন:
flexTable.setText(0, 0, "Header 1"); flexTable.setText(0, 1, "Header 2"); flexTable.setWidget(1, 0, new Button("Click Me"));কাস্টম স্টাইল বা অ্যাট্রিবিউট যোগ করুন:
flexTable.getCellFormatter().setStyleName(0, 0, "headerStyle"); flexTable.getFlexCellFormatter().setColSpan(1, 0, 2);Root Panel-এ FlexTable যোগ করুন:
RootPanel.get().add(flexTable);
উদাহরণ কোড
FlexTable flexTable = new FlexTable();
flexTable.setText(0, 0, "Header 1");
flexTable.setText(0, 1, "Header 2");
flexTable.setWidget(1, 0, new Button("Edit"));
flexTable.setText(1, 1, "Description");
flexTable.getCellFormatter().setStyleName(0, 0, "headerStyle");
flexTable.getFlexCellFormatter().setColSpan(1, 0, 2);
RootPanel.get().add(flexTable);
Grid বনাম FlexTable: পার্থক্য
| বৈশিষ্ট্য | Grid | FlexTable |
|---|---|---|
| সহজতা | সাধারণ লেআউটের জন্য সহজ | কাস্টমাইজেশনের জন্য উপযোগী |
| স্টাইলিং | সীমিত | উন্নত স্টাইলিং সমর্থন |
| ডাইনামিক যোগ | সীমিত | ডাইনামিক রো/কলাম যোগ সহজ |
| ব্যবহার | সাধারণ টেবিল | ফ্লেক্সিবল টেবিল লেআউট |
উপরের কোডের মাধ্যমে Grid এবং FlexTable লেআউট তৈরি করা সহজ এবং কার্যকর। GWT-তে এ দুটি লেআউট ব্যবহার করলে জটিল টেবিল কাঠামো বা লেআউট ডিজাইন সহজ হয়ে যায়।
Read more
