Skip to main content
 
Post a Comment

How to make Image Slider by view pager in the android studio(kotlin)

Hi Guys, you have seen many popular android application with an image slider. So, let's learn "How to make Image Slider by view pager in the android studio(kotlin)"
actvity_main.xml

 
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
<android.support.constraint.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

    <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="436dp"
            android:layout_height="220dp"
            app:layout_constraintStart_toStartOf="parent"
            android:layout_marginStart="8dp"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            android:layout_marginEnd="8dp">

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

</android.support.constraint.ConstraintLayout>


viewpager_activity.xml

 
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
<LinearLayout
        android:id="@+id/linearlayout"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

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

</LinearLayout>

MainActivty.kt

 
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
class MainActivity : AppCompatActivity() {

    internal lateinit var viewpager : ViewPager

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

        viewpager = findViewById(R.id.viewpager) as ViewPager

        val adapter = ViewPagerAdapter(this)
        viewpager.adapter = adapter

    }
}



ViewPagerAdapter.kt

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
import android.annotation.SuppressLint
import android.content.Context
import android.support.v4.view.PagerAdapter
import android.support.v4.view.ViewPager
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.ImageView

class ViewPagerAdapter(private val context : Context) : PagerAdapter() {
    private var layoutInflater : LayoutInflater? = null
    val Image = arrayOf(R.drawable.batman , R.drawable.bdeadpool , R.drawable.bsuperman)


    override fun isViewFromObject(view: View, `object`: Any): Boolean {
       return view ===  `object`
    }

    override fun getCount(): Int {
       return Image.size
    }

    @SuppressLint("InflateParams")
    override fun instantiateItem(container: ViewGroup, position: Int): Any {
        layoutInflater = context.getSystemService(Context.LAYOUT_INFLATER_SERVICE) as LayoutInflater
        val v = layoutInflater!!.inflate(R.layout.viewpager_activity , null)
        val image = v.findViewById<View>(R.id.imageview) as ImageView


        image.setImageResource(Image[position])
        val vp = container as ViewPager
        vp.addView(v , 0)


        return v

    }


    override fun destroyItem(container: ViewGroup, position: Int, `object`: Any) {
      val vp = container as ViewPager
        val v = `object` as View
        vp.removeView(v)
    }
}






Labels:

Comments

Post a Comment