drawable~indicator.xml

<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="rectangle"
    android:useLevel="true"
    android:dither="true"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <size android:height="8dp" android:width="8dp" />

    <solid android:color="#ffffff" />
</shape>

drawable~indicator_inactive.xml

<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="rectangle"
    android:useLevel="true"
    android:dither="true"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <size android:height="8dp" android:width="8dp" />

    <solid android:color="#7b7b7b" />
</shape>

layout~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">

    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </android.support.v4.view.ViewPager>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal"
        android:gravity="center"
        android:layout_marginBottom="55sp"
        android:id="@+id/rect"
        />

</RelativeLayout>

layout~first.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="#000000"
    >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#ffffff"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:layout_centerInParent="true"
        android:textSize="30dp"
        android:text="Text 1" />
</RelativeLayout>

layout~second.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="#6b0226"
    >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#ffffff"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:layout_centerInParent="true"
        android:textSize="30dp"
        android:text="Text 2" />
</RelativeLayout>

MainActivity.java

package com.example.ahmad.myapplication;

import android.os.Bundle;
import android.support.v4.content.ContextCompat;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;

public class MainActivity extends AppCompatActivity{

    ImageView [] rects;
    LinearLayout rectLayout;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final int[] layouts = {R.layout.first, R.layout.second};
        rectLayout = findViewById(R.id.rect);

        ViewPager vp = findViewById(R.id.vp);


        vpadapter vpa = new vpadapter(layouts, this);
        vp.setAdapter(vpa);

        createRects(0, layouts.length);

        vp.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int i, float v, int i1) {}
            @Override
            public void onPageSelected(int i) {
                createRects(i, layouts.length);
            }
            @Override
            public void onPageScrollStateChanged(int i) {}
        });
    }

    private void createRects(int pos, int length){
        if(rectLayout != null)
            rectLayout.removeAllViews();
        rects = new ImageView[length];

        for (int i = 0; i < length; i++) {
            rects[i] = new ImageView(this);
            if(i == pos) {
                rects[i].setImageDrawable(ContextCompat.getDrawable(this, R.drawable.indicator));
            } else {
                rects[i].setImageDrawable(ContextCompat.getDrawable(this, R.drawable.indicator_inactive));
            }

            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
                    ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT
            );

            params.setMargins(4, 0, 4, 0);

            rectLayout.addView(rects[i], params);
        }
    }
}

vpadapter.java

package com.example.ahmad.myapplication;

import android.content.Context;
import android.support.annotation.NonNull;
import android.support.v4.view.PagerAdapter;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class vpadapter extends PagerAdapter {

    int [] layouts;
    LayoutInflater li;
    Context context;

    public vpadapter(int [] layouts, Context ct) {
        this.layouts = layouts;
        context = ct;
        li = (LayoutInflater) ct.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

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

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


    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        View v = li.inflate(layouts[position], container, false);
        container.addView(v);
        return v;
    }

    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        View v = (View) object;

        container.removeView(v);
    }
}