Thursday 20 August 2020

how to create slider using android studio simple example

 how to create slider using android studio simple example

View Video: https://youtu.be/LUnA4JzQ_RE

Activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context=".MainActivity">


    <androidx.viewpager.widget.ViewPager

        android:id="@+id/view_pager"


        android:layout_width="match_parent"

        android:layout_height="match_parent"
        android:background="@color/colorPrimary" />

    <LinearLayout


        android:id="@+id/layoutDots"


        android:layout_width="match_parent"


        android:layout_height="@dimen/dots_height"


        android:layout_alignParentBottom="true"


        android:layout_marginBottom="@dimen/dots_margin_bottom"


        android:gravity="center"


        android:orientation="horizontal"></LinearLayout>

    <View


        android:layout_width="match_parent"


        android:layout_height="1dp"


        android:layout_above="@id/layoutDots"


        android:alpha=".20"


        android:background="@android:color/white" />


    <Button


        android:id="@+id/btn_next"


        android:layout_width="wrap_content"


        android:layout_height="wrap_content"


        android:layout_alignParentRight="true"


        android:layout_alignParentBottom="true"


        android:background="@null"


        android:text="Next"


        android:textColor="@android:color/white" />


    <Button


        android:id="@+id/btn_skip"


        android:layout_width="wrap_content"


        android:layout_height="wrap_content"


        android:layout_alignParentLeft="true"


        android:layout_alignParentBottom="true"


        android:background="@null"


        android:text="skip"


        android:textColor="@android:color/white" />
</RelativeLayout>


MainActivity.java

package com.example.slider;

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.text.Html;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    ViewPager viewPager;
    MyViewPagerAdapter myViewPagerAdapter;
    LinearLayout linearLayout;
    TextView[] dots;
    static  int[] dotalayout;
    Button btnSkip,btnNext;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager=(ViewPager)findViewById(R.id.view_pager);
        linearLayout=(LinearLayout)findViewById(R.id.layoutDots);
        btnNext=(Button)findViewById(R.id.btn_next);
        btnSkip=(Button)findViewById(R.id.btn_skip);

        dotalayout=new int[]{
          R.layout.screen1,R.layout.screen2,R.layout.screen3,R.layout.screen4
        };
        addbtn(0);
        myViewPagerAdapter=new MyViewPagerAdapter(MainActivity.this);
        viewPager.setAdapter(myViewPagerAdapter);
        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                addbtn(position);
                if (position== dotalayout.length)
                {
                    btnNext.setText("Start");
                    btnSkip.setVisibility(View.GONE);
                }
                else
                {
                    btnNext.setText("NEXT");
                    btnSkip.setVisibility(View.VISIBLE);
                }

            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
    }
    public  void  addbtn(int CurrentPage)
    {
        dots=new TextView[dotalayout.length];
        int [] colorActive=getResources().getIntArray(R.array.array_dot_active);
        int [] colorInActive=getResources().getIntArray(R.array.array_dot_inactive);
        linearLayout.removeAllViews();
        for(int i=0;i< dots.length;i++)
        {
            dots[i]=new TextView(this);
            dots[i].setText(Html.fromHtml("&#8226;"));
            dots[i].setTextSize(35);
            dots[i].setTextColor(colorInActive[CurrentPage]);
            linearLayout.addView(dots[i]);
        }
        if(dots.length>0)
        {
            dots[CurrentPage].setTextColor(colorActive[CurrentPage]);
        }
    }
}

MyViewpageAdapter.java

package com.example.slider;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;

import static com.example.slider.MainActivity.dotalayout;

public class MyViewPagerAdapter extends PagerAdapter {
    Context cx;
    LayoutInflater layoutInflater;

    public MyViewPagerAdapter(Context context) {
        cx = context;
    }

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

    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {

        layoutInflater = (LayoutInflater) cx.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View view = layoutInflater.inflate(dotalayout[position], container, false);
        container.addView(view);
        return view;
    }

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

    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        View view=(View) object;
        container.removeView(view);
    }
}

layout/screen1.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:background="@color/bg_screen1">

    <LinearLayout

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerInParent="true"

        android:gravity="center_horizontal"

        android:orientation="vertical">

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginBottom="50dp"

            android:text="WELCOME"
            android:textColor="@android:color/background_dark"

            android:textSize="@dimen/slide_title"

            android:textStyle="bold" />

        <ImageView

            android:layout_width="@dimen/img_width_height"


            android:layout_height="@dimen/img_width_height"

            android:src="@drawable/avadh" />

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginTop="20dp"
            android:text="AVADH TUTOR"

            android:textColor="@android:color/holo_red_dark"

            android:textSize="@dimen/slide_title"

            android:textStyle="bold" />


    </LinearLayout>

</RelativeLayout>


layout/screen2.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:background="@color/bg_screen2">

    <LinearLayout

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerInParent="true"

        android:gravity="center_horizontal"

        android:orientation="vertical">

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginBottom="50dp"

            android:text="All Languages"
            android:textColor="@android:color/background_dark"

            android:textSize="@dimen/slide_title"

            android:textStyle="bold" />

        <ImageView

            android:layout_width="@dimen/img_width_height"


            android:layout_height="@dimen/img_width_height"

            android:src="@drawable/program" />

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginTop="20dp"
            android:text="Please Like and Share"

            android:textColor="@android:color/holo_red_dark"

            android:textSize="@dimen/slide_title"
            android:textStyle="bold" />


    </LinearLayout>

</RelativeLayout>

layout/screen3.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:background="@color/bg_screen3">
    <LinearLayout

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerInParent="true"

        android:gravity="center_horizontal"

        android:orientation="vertical">

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginBottom="50dp"

            android:text="WELCOME"
            android:textColor="@android:color/background_dark"

            android:textSize="@dimen/slide_title"

            android:textStyle="bold" />

        <ImageView
            android:layout_width="@dimen/img_width_height"


            android:layout_height="@dimen/img_width_height"

            android:src="@drawable/blog" />

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginTop="20dp"
            android:text="Look Our Blog"

            android:textColor="@android:color/holo_red_dark"

            android:textSize="@dimen/slide_title"

            android:textStyle="bold" />


    </LinearLayout>


</RelativeLayout>

layout/screen4.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:background="@color/bg_screen4">

    <LinearLayout

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerInParent="true"

        android:gravity="center_horizontal"

        android:orientation="vertical">

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginBottom="50dp"

            android:text="AVADH TUTOR"
            android:textColor="@android:color/background_dark"

            android:textSize="@dimen/slide_title"

            android:textStyle="bold" />

        <ImageView

            android:layout_width="@dimen/img_width_height"


            android:layout_height="@dimen/img_width_height"

            android:src="@drawable/subscribe" />

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginTop="20dp"
            android:text="Lets Start"

            android:textColor="@android:color/holo_red_dark"

            android:textSize="@dimen/slide_title"

            android:textStyle="bold" />


    </LinearLayout>


</RelativeLayout>

values/ colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#6200EE</color>
    <color name="colorPrimaryDark">#3700B3</color>
    <color name="colorAccent">#03DAC5</color>

    <color name="bg_screen1">#BDB883</color>
    <color name="bg_screen2">#AAE6E1</color>
    <color name="bg_screen3">#F4DDB9</color>
    <color name="bg_screen4">#CAECA3</color>
    <array name="array_dot_active">
        <item>#F0E9A9</item>
        <item>#ABEEE5</item>
        <item>#F1C98D</item>
        <item>#D4F1B1</item>
    </array>
    <array name="array_dot_inactive">
        <item>#DFC90B</item>
        <item>#0C917E</item>
        <item>#BE7A15</item>
        <item>#619C1D</item>
    </array>
</resources>


Save Your Images inside drawable folder


View Video : https://youtu.be/LUnA4JzQ_RE



on 4 comments:
Subscribe to: Posts (Atom)