অ্যান্ড্রয়েড ব্যসিক টিউটোরিয়াল ৪ঃ এক্সএমএল(XML) শেখার আসর

সবাইকে সালাম।
আশা করি ভালো আছেন।
গত পর্বে বলেছিলাম এই পর্বে এক্সএমএল(XML) নিয়ে আলোচনা করবো। শুরু করা যাক।
এক্সএমএল(XML) হচ্ছে যেমন একটা মার্কআপ ল্যাংগুয়েজ যেটা করা হয়েছে মুলত ডেটা নিয়ে কাজ করা বা ডেটা ক্যারি করার জন্য। এর ফুল ফর্ম হচ্ছে EXtensive Markup Languge. এটা অনেকটা HTML এর মত যেটাতে ট্যাগ থাকে। HTML এর ট্যাগগুলা ইউনিভার্সাল কিন্তু এক্সএমএল(XML) এর ট্যাগগুলা কাস্টম বা স্পেশালি ডিজাইন করা কোন একটা সিস্টেম শুধুমাত্র ঐ সিস্টেমের জন্য। আমাদের অ্যান্ড্রয়েডে যে এক্সএমএল(XML) ট্যাগগুলা আছে সেগুলা স্পেশালী অ্যান্ড্রয়েডের জন্য ডিজাইন করা।
উদাহনস্বরুপ, TextView, Button, ImagevView, ListView হচ্ছে এক একটা ট্যাগ।
প্রশ্ন হচ্ছে সেগুলা দেখতে কেমন? চলুন দেখে নেই সেগুলাঃ

যেমন, একটা বাটন, সেটার এক্সএমএল(XML) কোড নিচের মত,

<Button> </Button>

আর এই কোড লিখলে বাটন দেখতে নিচের ছবির মত,

android xml button

 

আচ্ছা, এখন আমার ডিজাইন এক এক অ্যাপ্লিকেশনের জন্য এক এক রকম। সেই অনুযায়ী আমি চাইতে পারি আমার বাটন এক এক জায়গায় একে ক রকম হবে। ধর‍্যন, আমি চাইলাম আমার বাটন 100dp লম্বা ও 40dp উচু হবে। সেটা আমি নিচের কোডের মত লিখবো,

   <Button
        android:layout_width="100dp"
        android:layout_height="40dp">
</Button>

এখানে আমি দুইটা কথা এড করলাম। এগুলাকে বলে অ্যাট্রিবিউট। আমাদের অ্যান্ড্রয়েড লাইফে আমরা ম্যাক্সিমাম সময় এভাবে অ্যাট্রিবিউট লিখেই কাটাবো। এখানে তো হাইট ওয়াইড অ্যাট্রিবিউট দিলাম, চাইলে আমরা কালার, মার্জিন, প্যাডিং এসবও করতে পারি।
তারমানে এখানে

 <button> </button> 

একটা ট্যাগ, যার অ্যাট্রিবিউট হচ্ছে, android:layout_width=”100dp” ও android:layout_height=”40dp” । প্রত্যেক ট্যাগেই একটা অ্যাট্রিবিউট মাস্ট থাকা লাগবে, সেটা হচ্ছে আইডি। আইডি হচ্ছে আইডেন্টিটি যেটা দিয়ে আমরা ঐ ট্যাগটাকে জাভা’তে ধরবো এবং ঐ ট্যাগের একশন বা কাজ ঠিক করবো। আইডিসহ আমাদের এই বাটন ট্যাগ কেমন দেখাবে তা নিচের কোডে দেখি,

<Button
        android:id="@+id/button1"
        android:layout_width="100dp"
        android:layout_height="40dp"
</Button>

এখানে ‘ button1’ হচ্ছে আইডি নেইম। আমরা চাইলে এই বাটন ট্যাগকে নিচের কোডের মতও লিখতে পারি,

<Button
        android:id="@+id/button1"
        android:layout_width="100dp"
        android:layout_height="40dp"
/>

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

android xml tutorial 2

 

উপরের এটা আমার AVD ( Android Virtual Device) রান করালে দেখায়। সেটা জন্য যে কোডগুলা আমি লিখেছি তা নিচে।

 


<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.androidlime.myapp.MainActivity" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20dp"
        android:textColor="#2b3c50"
        android:text="This is my first application for AndroidLime.com blog. We are practicing Android XML today." />

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_alignRight="@+id/button1"
        android:layout_below="@+id/textView1"
        android:layout_marginTop="44dp"
        android:src="@drawable/rubel" />

    <Button
        android:id="@+id/button1"
        android:layout_width="100dp"
        android:layout_height="40dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="75dp"
        android:background="#2b3c50"
        android:textColor="#ffffff"
        android:text="Send Data" />

</RelativeLayout>

আরেকটা ব্যপার বলে নেই,
, এগুলা হচ্ছে লেআউট ট্যাগ। লেআউট এর কাজ কি? সোজা ভাষায় হচ্ছে, আপনার অনেকগুলা কম্পনেন্টস যেমন TextView, Button, ImagevView, ListView আছে, সেগুলাকে সুন্দরভাবে ধরে রাখার জন্য এই লিনিয়ার বা রিলেটিভলেআউটগুলা ব্যবহার হবে।

– মুলত, তার ভেতরে থাকা কম্পনেন্টসগুলোকে একাটার সাথে রিলেট করে বা একটা খাতিরে আরেকটা ধরে রাখে। তাই এটার নাম রিলেটিভ লেয়াউট।
– মুলত, একটার পরে একটা কম্পনেন্ট ধরে রাখে। সেটা হতে পারে ভার্টিক্যালি, হতে পারে হরিজন্টালি অর্থাৎ একটার নিচে একটা বা একটার পাশে একটা।
আশা করি বুঝা গেসে। না বুঝলে কমেন্ট করবেন, আবার বুঝায়ে দিবো।
আজ এই পর্যন্তই।
লেখাগুলা কেমন হচ্ছে, বুঝছেন কিনা, আরো কিছু কি করা যায়, এসব জানিয়ে ফিডব্যাক দিবেন, কমেন্ট করবেন। এতে আপনাদের জন্যই ভালো হবে।\
ভালো থাকুন, সুস্থ থাকুন।
হ্যাপি ( 😀 ) কোডিং 😉

আরো পড়ুনঃ অ্যান্ড্রয়েড এ্যাপ্লিকেশন মনেটাইজেশান (রেভেনিউ জেনেরেট) এর পথ সমূহ

Mosharrof Rubel

আমাকে ফেসবুকে পাবেন এখানেঃ মোশাররফ রুবেল

You may also like...

Leave a Reply