Develop Reference

Touch to image view not working

I've made a simple app in which I am using 3 tabs. Each tab is having separate classes and layouts. First tab shows map. Second tab will show the camera from which the user can take picture(s) and third tab is off Pictures in which the captured images are viewed in the GridView. All tabs are working good. Now I want is to show full ImageView when a user tap on any image.
For all of this I am using this tutorial. So I followed each and every step in it and the things are going good. But for full ImageView the code is not working.
Below is my picture Fragment
Pictures.java
public class Pictures extends Fragment implements MainActivity.Updateable {
private Utils utils;
private ArrayList<String> imagePaths = new ArrayList<String>();
private GridViewImageAdapter adapter;
private GridView gridView;
private int columnWidth;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.pictures, container, false);
gridView = (GridView) rootView.findViewById(R.id.grid_view);
utils = new Utils(getContext());
// Initilizing Grid View
InitilizeGridLayout();
// loading all image paths from SD card
imagePaths = utils.getFilePaths();
// Gridview adapter
adapter = new GridViewImageAdapter(getActivity(), imagePaths, columnWidth);
/*adapter = new GridViewImageAdapter(Pictures.this, imagePaths,
columnWidth);*/
// setting grid view adapter
gridView.setAdapter(adapter);
//((BaseAdapter) adapter).notifyDataSetChanged();
//adapter.notifyDataSetChanged();
return rootView;
}
private void InitilizeGridLayout() {
Resources r = getResources();
float padding = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
AppConstant.GRID_PADDING, r.getDisplayMetrics());
columnWidth = (int) ((utils.getScreenWidth() - ((AppConstant.NUM_OF_COLUMNS + 1) * padding)) / AppConstant.NUM_OF_COLUMNS);
gridView.setNumColumns(AppConstant.NUM_OF_COLUMNS);
gridView.setColumnWidth(columnWidth);
gridView.setStretchMode(GridView.NO_STRETCH);
gridView.setPadding((int) padding, (int) padding, (int) padding,
(int) padding);
gridView.setHorizontalSpacing((int) padding);
gridView.setVerticalSpacing((int) padding);
}
#Override
public void update() {
if(adapter !=null)
{
adapter.notifyDataSetChanged();
}
else
{
Log.d(getTag(),"null");
}
}}
Now for full screen view, I have made a new Activity a two separate Layouts one for screen and one for image as below
fullscreen.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="fill_parent"
android:layout_height="fill_parent" /></LinearLayout>
fullscreenImage.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">
<ImageView
android:id="#+id/imgDisplay"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitCenter" />
<Button
android:id="#+id/btnClose"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="15dp"
android:layout_marginTop="15dp"
android:paddingTop="2dp"
android:paddingBottom="2dp"
android:background="#drawable/button_background"
android:textColor="#ffffff"
android:text="Close" /></RelativeLayout>
Now i created a Adapter class
FullScreenImageAdapter.java
public class FullScreenImageAdapter extends PagerAdapter {
private Activity _activity;
private ArrayList<String> _imagePaths;
private LayoutInflater inflater;
// constructor
public FullScreenImageAdapter(Activity activity,
ArrayList<String> imagePaths) {
this._activity = activity;
this._imagePaths = imagePaths;
}
#Override
public int getCount() {
return this._imagePaths.size();
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == ((RelativeLayout) object);
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView imgDisplay;
Button btnClose;
inflater = (LayoutInflater) _activity
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View viewLayout = inflater.inflate(R.layout.layout_fullscreen_image, container,
false);
imgDisplay = (ImageView) viewLayout.findViewById(R.id.imgDisplay);
btnClose = (Button) viewLayout.findViewById(R.id.btnClose);
BitmapFactory.Options options = new BitmapFactory.Options();
options.inPreferredConfig = Bitmap.Config.ARGB_8888;
Bitmap bitmap = BitmapFactory.decodeFile(_imagePaths.get(position), options);
imgDisplay.setImageBitmap(bitmap);
// close button click event
btnClose.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
_activity.finish();
}
});
((ViewPager) container).addView(viewLayout);
return viewLayout;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
((ViewPager) container).removeView((RelativeLayout) object);
}}
Now the full screen Activity
FullScreenViewActivity.java
public class FullScreenViewActivity extends Activity {
private Utils utils;
private FullScreenImageAdapter adapter;
private ViewPager viewPager;
#Override
protected void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_fullscreen_view);
viewPager = (ViewPager)findViewById(R.id.pager);
utils = new Utils(getApplicationContext());
Intent i = getIntent();
int position = i.getIntExtra("position",0);
adapter = new FullScreenImageAdapter(FullScreenViewActivity.this,
utils.getFilePaths());
viewPager.setAdapter(adapter);
// displaying selected image first
viewPager.setCurrentItem(position);
}}
Now when i click on any image nothing happens, I got no errors on logcat, no any warnings nor any app crash.
I have debugged the app but it doesn't goes to that point.
I'm stuck to it, and don't know what to do
Any help would be highly appreciated.

This might not be the answer that you are looking for! But still if your code does not work this will help you towards your solution.If you know the whole process you might be able to plug and play this.
This answer is taken from the same tutorial guy that you followed which has kind of a same pattern with your code. Note image array is hard-coded.
Have a look, Take a special note at AndroidGridLayoutActivity !
Launcher Activity : HomeActivity Other activity you need in your Manifest :FullImageActivity
grid_layout.xml >
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:fitsSystemWindows="true"
android:id="#+id/grid_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:numColumns="3"
android:horizontalSpacing="5dp"
android:verticalSpacing="5dp"
android:gravity="center">
</GridView>
full_image.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:orientation="vertical" >
<ImageView android:id="#+id/full_image_view"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout
HomeActivity >
public class HomeActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.grid_layout);
GridView gridView = (GridView) findViewById(R.id.grid_view);
// Instance of ImageAdapter Class
gridView.setAdapter(new ImageAdapter(this));
}
}
AndroidGridLayoutActivity > (check the comments in this)
public class AndroidGridLayoutActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.grid_layout);
GridView gridView = (GridView) findViewById(R.id.grid_view);
// Instance of ImageAdapter Class
gridView.setAdapter(new ImageAdapter(this));
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
//----------------------Seems In your code you are missing this Part----------------------
// Sending image id to FullScreenActivity
Intent i = new Intent(getApplicationContext(), FullImageActivity.class);
// passing array index
i.putExtra("id", position);
startActivity(i);
}
});
}
}
ImageAdapter >
public class ImageAdapter extends BaseAdapter {
private Context mContext;
// Keep all Images in array - I have hard coded this
public Integer[] mThumbIds = {
R.drawable.casper, R.drawable.casper,
R.drawable.monkey, R.drawable.monkey,
R.drawable.cub, R.drawable.cub,
R.drawable.mouse, R.drawable.mouse,
R.drawable.casper, R.drawable.casper,
R.drawable.monkey, R.drawable.monkey,
R.drawable.cub, R.drawable.cub,
R.drawable.mouse
};
public ImageAdapter(Context c){
mContext = c;
}
#Override
public int getCount() {
return mThumbIds.length;
}
#Override
public Object getItem(int position) {
return mThumbIds[position];
}
#Override
public long getItemId(int position) {
return 0;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView = new ImageView(mContext);
imageView.setImageResource(mThumbIds[position]);
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setLayoutParams(new GridView.LayoutParams(150, 150)); /// IF YOU WANT TO CHANGE IMAGE SIZE CHANGE HERE
return imageView;
}
}
As a separate project this will work.In case if you cant fix your issue plug and play this.Just posting as a help!
Output >

You can try using OnItemClickListener on your grid view like below
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
//Get your item here
adapterView.getItemAtPosition(i);
//Do your code here
}
});
Please make sure that you removed your click listener from getView otherwise it will make conflict.

Please make sure you have to intent single imageview class
Send position id to imageview class I used below code for full screen image view
imageView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent i = new Intent(mContext, Singleimageview.class);
i.putExtra("pos", (Integer) itemView.getTag() + "");
mContext.startActivity(i);
overridePendingTransition(R.anim.pull_in_left, R.anim.pull_out_right);
}
});

ViewPager with items preview

I want to show a ViewPager with all the days of the week with a preview of the following and previous item of the current one.
I've tried a lot of solutions suggested from stackoverflow but none of them is working. I don't wont to use fragments in the ViewPager so I've used a PagerAdapter.
See this image:
My starting point is:
activity_main.xml
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="Choose a day of the week:" />
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/weekOfTheDayPager"/>
MainActivity.java
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
setUpAdapter();
}
private void setUpAdapter() {
ViewPager _mViewPager = (ViewPager) findViewById(R.id.weekOfTheDayPager);
final String[] daysOfTheWeek = {"Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"};
final Context myContext = getBaseContext();
_mViewPager.setAdapter(new PagerAdapter() {
#Override
public int getCount() {
return daysOfTheWeek.length;
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
#Override
public Object instantiateItem(ViewGroup collection, int position) {
LayoutInflater inflater = LayoutInflater.from(myContext);
ViewGroup layout = (ViewGroup) inflater.inflate(R.layout.dayoftheweeklayout, collection, false);
((TextView) layout.findViewById(R.id.dayOfTheWeekTextView)).setText(daysOfTheWeek[position]);
collection.addView(layout);
return layout;
}
#Override
public void destroyItem(ViewGroup collection, int position, Object view) {
collection.removeView((View) view);
}
});
}}
and finally the layout for the ViewPager item:
dayoftheweeklayout.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/dayOfTheWeekTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Sunday"
android:layout_gravity="center_horizontal"/>
</FrameLayout>
Any suggestion will be appreciated.

So it looks like you want a carousel view.
Here's the recipe:
First, in order to show pages to the side in ViewPager, you need to provide some padding on the sides and then set clipToPadding to false:
<android.support.v4.view.ViewPager
android:id="#+id/weekOfTheDayPager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:paddingEnd="#dimen/view_pager_padding"
android:paddingLeft="#dimen/view_pager_padding"
android:paddingRight="#dimen/view_pager_padding"
android:paddingStart="#dimen/view_pager_padding"/>
Next, you need to override getPageWidth in your PagerAdapter to tell the ViewPager that you want to display three pages at a time:
#Override
public float getPageWidth(int position) {
return 1F / 3F;
}
Then you need to tell the ViewPager to use a custom PageTransformer:
viewPager.setPageTransformer(false, new MyPageTransformer());
...
public static class MyPageTransformer implements ViewPager.PageTransformer {
private ArgbEvaluator mColorFade = new ArgbEvaluator();
#Override
public void transformPage(View page, float position) {
// position is 0 when page is centered (current)
// -1 when page is all the way to the left
// +1 when page is all the way to right
// Here's an example of how you might morph the color
int color = mColorFade(Math.abs(position), Color.RED, Color.GRAY);
TextView tv = (TextView) page.findViewById(R.id.dayOfTheWeekTextView);
tv.setTextColor(color);
}
}
There's probably something I forgot, but search SO for "android viewpager carousel" and you will find an answer in there somewhere.

ViewPager setCurrentItem not smooth

I have an activity that contains one ViewPager (nothing else). The fragments I use are extremely simple. They consist of a flat background with two buttons (back and forward).
When the ViewPager scrolls with user input it works smoothly. However, when I program the buttons to use setCurrentItem to the next page the animation is really choppy.
The "choppyness" is only the first time the animation executes. After that, if I go back and forth using the buttons the animation is smooth.
Because of this behavior, I imagine that it has something to do with the way that PageViewer anticipates user behavior. If anyone can shed some light on this matter that would be of great help. Thanks!
I read about similar issues with PageViewer animations being choppy (all of them more than 3 years old). I tried their suggestions and could not get it to work; so I decided to create a new question.
Here is the code I am using:
MainActivity.java
public class MainActivity extends Activity implements MyFragment.Listener {
private ViewPager _pager;
private PagerAdapter _adapter;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_activity);
_pager = (ViewPager)findViewById(R.id.pager);
_adapter = new MyAdapter(this, getFragmentManager());
_pager.setAdapter(_adapter);
}
public void next() {
if(_pager.getCurrentItem() + 1 >= _adapter.getCount()) return;
_pager.setCurrentItem(_pager.getCurrentItem() + 1, true);
}
public void previous() {
if(_pager.getCurrentItem() - 1 < 0) return;
_pager.setCurrentItem(_pager.getCurrentItem() - 1, true);
}
}
MyAdapter.java
public class MyAdapter extends FragmentStatePagerAdapter {
private static final int PAGES = 3;
private ArrayList<Fragment> _slides;
public MyAdapter(MainActivity l, FragmentManager fm) {
super(fm);
_slides = new ArrayList<>();
for(int i = 0; i < PAGES; i++) {
MyFragment f = new MyFragment();
f.addListener(l);
_slides.add(f);
}
}
public Fragment getItem(int position) { return _slides.get(position); }
public int getCount() { return _slides.size(); }
}
MyFragment.java
public class MyFragment extends Fragment {
public interface Listener {
void next();
void previous();
}
private ArrayList<Listener> ls = new ArrayList<>();
public void addListener(Listener l) { ls.add(l); }
protected void next() { for(Listener l : ls) l.next(); }
protected void previous() { for(Listener l : ls) l.previous(); }
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.my_fragment, container, false);
view.setBackgroundColor(Color.argb(255, (int)(Math.random() * 255), (int)(Math.random() * 255), (int)(Math.random() * 255)));
Button bNext = (Button)view.findViewById(R.id.button_next);
bNext.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
next();
}
});
Button bPrevious = (Button)view.findViewById(R.id.button_previous);
bPrevious.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
previous();
}
});
return view;
}
}
main_activity.xml
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
my_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<Button
android:id="#+id/button_previous"
android:layout_width="100dp"
android:layout_height="100dp"
android:text="previous" />
<Button
android:id="#+id/button_next"
android:layout_width="100dp"
android:layout_height="100dp"
android:text="next" />
</LinearLayout>

Create a custom view pager class by extending ViewPager
Override the smoothScrollTo(...) method
void smoothScrollTo(int x, int y, int v) {
super.smoothScrollTo(x, y, 1);
}
The default value used is 0. When you pass 1, scrolling is smooth.

button not clickable when gridview added to framelayout

I have a framelayout with a a textview at the center and button (in included bar.xml) placed at the bottom. The button works perfectly at run time. However, I later add to it a gridview and make the textview invisible. After this, however, the button seizes to recieve and touch or click events.
Anyone know how to achieve this? Or alternative ways to create the same layout.
When I remove the button from the framelayout, it works perfectly even when the gridview shows up. Here's some of my code.
result.xml
<!-- Frame 1 -->
<FrameLayout
android:id="#+id/result_fragment_container"
android:layout_height="match_parent"
android:layout_width="match_parent">
<TextView
android:id="#+id/result_error"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center"
android:visibility="gone"
android:padding="10dp"
android:text="No results found."
android:textColor="#color/theme_support_color"
android:textSize="25sp"
android:layout_gravity="center" />
<include
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:id ="#+id/result_bar"
layout="#layout/bar" />
</FrameLayout>
And bar.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/sl_content"
android:padding="5dp">
<TextView
android:id="#+id/search_location"
android:layout_width="0dp"
android:layout_weight="4"
android:layout_height="#dimen/address_height"
android:gravity="center"
android:textSize="16sp"
android:textColor="#fff"
android:singleLine="true"
android:ellipsize="end"
/>
<!-- Problematic Button -->
<Button
android:id="#+id/button_change_location"
android:layout_width="0dp"
android:layout_height="#dimen/address_change_button_height"
android:text="Change"
android:textSize="12sp"
android:layout_weight="1"
android:textColor="#fff"
/>
</LinearLayout>
Handling Code From MainActivity:
#Override
public void onVolleyDone(JSONObject response) {
//second frame layout
FragmentManager fragmentManager = getFragmentManager();
FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
//send the shop id
ArrayList<ListItem> listItems = new ArrayList<ListItem>();
System.out.println("Volley done counted "+counter);
counter++;
//if it returned any items
if(!response.isNull("item_0")){
//check if the error view is visible
if(errorView.getVisibility()==View.VISIBLE)
errorView.setVisibility(View.GONE);
for (int i = 0; i < response.length(); i++){
try {
JSONObject jObject = response.getJSONObject("item_"+i);
String iName = jObject.getString("item_name");
String iImage = jObject.getString("primary_image");
int iId = Integer.valueOf(jObject.getString("id"));
} catch (JSONException e) {
e.printStackTrace();
}
}
itemsFragment.setListItems(listItems);
fragmentTransaction.add(R.id.result_fragment_container, itemsFragment);
fragmentTransaction.commit();
}else{
errorView.setVisibility(View.VISIBLE);
}
}
ItemsListFragment referenced above:
public class ItemsListFragment extends Fragment implements OnItemClickListener, OnItemLongClickListener{
//variables
private ItemsListAdapter adapter;
private ArrayList<ListItem> listItems;
private GridView gridView;
private ArrayList<ListItem> tempShopItems;
private OnListItemClickListener callBack;
public static final int GRID_NUM_COLUMNS = 2;
private static final String TAG = ItemsListFragment.class.getSimpleName();
public static final int LONG_CLICK = 2;
public static final int SHORT_CLICK = 3;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// TODO Auto-generated method stub
View rootView = inflater.inflate(R.layout.items_list_fragment, container,false);
return rootView;
}
#Override
public void onActivityCreated(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onActivityCreated(savedInstanceState);
//initialize other variables
initVariables();
//get items to display
updateItems();
}
#Override
public void onAttach(Activity activity) {
super.onAttach(activity);
// This makes sure that the container activity has implemented
// the callback interface. If not, it throws an exception
try {
callBack = (OnListItemClickListener) activity;
} catch (ClassCastException e) {
throw new ClassCastException(activity.toString()
+ " must implement OnListItemClickListener");
}
}
private void initVariables(){
//shop items
listItems = new ArrayList<ListItem>();
//grid view
gridView = (GridView) getActivity().findViewById(R.id.gridView);
gridView.setOnItemLongClickListener(this);
gridView.setNumColumns(GRID_NUM_COLUMNS);
//adapter
adapter = new ItemsListAdapter(getActivity().getApplicationContext(),listItems);
//set onitemclick listener
gridView.setOnItemClickListener(this);
//set adapter
gridView.setAdapter(adapter);
}
#Override
public void onItemClick(AdapterView<?> parent, View view, int position,long id) {
if(parent.getItemAtPosition(position) instanceof Item){
//start another activity
}else
callBack.onListItemClick(parent, view, position, id,SHORT_CLICK);
}
public void setListItems(ArrayList<ListItem> items){
tempShopItems = items;
System.out.println("Temp items after= "+tempShopItems.toString());
}
public void updateItems(){
listItems.addAll(0, tempShopItems);
adapter.notifyDataSetChanged();
}
public void removeFromList(int index){
listItems.remove(index);
adapter.notifyDataSetChanged();
}
#Override
public boolean onItemLongClick(AdapterView<?> parent, View view, int position, long id) {
callBack.onListItemClick(parent, view, position, id, LONG_CLICK);
return true;
}
public interface OnListItemClickListener{
public void onListItemClick(AdapterView<?> parent, View view, int position,long id, int type);
}
}

Using pageviewer with custom layout in android

i am new to android and while gallery is being showing as depreciated try to use the viewpager concept to dynamically loading custom layout which consist of imageview and textview everything is going great but while loading the viewpager the image appear to left and right side of the viewpager and showing large space so the question is how can we remove the space in between the page or view while using viewpager.
here is the screenshot what i try to achieve:
and here is what i am getting :
so as u see the red circled two image are those image which is adding to the viewpager and there is lot of space in between two image.
mentioning the pageadapter class where the image and text are there
public class ImagePagerAdapter extends PagerAdapter {
private ArrayList<Integer> filter_image_arr;
private ArrayList<String> filter_desc;
private Context mcontext;
private LayoutInflater inflator;
private View layout;
private TextView filter_title;
private ImageView filter_image;
public ImagePagerAdapter(Context context) {
// TODO Auto-generated constructor stub
mcontext=context;
/*
* add image to the arraylist
*/
filter_image_arr=new ArrayList<Integer>();
filter_image_arr.add(R.drawable.cakenormal);
filter_image_arr.add(R.drawable.blur);
filter_image_arr.add(R.drawable.emboss);
filter_image_arr.add(R.drawable.gray);
filter_image_arr.add(R.drawable.hue);
filter_image_arr.add(R.drawable.monochrome);
filter_image_arr.add(R.drawable.nored);
filter_image_arr.add(R.drawable.oil);
filter_image_arr.add(R.drawable.pixellate);
filter_image_arr.add(R.drawable.posterize);
filter_image_arr.add(R.drawable.sepia);
filter_image_arr.add(R.drawable.vibrance);
filter_image_arr.add(R.drawable.vintage);
/*
* add the desc for the filter effect....
*
*/
filter_desc=new ArrayList<String>();
filter_desc.add("NORMAL");
filter_desc.add("BLUR");
filter_desc.add("EMBOSS");
filter_desc.add("GRAY");
filter_desc.add("HUE");
filter_desc.add("MONOCHROME");
filter_desc.add("NO RED");
filter_desc.add("OIL");
filter_desc.add("PIXELATE");
filter_desc.add("POSTERIZE");
filter_desc.add("SEPIA");
filter_desc.add("VIBRANCE");
filter_desc.add("VINTAGE");
inflator=(LayoutInflater) mcontext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
// TODO Auto-generated method stub
layout=inflator.inflate(R.layout.custom_gallery_item_layout, null);
filter_image=(ImageView) layout.findViewById(R.id.filter_image);
filter_image.setImageResource(filter_image_arr.get(position));
filter_image.setScaleType(ImageView.ScaleType.FIT_START);
int padding=mcontext.getResources().getDimensionPixelSize(R.dimen.activity_horizontal_margin);
filter_image.setTag(position);
//filter_image.setPadding(padding, padding, padding, padding);
filter_title=(TextView) layout.findViewById(R.id.filter_desc);
filter_title.setText(filter_desc.get(position));
filter_title.setTag(position);
((ViewPager)container).addView(layout, 0);
return layout;
}
#Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0==((View)arg1);
}
#Override
public int getCount() {
// TODO Auto-generated method stub
return filter_image_arr.size();
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
// TODO Auto-generated method stub
((ViewPager)container).removeView((View)object);
}
}
and here is the activity class where adding adapter to the viewpager
public class MainActivity extends Activity {
//private GPUImageView gpuimageview;
private Button save_image;
private Context mcontext;
private ViewPager gallery_pager;
private ImagePagerAdapter pageadapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mcontext=MainActivity.this;
//gpuimageview=(GPUImageView) findViewById(R.id.gpuimageview);
gallery_pager=(ViewPager) findViewById(R.id.view_pager);
gallery_pager.setPageMargin(-50);
gallery_pager.setHorizontalFadingEdgeEnabled(true);
gallery_pager.setFadingEdgeLength(30);
pageadapter=new ImagePagerAdapter(mcontext);
gallery_pager.setAdapter(pageadapter);
gallery_pager.setOnPageChangeListener(new OnPageChangeListener() {
#Override
public void onPageSelected(int arg0) {
// TODO Auto-generated method stub
}
#Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}
#Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
});
}
}
so can anyone tell me how the thing can be achieve of the first screenshot or i go with the old gallery concept.
here the xml part which contain the viewpager
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<RelativeLayout
android:id="#+id/filtergallery_layout"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginBottom="14dp"
android:background="#AA000000" >
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
/>
</RelativeLayout>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/gpuimageview"
android:layout_alignParentLeft="true"
android:text="save" />
</RelativeLayout>
and here is the custom layout which contain the imageview and textview which i m inflating
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/filter_image"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/ic_launcher"
/>
<TextView
android:id="#+id/filter_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/filter_image"
android:layout_alignParentLeft="true"
android:layout_marginLeft="3dp"
android:background="#07000000"
android:text="filter" />
</RelativeLayout>
so any help will be appreciated.Thanks.

WiewPager doesn't support wrap_content, you can either set match_parent, or a fixed size . If you set wrap_content then it will be considered by the system as match_parent