এন্ড্রয়েড ডেভেলপমেন্ট [পর্ব ৩১] :: Quotation app(কোটেশান অ্যাপ) : XML ফাইল ও Layout এর বেসিক সেটআপ ~ Tips-Tune

আজকের পর্বে আমরা এই প্রোজেক্ট এর xml ফাইল ও layout এর বেসিক সেটআপ সেট করব। তার আগে আমাদের এই অ্যাপটা কি ধরনের হবে টা জেনে নেয়।অ্যাপটাতে মূলত আপাতত অনেকগুলো image এর সমন্বয়ে তৈরি করা হবে। যেখানে প্রত্যেকটি image ই মূলত এক একটি Quotation হিসেবে প্রদর্শিত হবে। এই জন্য আমদের প্রয়োজন হবে একটি framelayout যেখানে image গুলো একটি frame এর মধ্যে প্রদর্শিত হবে।

প্রথমেই একটি প্রোজেক্ট নেয় Quotation নামে। এবং MainActivity এর নাম পরিবর্তন করে দেয় ImageMainView নামে। এখন আমাদের কাছে যেই মেইন xml লেআউট টি আছে। এই xml লেআউট এ একটি linear লেআউট নেয়। এবং নিচের মত করে লেআউট টি তৈরি করি।

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <LinearLayout
            android:id="@+id/linearLayout1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="center"
            android:orientation="vertical" >

            <android.support.v4.view.ViewPager
                android:id="@+id/viewPager"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
                
            </android.support.v4.view.ViewPager>
            
        </LinearLayout>

        <RelativeLayout
            android:id="@+id/linearLayout2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            
           >

            <Button
                android:id="@+id/btnImagePrevious"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/prev"
                android:layout_alignParentLeft="true"
                android:layout_marginLeft="5dp"
                />

            <Button
                android:id="@+id/btnImageNext"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/next" 
                android:layout_alignParentRight="true"
                android:layout_marginRight="5dp"
                />
          
        </RelativeLayout>
    </FrameLayout>

</LinearLayout>

এখানে linear লেআউট এর মধ্যে একটি framelayout নেয়া হয়েছে। যেখানে image গুলো সাধারণত একটি frame এর মধ্যে প্রদর্শিত হবে। এর মধ্যে আবার দুইটা linear লেআউট নেয়া হয়েছে। যার মধ্যে একটি তে screen-slide এ transition এর জন্য viewpager যোগ করা হয়েছে। এবং অপরদিকে অন্য linearlayout এ দুইটা বাটন অপশন যোগ করে দেয়া হয়েছে।

তারপর আমরা যাব ImageMainView.java তে এবং এখানে প্রয়োজনীয় উপাদানগুলি ডিক্লিয়ার করে দিব। প্রথমেই আমরা xml লেআউট এ যে viewpager নিয়েছিলাম তার support এর জন্য আমাদেরকে fragmentActivity ক্লাসকে ImageMainView এ extends করে দিতে হবে। তারপর নিচের কোডের মত করে ফাইলটা সেট করে দেয়।

package com.coderart.quoteapp;

import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.view.WindowManager;
import android.widget.Button;

public class ImageMainView extends FragmentActivity implements OnPageChangeListener, OnClickListener {

	 Button btnImagePrevious, btnImageNext;

	 ViewPager viewPage;

	@Override
	protected void onCreate(Bundle savedInstanceState) 

	{   
		this.requestWindowFeature(Window.FEATURE_NO_TITLE);

		this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);

		super.onCreate(savedInstanceState);

		setContentView(R.layout.activity_image_main_view);

       viewPage = (ViewPager) findViewById(R.id.viewPager);

		btnImagePrevious = (Button) findViewById(R.id.btnImagePrevious);

		btnImageNext = (Button) findViewById(R.id.btnImageNext);

		viewPage.setOnPageChangeListener(ImageMainView.this);

		btnImagePrevious.setOnClickListener(this);

		btnImageNext.setOnClickListener(this);

	}

	@Override
	public void onClick(View arg0) {
		// TODO Auto-generated method stub

	}

	@Override
	public void onPageScrollStateChanged(int arg0) {
		// TODO Auto-generated method stub

	}

	@Override
	public void onPageScrolled(int arg0, float arg1, int arg2) {
		// TODO Auto-generated method stub

	}

	@Override
	public void onPageSelected(int arg0) {
		// TODO Auto-generated method stub

	}

}

এখানে আপনার আগেই জানেন requestWindowFeature এবং getwindow ও setFlags দ্বারা কিভাবে অ্যাপকে untitled করা যায়। তারপর xml লেআউট এ ডিক্লিয়ার করা বাটন ও viewpage কে কিভাবে initialize করে দেয়া যায়। এরপর এখানে ImageMainView ক্লাসকে implements করি OnPageChangeListener, OnClickListener দ্বারা এবং এরর প্রদর্শন করলে Unimplemented মেথড দ্বারা প্রয়োজনীয় মেথড গুলিকেও সেট করে দেয়। viewPage কে setOnPageChangeListener দ্বারা এবং বাটনগুলিকে setOnClickListener দ্বারা initialize করে দেয়।

এই ছিল আজকের XMLফাইল ও Layout এর বেসিক সেটআপ পর্ব।