Image slider after listview item click

1.6k views Asked by At

I have some 50-60 images. I want to display a list of the title of those images and if i click a item the image corresponding to that item and details of that image have to be opened and then the next images should be viewed by sliding. I have the code to display the listview and i need the code to onclick listener and image slider as i am a newbie in android development. the codes i have are

FilmActivity.java , activity_film.xml , filmlist.xml

These will display the listview using linked hashmap. Now i need the rest of the code.

FilmActivity.java

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ListView;
import android.widget.SimpleAdapter;

import java.util.ArrayList;
import java.util.Iterator;
import java.util.LinkedHashMap;
  import java.util.List;
  import java.util.Map;

public class FilmActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_film);
    ListView resultsListView = findViewById(R.id.filmlist);


    LinkedHashMap<String, String> filmNames= new LinkedHashMap<>();
    filmNames.put("En veedu En Kanavar" , "1990");
    filmNames.put("Amaravathi","1993");
    filmNames.put("Prema Pusthakam","1993");
    filmNames.put("Paasamalargal","1994");
    List<LinkedHashMap<String, String>> listItems = new ArrayList<>();
    SimpleAdapter adapter = new SimpleAdapter(this, listItems, R.layout.biolist,
            new String[]{"First Line", "Second Line"},
            new int[]{R.id.text1, R.id.text2});


    Iterator it = filmNames.entrySet().iterator();
    while (it.hasNext()) {
        LinkedHashMap<String, String> resultsMap = new LinkedHashMap<>();
        Map.Entry pair = (Map.Entry) it.next();
        resultsMap.put("First Line", pair.getKey().toString());
        resultsMap.put("Second Line", pair.getValue().toString());
        listItems.add(resultsMap);
    }

    resultsListView.setAdapter(adapter);

}
} 

activity_film.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">

<ListView
    android:id="@+id/filmlist"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentStart="true"
    android:layout_alignParentBottom="true"
    android:layout_marginBottom="0dp" />
</RelativeLayout>

filmlist.xml

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark">

<TextView android:id="@+id/text1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColor="@color/colorAccent"
    android:textSize="21sp"
    android:textStyle="bold"
    />

<TextView android:id="@+id/text2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textSize="16sp"
    android:textColor="@color/white"
    android:textStyle="bold"
    />

</LinearLayout>
2

There are 2 answers

2
oztrna On BEST ANSWER

Setclicklistener your items after you can use a github library for a image slider. There are many libraries where you can use full screen or banner slider style. Ex:

If you want create yourself you can use viewpager for image sliding.

4
Jay Thakkar On

You can set OnItemClickListener based on selected item you can rediect to detail and show slider of image.

Updated code :

    resultsListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position,
                                long id) {

            LinkedHashMap<String, String> selectItem = listItems.get(position);
            String firstLine = selectItem.get("First Line");
            String secondLine = selectItem.get("Second Line");

            Intent intent = new Intent(FilmActivity.this, FilmDetailActivity.class);

            intent.putExtra("firstLine", firstLine);
            intent.putExtra("secondLine", secondLine);
            startActivity(intent);
        }
    });