StackView in Android Studio

Introduction

 

In this article, you will learn about StackView in Android Studio.

 

StackView

 

Stack View is a type of view that can contain images and you can show your images in a stack form and also scroll your images up and down.

 

Image of StackView

 

 

Step 1

 

Create a Java class and write the following code.

 

In this first, you use all images in an ArrayList and create a stackview to hold the images. You will get all these images in a stack view by ing an object of an Adapter class that extends the Araayadapter classes. We this object to the setAdapter method and call this method with the object of the Adapter class to get all images in a stack.   

import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.*;

import java.util.ArrayList;

public class MainActivity extends Activity {
     StackView sv;
    @SuppressLint("NewApi")
    @Override

    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        StackView stk = (StackView)this.findViewById(R.id.stackView);
        ArrayList<StackItem> items = new ArrayList<StackItem>();
        items.add(new StackItem("text1", this.getResources().getDrawable(R.drawable.pic1 )));
        items.add(new StackItem("text2", this.getResources().getDrawable(R.drawable.pic2)));
        items.add(new StackItem("text3", this.getResources().getDrawable(R.drawable.pic3)));
        items.add(new StackItem("text4", this.getResources().getDrawable(R.drawable.pic4)));
        items.add(new StackItem("text5", this.getResources().getDrawable(R.drawable.pic9)));
        items.add(new StackItem("text6", this.getResources().getDrawable(R.drawable.pic5)));
        items.add(new StackItem("text7", this.getResources().getDrawable(R.drawable.pic6)));
        items.add(new StackItem("text8", this.getResources().getDrawable(R.drawable.pic7)));
        items.add(new StackItem("text9", this.getResources().getDrawable(R.drawable.pic8)));
        AdapterStack adapt = new AdapterStack(this, R.layout.second, items);
        stk.setAdapter(adapt);
    }
    public class StackItem {
        public String itemText;
        public Drawable itemPhoto;
        public StackItem(String text,Drawable photo)
        {
            this.itemPhoto = photo;
            this.itemText = text;
        }
}
    public class AdapterStack extends ArrayAdapter<StackItem> {
        private ArrayList<StackItem> items;
           private Context ctx;
        public AdapterStack(Context context, int textViewResourceId,
                            ArrayList<StackItem> objects) {
            super(context, textViewResourceId, objects);
            this.items = objects;
            this.ctx = context;
        }
        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            View v = convertView;
            if (v == null) {
                LayoutInflater vi = (LayoutInflater)ctx.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                v = vi.inflate(R.layout.second, null);
            }
            StackItem m = items.get(position);
            if (m != null) {
                TextView text = (TextView) v.findViewById(R.id.textview);
                ImageView img = (ImageView)v.findViewById(R.id.imagteview);
                if (text != null) {
                    text.setText(m.itemText);
                    img.setImageDrawable(m.itemPhoto);
                }
            }
            return v;
        }
    }
}

}

Step 2

 

Create An XML file and write this:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent" >
        <TextView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:id="@+id/textview">
        </TextView>

        <ImageView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:id="@+id/imagteview">
        </ImageView>

</FrameLayout>

Step 3

 

Create another XML file and write this:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent" >

    <StackView
            android:id="@+id/stackView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:animateLayoutChanges="true"
            android:background="#F4C2C2"

            >

    </StackView>

</FrameLayout>

Step 4

 

Android Menifest.xml file.

 

In Android Menifest.xml file change the Android minsdk version because StackView does not support a minsdk version less than 11.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.stackvie"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="11"
        android:targetSdkVersion="16" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.stackvie.MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

Output

 

 

When you scroll down the StackView: