View Pager 2

App
Beginner

By:admin
2021-02-20
Comments: 0

Java
Kotlin

View pager2 is fully customize with your requirements. In this example show slider

Main.xml file : this code put in your main.xml file

<?xml version="1.0" encoding="utf-8"?>
<layout>
<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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainActivity2"
android:background="@color/white">

<androidx.viewpager2.widget.ViewPager2
android:id="@+id/viewPager2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:padding="16dp"
android:orientation="horizontal"
android:clipToPadding="false">

</androidx.viewpager2.widget.ViewPager2>

<com.google.android.material.tabs.TabLayout
android:id="@+id/tabLayout"
android:layout_below="@+id/viewPager2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:tabBackground="@drawable/tab_selector"
app:tabGravity="center"
app:tabIndicatorHeight="0dp"/>

</RelativeLayout>
</layout>

Below xml code put in res folder in your project.it is use for show indicator

tab_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:drawable="@drawable/selected_dot"
android:state_selected="true"/>

<item android:drawable="@drawable/default_dot"/>
</selector>

selected_dot.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:innerRadius="0dp"
android:shape="ring"
android:thickness="8dp"
android:useLevel="false">
<solid android:color="#FF03DAC5"/>
</shape>
</item>
</layer-list>

default_dot.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:innerRadius="0dp"
android:shape="ring"
android:thickness="8dp"
android:useLevel="false">
<solid android:color="@android:color/darker_gray"/>
</shape>
</item>
</layer-list>

MainActivity2.java file : this put in main java file

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.databinding.DataBindingUtil;
import android.os.Bundle;
import com.example.mymap.databinding.ActivityMain2Binding;
import com.google.android.material.tabs.TabLayout;
import com.google.android.material.tabs.TabLayoutMediator;

public class MainActivity2 extends AppCompatActivity {

ActivityMain2Binding binding;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = DataBindingUtil.setContentView(this, R.layout.activity_main2);

MyRecyclerView myRecyclerView = new MyRecyclerView(this);
binding.viewPager2.setAdapter(myRecyclerView);



TabLayoutMediator tabLayoutMediator = new TabLayoutMediator(binding.tabLayout, binding.viewPager2, true, new TabLayoutMediator.TabConfigurationStrategy() {
@Override
public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {

}
});
tabLayoutMediator.attach();

}
}

MyRecyclerView.java : it is your adapter so put code in your adepter in your project

import android.content.Context;
import android.view.LayoutInflater;
import android.view.ViewGroup;
import androidx.annotation.NonNull;
import androidx.databinding.DataBindingUtil;
import androidx.recyclerview.widget.RecyclerView;

import com.example.mymap.databinding.ItemViewBinding;

public class MyRecyclerView extends RecyclerView.Adapter<MyRecyclerView.ViewHolder> {

Context context;

public MyRecyclerView(Context context) {
this.context = context;
}

@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
LayoutInflater inflater = LayoutInflater.from(parent.getContext());
ItemViewBinding binding = DataBindingUtil.inflate(inflater, R.layout.item_view, parent, false);
return new ViewHolder(binding);
}

@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {

holder.binding.text.setText("Page "+position);
}

@Override
public int getItemCount() {
return 5;
}

public class ViewHolder extends RecyclerView.ViewHolder {
ItemViewBinding binding;
public ViewHolder(@NonNull ItemViewBinding binding) {
super(binding.getRoot());
this.binding=binding;
}
}
}

item_view.xml file

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:tools="http://schemas.android.com/tools">
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">


<TextView
android:id="@+id/text"
android:gravity="center"
android:layout_centerInParent="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:text="Hello World!!"
android:textColor="@color/white"
android:textSize="48sp"
android:background="#ff0000"/>


</RelativeLayout>
</layout>