tech talk with Sajib

এই পর্বে আমরা শিখবো এপে Cicular Floating Action Menu কিভাবে ব্যাবহার করতে হয় । Cicular Floating Action Menu এপে যেভাবে দেখাবে - এজন্য আমরা একটি সাপোর্ট লাইব্রেরীর সাহায্য নিবো । সাপোর্ট লাইব্রেরী এড করতে এই লিংকে যান -   https://github.com/oguzbilgener/CircularFloatingActionMenu  । কিভাবে Cicular Floating Action Menu ইউজ করতে হয় এখানে ধাপে ধাপে বর্ণনা করা আছে । Installation এ দেয়া লাইব্রেরী টি build.gradle(app) লেভেলে এড করে নিন । এই মেন্যু দেখাতে activity_main.xml এ কোন ভিউ এড করার দরকার নাই । MainActivity.java - ( onCreate ম্যাথডের ভিতরে ) ImageView icon = new ImageView(this); icon.setImageResource(R.drawable.ic_favorite); FloatingActionButton actionButton = new FloatingActionButton.Builder(this) .setContentView(icon) .build(); ইমেজভিউ এর অব্জেক্ট তৈরি করে তার সাথে আমরা যে আইকন টা দেখাতে চাই সেটি এড করে দিলাম । এরপর FloatingActionButton এর অব্জেক্ট তৈরি করে এর ভিতর ইমেজভিউ এর অব্জেক্ট সেট করে দিলাম । এখানে দুইটি অব্জেক্ট তৈর

এই পর্বে আমরা শিখবো এপে কিভাবে Circle Menu ইউজ করতে হয় । Circle Menu দেখতে এরকম হবে - এজন্য আমরা একটি সাপোর্ট লাইব্রেরীর সাহায্য নিবো । সাপোর্ট লাইব্রেরী এড করতে গিঁটহাবে গিয়ে Circle Menu লিখে সার্চ করুন । অনেকগুলো লাইব্রেরী পাবেন । এখানে আমরা  https://github.com/Hitomis/CircleMenu   এটি ব্যাবহার করবো ।  উপরের লিংকে গিয়ে Import  অপশনে দেয়া ১ম অংশটি build.gradle (project) লেভেলে এবং ২য় টি build.gradle (app)  লেভেলে এড করে নিন ।  compile এর পরবর্তীতে implementation ব্যাবহার করবেন ।  এবার  activity_main.xml এ চলে আসুন । CircleMenu নামে একটি ভিউ নিবো ।  <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".Main

এই পর্বে আমরা দেখবো এপে জিফ ইমেজগুলো কিভাবে ব্যাবহার করতে হয় । এ জন্য আমরা একটি সাপোর্ট লাইব্রেরীর সাহায্য নিবো । তো চলুন শুরু করা যাক - সাপোর্ট লাইব্রেরীর এড করতে এই লিংকে যান -  https://github.com/koral--/android-gif-drawable  । স্ক্রল করে - প্রথমটা build.gradle(Module.app) এর dependencies এ এড করে নিন । এখানে compile এর পরবর্তীতে implementation ব্যাবহার করবেন । এর পরেরটা build.gradle ( Project : Your Project Name ) এর buildscript এবং allprojects এ mavenCentral() লাইনটি এড করে নিয়ে sync now তে ক্লিক করুন । এবার activity_main.xml  এ চলে আসুন - <p লিখলেই দেখবেন ৪ টি অপশন দেখাবে , এখন চাইলে আপনি আপনার প্রয়োজনে GifImageView অথবা GifTextView অথবা GifImageButton অথবা GifTextureView ইউজ করতে পারেন । আমরা এখানে আপাতত GifImageView টা ব্যাবহার করছি , বাকিগুলোর ব্যাবহারও সেইম । <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.and

এই পর্বে আমরা দেখবো ফাইল স্টোরেজ এর মাধ্যমে কিভাবে আমাদের এপের ডাটা ইউজার এর ফোনে সেভ করে রাখতে পারি । ইউজার এর ফোনে সাধারনত দুই ধরনের মেমোরি থাকে । একটি হল ফোনের ইন বিল্ড মেমোরি অন্যটি হল SD কার্ড যেটি ইউজার এর ফোনে আলাদা ভাবে ইউজার সেট করে । তো এই পর্বে আমরা শিখবো ইউজার এর ফোনের ইন বিল্ড মেমোরিতে কিভাবে ডাটা সেভ করতে হয় । তো চলুন শুরু করা যাক । আমরা এই প্রোজেক্ট এর মাধ্যমে ইউজার এর ফোনে একটি নাম এবং একটি ম্যাসেজ সেভ করে রাখবো । আমাদের এপের ইউজার ইন্টারফেসটা দেখতে এরকম হবে - ১ম বক্সে ইউজার ম্যাসেজ লিখবে এবং পরের বক্সে তার নাম । Save Data বাটনে ক্লিক করলে তার নাম এবং ম্যাসেজ তার ফোনের মেমোরিতেই সেভ করে রাখবো । এরপর ইউজার Load Data বাটনে ক্লিক করলে সেই ডাটাগুলো রিড করে নিচের কমলা কালার বক্সে দেখাবো । তো ডিজাইন টা করা যাক । activity_main.xml - <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns

এই পর্বে আমরা দেখবো HTML - CSS দ্বারা কিভাবে এন্ড্রয়েড এপের ভিতরে কোন ভিউ ডিজাইন করতে পারি ।  এই পর্বে HTML - CSS দ্বারা একটি টেবিল বানানো যাক । আমাদের ফাইনাল আউটপুট দেখতে এরকম হবে - এন্ড্রয়েড এপে সাধারনত দুইটি ভিউ দ্বারা HTML - CSS লেখা হয় । একটি হল WebView এবং অন্যটি TextView । WebView দিয়ে আপনি কমপ্লেক্স কোন ভিউ ডিজাইন করতে পারবেন কিন্তু TextView দিয়ে সেটি করা যাবে নাহ । TextView দিয়ে একদম সোজাসাপ্টা কোন কিছু করা যেমন - হেডলাইন তৈরি করা , বোল্ড  ইটালিক করা , এরকম করতে পারবেন । আরেকটি পার্থক্য হলো TextView তে আপনি CSS দ্বারা ডিজাইন করতে পারবেন নাহ । তো চলুন প্রথমে WebView এর পার্ট টা দেখা যাক । নতুন একটি প্রোজেক্ট খুললাম । সেখানে activity_main.xml এ WebView নিলাম । activiy_main.xml - <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools"

এই পর্বে আমরা দেখবো Frame Layout নিয়ে কিভাবে কাজ করা হয় । ফ্রেম লেয়াউট এ আমরা একাধিক ভিউ / ভিউগ্রুপ নিবো কিন্তু এক স্ক্রিনে মাত্র একটি ভিউ / ভিউগ্রুপ কে দেখানো যাবে । ধরা যাক আমাদের লেআউট এ ৩টি ভিউ (ছবির ভিউ) আছে । তাহলে স্ক্রিনে আমরা মাত্র ১টি ছবিই দেখাতে পারবো । সেই ভিউ এর উপর ক্লিক করলে বাকি ভিউটি আসবে । এভাবে সিরিয়াল ম্যাইন্টেইন করে একটার পর আরেকটা ভিউ আসতে থাকবে । যেমন -            এখানে প্রথমে পুরো স্ক্রিন জুড়ে আমার ছবি দেখা যাচ্ছে । Frame Layout এ একটি ভিউ এর উপর অন্য আরেকটি ভিউ বসে । তাই ঝামেলা এড়াতে বাকি ভিউদুইটি ইনভিসিবল করে দিলাম । এখন আমার ছবির উপর ক্লিক করলে ফুটবল-কাপের ছবিটি আসবে , আবার ফুটবল-কাপের ছবিটির উপর ক্লিক করলে মেসির ছবি আসবে । এভাবে সিরিয়াল অনুযায়ী লুপ আকারে চলতে থাকবে । অবশ্য এজন্য জাভাতেও কিছু কোড লিখতে হবে । activity_main.xml - Root Layout হিসেবে Frame Layout নিলাম । এরভিতরে আমরা যে ৩টি ছবি দেখাবো সেজন্য ৩টি ImageView নিলাম । প্রতি ImageView তে onClick ম্যাথড ডিক্লার করলাম এবং ম্যাথডের সেইম নাম দিলাম কারন যে ছবিতেই ক্লিক করা হোক নাহ কেন সেই ম্যাথডের

এই পর্বে আমরা দেখবো কিভাবে টেবিল লেয়াউট এর সাহায্যে আমাদের লেয়াউট ডিজাইন করতে পারি । টেবিল লেয়াউট এর মাধ্যমে আমরা row-column অনুযায়ী ডিজাইন করতে পারি । এখানে আমাদের column তৈরি করতে হবে নাহ , শুধু row তৈরি করবো । row এর ভিতরে ভিউগুলো তৈরির সময় সেগুলো column অনুযায়ী বসে যাবে । সাধারণত টেবিল বানানোর ক্ষেত্রেই এটি ইউজ করা হয় । তো চলুন এই লেয়াউট এর সাহায্যে আমরা একটি টেবিল তৈরি করি । টেবিল টা দেখতে এরকম হবে - আরেকটি ব্যাপার শুরুতেই বলে রাখি , টেবিল লেয়াউট এর ক্ষেত্রে - ১ - Table Layout এর ভিতরে কোন ভিউয়ের জন্যই layout_width এবং layout_height দেয়ার দরকার নেই । কেননা বাই ডিফল্ট width = match_parent এবং height = wrap_content । ২ -  TableRow এর কোন ভিউয়ের জন্য layout_width এবং layout_height দেয়ার দরকার নেই কারন এগুলো Table Layout দ্বারা অটোমেটিক ক্যাল্কুলেট হয় । যে row তে সবচেয়ে বেশী আইটেম থাকে ওই অনুসারে বাকি  row গুলোও column তৈরি করে । activity_main.xml - <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android="http://schemas

আমরা আগের পর্বেই CustomAdapter নামে জাভা ক্লাস তৈরি করেছিলাম এবং পরিবর্তীতে সেই ক্লাসের অব্জেক্ট তৈরি করে প্যারামিটার হিসেবে কন্টেক্স প্যারেন্ট ডাটা, চাইল্ড ডাটা পাঠিয়েছি । এবার চলুন CustomAdapter টি তৈরি করা যাক । Expandable listview এর এডাপ্টর তৈরি করতে আমরা অন্য ৩টি এডাপ্টর এর সাহায্য নিতে পারি । এগুলো হল - 1 - ExpandableListAdapter 2 -  BaseExpandableListAdapter 3 -  SimpleExpandableListAdapter তো BaseExpandableListAdapter ব্যাবহার করাই সর্বাপেক্ষা ভালো । সেজন্য CustomAdapter এ BaseExpandableListAdapter ক্লাসটি extends করলাম । extends করলেই এই ক্লাসের abstract ম্যাথডগুলো ইমপ্লিমেন্ট করতে হবে । Alt + Enter চাপার মাধ্যমে সকল ম্যাথডগুলো ইমপ্লিমেন্ট করে নিলাম । মোট ১০ টি ম্যাথড আছে এখানে । এবার আমরা অব্জেক্ট এর মাধ্যমে যে প্যারামিটার গুলো এই ক্লাসে পাঠিয়েছিলাম সেগুলো রিসিভ করার জন্য ওই টাইপের ভ্যারিয়েবল গুলো ডিক্লার করবো - Context , ArrayList যেখানে প্যারেন্ট ডাটা আসবে এবং HashMap যেটি প্যারেন্ট ডাটার সাথে চাইল্ড ডাটার সংযোগ স্থাপন করবে । ওই ক্লাস থেকে ডাটা এসে এই ভ্যারিয়েবল