Viewpager in android using kotlin

Video Demo:

As we know that Viewpager is used to slide the screen. There are alots of tutorial of using viewpager in android programmatically with java, But there are limited example of using viewpager with kotlin. So here I am showing tutorial of using Viewpager in android using kotlin. Download source code from here.

activity_main.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFFFFF">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_margin="20dp"
        android:layout_height="match_parent"
        android:layout_centerInParent="true"></android.support.v4.view.ViewPager>
</RelativeLayout>

MainActivity.kt:

package com.deepshikha.viewpagerkotlin

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.support.v4.app.FragmentManager
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val obj_adapter : ViewPagerAdapter
        obj_adapter = ViewPagerAdapter(supportFragmentManager)
        viewpager.adapter=obj_adapter
    }
}

Model.kt:

package com.deepshikha.viewpagerkotlin

/**
 * Created by deepshikha on 11/9/17.
 */
public class Model{
    var str_name=""
    var str_des=""
    var str_color=""
    var int_image=0

    constructor(str_name: String, int_image: Int,str_color:String,str_des:String) {
        this.str_name = str_name
        this.int_image = int_image
        this.str_color=str_color
        this.str_des=str_des
    }
}

fragment_category.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#91ecbd"
    android:id="@+id/ll_main"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tv_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:gravity="center"
        android:text=""
        android:textColor="#000000"
        android:textSize="20dp"
        android:textStyle="bold" />

    <ImageView
        android:id="@+id/iv_image"
        android:scaleType="centerCrop"
        android:layout_width="match_parent"
        android:layout_height="250dp" />

    <TextView
        android:id="@+id/tv_des"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:gravity="center"
        android:text=""
        android:textColor="#000000"
        android:textSize="15dp"
        android:textStyle="italic" />

</LinearLayout>

CategoryFragment.kt:

package com.deepshikha.viewpagerkotlin

import android.graphics.Color
import android.os.Bundle
import android.support.v4.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.ImageView
import android.widget.LinearLayout
import android.widget.TextView

/**
 * Created by deepshikha on 12/9/17.
 */
public class CategoryFragment : Fragment() {
    val al_category = ArrayList()
    var int_position: Int = 0
    lateinit var iv_image12: ImageView
    lateinit var tv_des: TextView
    lateinit var tv_name: TextView
    lateinit var ll_main: LinearLayout
    lateinit var view12: View

    override fun onCreateView(inflater: LayoutInflater?, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        // Inflate the layout for this fragment
         view12 = inflater!!.inflate(R.layout.fragment_category, container, false)


        fn_arraylist()
        init()

        return view12
    }

    public fun init() {

        iv_image12 = view12?.findViewById(R.id.iv_image) as ImageView
        tv_name = view12?.findViewById(R.id.tv_name) as TextView
        tv_des = view12?.findViewById(R.id.tv_des) as TextView
        ll_main = view12?.findViewById(R.id.ll_main) as LinearLayout

        int_position = arguments.getInt("position")
        iv_image12.setImageResource(al_category.get(int_position).int_image)
        tv_name.setText(al_category.get(int_position).str_name)
        tv_des.setText(al_category.get(int_position).str_des)
        ll_main.setBackgroundColor(Color.parseColor(al_category.get(int_position).str_color))
    }


    public fun fn_arraylist() {
        al_category.add(Model("BURJ KHALIFA", R.drawable.burjkhalifa, "#f9b994","The Burj Khalifa, known as the Burj Dubai before its inauguration, is a megatall skyscraper in Dubai, United Arab Emirates."))
        al_category.add(Model("Taj Mahal", R.drawable.tajmahal, "#bdf3f7","he Taj Mahal is an ivory-white marble mausoleum on the south bank of the Yamuna river in the Indian city of Agra. It was commissioned in 1632 by the Mughal emperor, Shah Jahan, to house the tomb of his favourite wife, Mumtaz Mahal."))
        al_category.add(Model("Sagrada Família", R.drawable.sagrada, "#91ecbd","The Basílica i Temple Expiatori de la Sagrada Família is a large unfinished Roman Catholic church in Barcelona, designed by Catalan architect Antoni Gaudí"))
    }
}