ProgrammingCodeTech: View Pager with Circle Indicator(Image slider show)

View Pager with Circle Indicator(Image slider show)

FULL VIDEO Here:-

CODE Here:

Step 1. add library in build.gradle file

build.gradle

Dependencies{

compile 'me.relex:circleindicator:1.2.2@aar'

}

Step 2. create file activity_main.xml in res/layout folder

activity_main.xml

Step 3. create file item.xml in res/layout folder

item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ImageView
    android:id="@+id/ima1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="fitXY"
    android:src="@drawable/t1" />

</RelativeLayout>

Step 4. create file Viewpageradapter.java in 1.main/java/example/com/adapter folder

Viewpageradapter.java

package com.example.imageandtextswitcher;
        import android.R.layout;
        import android.app.ActionBar.LayoutParams;
        import android.content.Context;
        import android.support.v4.view.PagerAdapter;
        import android.support.v4.view.ViewPager;
        import android.text.method.ReplacementTransformationMethod;
        import android.view.LayoutInflater;
        import android.view.View;
        import android.view.ViewGroup;
        import android.widget.ImageView;
        import android.widget.LinearLayout;
        import android.widget.RelativeLayout;
        import android.widget.TextView;
        import android.widget.Toast;

public class ViewPagerAdapter extends PagerAdapter {
    int[] img;
    LayoutInflater inflater;
    Context context;
    int position = 3;

    public ViewPageAdapter(MainActivity mainActivity, int[] img) {
        this.context = mainActivity;
        this.img = img;
    }

    @Override
    public int getCount() {
        return img.length;
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == ((RelativeLayout) object);
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        ImageView img;

        inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View itemview = inflater.inflate(R.layout.item, container, false);
        img = (ImageView) itemview.findViewById(R.id.ima1);
        img.setImageResource(flag[position]);

        //add item.xml to viewpager
        ((ViewPager) container).addView(itemview);
        return itemview;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        // Remove viewpager_item.xml from ViewPager
        ((ViewPager) container).removeView((RelativeLayout) object);
    }

    @Override
    public float getPageWidth(int position) {
        return .20f;   //it is used for set page widht of view pager
    }
}

Step 4. Create file MainActivity.java in main/java folder

MainActivity.java

package com.example.imageandtextswitcher;
        import android.support.v4.view.PagerAdapter;
        import android.support.v4.view.ViewPager;
        import android.support.v4.view.ViewPager.OnPageChangeListener;
        import android.support.v7.app.ActionBarActivity;
        import android.util.Log;
        import android.util.TypedValue;
        import android.view.Gravity;
        import android.view.Surface;
        import android.widget.Toast;
        import java.util.Timer;
        import java.util.TimerTask;
        import android.os.Bundle;
        import android.os.Handler;
        import example.com.adapter.ViewPageAdapter;  //import the ViewPagerAdapter.java file package here

public class MainActivity extends ActionBarActivity {
    ViewPager viewpager;
    PagerAdapter adapter;
    int[] img;

    private static int currentPage = 0;
    private static int NUM_PAGES = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        img = new int[]{R.drawable.car, R.drawable.bike,
                R.drawable.r1, R.drawable.r2,
                R.drawable.r3, R.drawable.yahama, R.drawable.pulsar,
                R.drawable.ninja, R.drawable.honda,
                R.drawable.hero};      //select the image from res/drawable  folder

        viewpager = (ViewPager) findViewById(R.id.pager);
        adapter = new ViewPageAdapter(MainActivity.this, txt, img);
        viewpager.setAdapter(adapter);
        CircleIndicator indicator = (CircleIndicator) findViewById(R.id.indicator);
        indicator.setViewPager(viewpager);
        viewpager.setOnPageChangeListener(new OnPageChangeListener() {

            @Override
            public void onPageSelected(int position) {
                currentPage = position;
            }

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

            @Override
            public void onPageScrollStateChanged(int state) {
                Toast.makeText(getApplicationContext(), "context changed", Toast.LENGTH_SHORT).show();

                if (state == ViewPager.SCROLL_STATE_IDLE) {
                    int pageCount = img.lenght;
                    if (currentPage == 0) {
                        viewpager.setCurrentItem(pageCount - 1, false);
                    } else if (currentPage == pageCount - 1) {
                        viewpager.setCurrentItem(0, false);
                    }
                }
            }
        });
        final Handler handler = new Handler();
        final Runnable update = new Runnable() {
            @Override
            public void run() {
                if (currentPage == NUM_PAGES) {
                    currentPage = 0;
                }
                viewpager.setCurrentItem(currentPage++, true);
            }
        };
        Timer swipeTimer = new Timer();
        swipeTimer.schedule(new TimerTask() {

            @Override
            public void run() {
                handler.post(update);
            }
        }, 1000, 1000);
    }
}

ProgrammingCodeTech

Tuesday, 6 December 2016

View Pager with Circle Indicator(Image slider show)

No comments:

Post a Comment

Popular Posts