questionoverflow
Lurker
i created a image grid-view app and i want to swipe grid-view images in full screen.
i want to swipe images in left and right both direction.
i found swipe image code from search:
i am beginner in android programing so i don't know how do i implement this code in my app code.
so i need help to implement this swipe code in my app.
**Swipe Image Code**
**MainActivity.java**
**activity_main.xml**
**my app code (image grid-view)**
**MainActivity,java**
**activity_main.xml**
**photo_item.xml**
please guide me how do i implement / adjust swipe image code in my grid-view app code.
so when i click / tab a image in grid-view it should open in swipe able full screen.
i want to swipe images in left and right both direction.
i found swipe image code from search:
i am beginner in android programing so i don't know how do i implement this code in my app code.
so i need help to implement this swipe code in my app.
**Swipe Image Code**
**MainActivity.java**
Code:
package com.sqisland.android.swipe_image_viewer;
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
public class MainActivity extends Activity
{
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
ImagePagerAdapter adapter = new ImagePagerAdapter();
viewPager.setAdapter(adapter);
}
private class ImagePagerAdapter extends PagerAdapter
{
private int[] mImages = new int[]
{
R.drawable.chiang_mai,
R.drawable.himeji,
R.drawable.petronas_twin_tower,
R.drawable.ulm
};
@Override
public int getCount()
{
return mImages.length;
}
@Override
public boolean isViewFromObject(View view, Object object)
{
return view == ((ImageView) object);
}
@Override
public Object instantiateItem(ViewGroup container, int position)
{
Context context = MainActivity.this;
ImageView imageView = new ImageView(context);
int padding = context.getResources().getDimensionPixelSize(
R.dimen.padding_medium);
imageView.setPadding(padding, padding, padding, padding);
imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
imageView.setImageResource(mImages[position]);
((ViewPager) container).addView(imageView, 0);
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object)
{
((ViewPager) container).removeView((ImageView) object);
}
}
}**activity_main.xml**
Code:
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />**my app code (image grid-view)**
**MainActivity,java**
Code:
package com.td.gridview;
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.view.ViewTreeObserver;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
public class MainActivity extends Activity {
private GridView photoGrid;
private int mPhotoSize, mPhotoSpacing;
private ImageAdapter imageAdapter;
// Some items to add to the GRID
private static final String[] CONTENT = new String[] { "Akon", "Justin Bieber", "AlRight", "Big Sean",
"Britney Spears", "Hilary", "Micheal Buble", "Akon", "Justin Bieber", "AlRight", "Big Sean",
"Britney Spears", "Hilary", "Micheal Buble", "Britney Spears", "Hilary", "Micheal Buble", "Akon",
"Justin Bieber", "AlRight", "Big Sean", "Britney Spears", "Hilary", "Micheal Buble", "Akon",
"Justin Bieber", "AlRight", "Big Sean", "Britney Spears", "Hilary", "Micheal Buble", "Akon",
"Justin Bieber", "AlRight", "Big Sean", "Britney Spears", "Hilary", "Micheal Buble", "Britney Spears",
"Hilary", "Micheal Buble", "Akon", "Justin Bieber", "AlRight", "Big Sean", "Britney Spears", "Hilary",
"Micheal Buble" };
private static final int[] ICONS = new int[] { R.drawable.cover_akon, R.drawable.cover_justin,
R.drawable.cover_alright, R.drawable.cover_big_sean, R.drawable.cover_britney, R.drawable.cover_hilary,
R.drawable.cover_mb, R.drawable.cover_akon, R.drawable.cover_justin, R.drawable.cover_alright,
R.drawable.cover_big_sean, R.drawable.cover_britney, R.drawable.cover_hilary, R.drawable.cover_mb,
R.drawable.cover_britney, R.drawable.cover_hilary, R.drawable.cover_mb, R.drawable.cover_akon,
R.drawable.cover_justin, R.drawable.cover_alright, R.drawable.cover_big_sean, R.drawable.cover_britney,
R.drawable.cover_hilary, R.drawable.cover_mb, R.drawable.cover_akon, R.drawable.cover_justin,
R.drawable.cover_alright, R.drawable.cover_big_sean, R.drawable.cover_britney, R.drawable.cover_hilary,
R.drawable.cover_mb, R.drawable.cover_akon, R.drawable.cover_justin, R.drawable.cover_alright,
R.drawable.cover_big_sean, R.drawable.cover_britney, R.drawable.cover_hilary, R.drawable.cover_mb,
R.drawable.cover_britney, R.drawable.cover_hilary, R.drawable.cover_mb, R.drawable.cover_akon,
R.drawable.cover_justin, R.drawable.cover_alright, R.drawable.cover_big_sean, R.drawable.cover_britney,
R.drawable.cover_hilary, R.drawable.cover_mb };
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// get the photo size and spacing
mPhotoSize = getResources().getDimensionPixelSize(R.dimen.photo_size);
mPhotoSpacing = getResources().getDimensionPixelSize(R.dimen.photo_spacing);
// initialize image adapter
imageAdapter = new ImageAdapter();
photoGrid = (GridView) findViewById(R.id.albumGrid);
// set image adapter to the GridView
photoGrid.setAdapter(imageAdapter);
// get the view tree observer of the grid and set the height and numcols dynamically
photoGrid.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
if (imageAdapter.getNumColumns() == 0) {
final int numColumns = (int) Math.floor(photoGrid.getWidth() / (mPhotoSize + mPhotoSpacing));
if (numColumns > 0) {
final int columnWidth = (photoGrid.getWidth() / numColumns) - mPhotoSpacing;
imageAdapter.setNumColumns(numColumns);
imageAdapter.setItemHeight(columnWidth);
}
}
}
});
}
// ///////// ImageAdapter class /////////////////
public class ImageAdapter extends BaseAdapter {
private LayoutInflater mInflater;
private int mItemHeight = 0;
private int mNumColumns = 0;
private RelativeLayout.LayoutParams mImageViewLayoutParams;
public ImageAdapter() {
mInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
mImageViewLayoutParams = new RelativeLayout.LayoutParams(LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT);
}
public int getCount() {
return CONTENT.length;
}
// set numcols
public void setNumColumns(int numColumns) {
mNumColumns = numColumns;
}
public int getNumColumns() {
return mNumColumns;
}
// set photo item height
public void setItemHeight(int height) {
if (height == mItemHeight) {
return;
}
mItemHeight = height;
mImageViewLayoutParams = new RelativeLayout.LayoutParams(LayoutParams.MATCH_PARENT, mItemHeight);
notifyDataSetChanged();
}
public Object getItem(int position) {
return position;
}
public long getItemId(int position) {
return position;
}
public View getView(final int position, View view, ViewGroup parent) {
if (view == null)
view = mInflater.inflate(R.layout.photo_item, null);
ImageView cover = (ImageView) view.findViewById(R.id.cover);
TextView title = (TextView) view.findViewById(R.id.title);
cover.setLayoutParams(mImageViewLayoutParams);
// Check the height matches our calculated column width
if (cover.getLayoutParams().height != mItemHeight) {
cover.setLayoutParams(mImageViewLayoutParams);
}
cover.setImageResource(ICONS[position % ICONS.length]);
title.setText(CONTENT[position % CONTENT.length]);
return view;
}
}
}**activity_main.xml**
Code:
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/albumGrid"
style="@style/PhotoGrid"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/black"
android:columnWidth="@dimen/photo_size"
android:horizontalSpacing="@dimen/photo_spacing"
android:numColumns="auto_fit"
android:padding="4dp"
android:scrollbars="none"
android:stretchMode="columnWidth"
android:verticalSpacing="@dimen/photo_spacing" />**photo_item.xml**
Code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/album_item"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="@+id/cover"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/cover"
android:background="#70000000"
android:padding="6dp" >
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:textColor="@color/white"
android:textSize="12sp"
android:textStyle="bold" />
</LinearLayout>
</RelativeLayout>please guide me how do i implement / adjust swipe image code in my grid-view app code.
so when i click / tab a image in grid-view it should open in swipe able full screen.
