I have app , one of its activity is infinite galley with images stored in res drawable folder ,
im trying to have double tab and Pinch Zoom for images ,
i searched Google no any example related to zoom effect with infinite gallery ,
any advice will be appreciated .
DayGallery.java:
@SuppressWarnings("deprecation")
public class DayGallery extends Activity {
TextView tv;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);
Boolean customTitleSupported = requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
// Set the layout to use
setContentView(R.layout.main);
if (customTitleSupported) {
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,R.layout.custom_title);
tv = (TextView) findViewById(R.id.title_tv1);
tv.setTypeface(FontFactory.getBFantezy(getBaseContext()));
}
InfiniteGallery galleryOne = (InfiniteGallery) findViewById(R.id.galleryOne);
galleryOne.setAdapter(initializeImages());
galleryOne.setSelection(galleryOne.getCount()/2);
}
private InfiniteGalleryAdapter initializeImages() {
InfiniteGalleryAdapter galleryAdapter = null;
String day = getIntent().getStringExtra("dayname");
if(day.equalsIgnoreCase("Day1")){
int[] tempimages = { R.drawable.day_one_1, R.drawable.day_one_2,R.drawable.day_one_3,
R.drawable.day_one_4, R.drawable.day_one_5,R.drawable.day_one_6,R.drawable.day_one_7,
R.drawable.day_one_8, R.drawable.day_one_9,R.drawable.day_one_10,R.drawable.day_one_11,
R.drawable.day_one_12
};
String[] name = { "00:35","00:35","00:35","1:07","2:00","2:01","2:09",
"2:12","2:15","6:13","6:13","6:13"
};
tv.setText("Day one pictures");
galleryAdapter=new InfiniteGalleryAdapter(this, tempimages, name);
}
else if(day.equalsIgnoreCase("Day2")){
int[] tempimages = { R.drawable.day_two_1, R.drawable.day_two_2,R.drawable.day_two_3,
R.drawable.day_two_4, R.drawable.day_two_5,R.drawable.day_two_6,R.drawable.day_two_7,
R.drawable.day_two_8, R.drawable.day_two_9,R.drawable.day_two_10,R.drawable.day_two_11,
R.drawable.day_two_12
};
String[] name = { "12:04","12:04", "12:04","12:05","12:06", "12:07",
"12:07","12:07","12:08","12:10","12:10","12:10"
};
tv.setText("Day two pictures");
galleryAdapter=new InfiniteGalleryAdapter(this, tempimages, name);
}
// AND THE SAME FOR REST OF DAYS TILL Day10//
return galleryAdapter;
}
}
class InfiniteGalleryAdapter extends BaseAdapter {
private Context mContext;
private int[] images;
private String[] name;
public InfiniteGalleryAdapter(Context c, int[] imageIds,String[] names) {
this.mContext = c;
images = imageIds;
name=names;
inflater = (LayoutInflater)mContext.getSystemService ( Context.LAYOUT_INFLATER_SERVICE);
}
public int getCount() {
return Integer.MAX_VALUE;
}
public Object getItem(int position) {
return position;
}
public long getItemId(int position) {
return position;
}
private LayoutInflater inflater=null;
public class ViewHolder{
public TextView text;
public ImageView image;
}
public View getView(int position, View convertView, ViewGroup parent) {
ImageView i = getImageView();
int itemPos = (position % images.length);
try { i.setImageResource(images[itemPos]); ((BitmapDrawable) i.getDrawable()).setAntiAlias(true);
}
catch (OutOfMemoryError e) { Log.e("InfiniteGalleryAdapter", "Out of memory creating imageview. Using empty view.", e);
}
View vi=convertView;
ViewHolder holder;
if(convertView==null){
vi = inflater.inflate(R.layout.gallery_items, null);
holder=new ViewHolder();
holder.text=(TextView)vi.findViewById(R.id.textView1);
holder.image=(ImageView)vi.findViewById(R.id.image);
vi.setTag(holder);
}
else holder=(ViewHolder)vi.getTag();
holder.text.setText(name[itemPos]);
final int stub_id=images[itemPos];
holder.image.setImageResource(stub_id);
return vi;
}
private ImageView getImageView() {
ImageView i = new ImageView(mContext);
return i;
}
}
@SuppressWarnings("deprecation")
class InfiniteGallery extends Gallery {
public InfiniteGallery(Context context) {
super(context);
init();
}
public InfiniteGallery(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public InfiniteGallery(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
private void init(){
// These are just to make it look pretty
setSpacing(25);
setHorizontalFadingEdgeEnabled(false);
}
}
main.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"
android:background="#FFDAB9">
<com.test.demo.InfiniteGallery
android:id="@+id/galleryOne"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
UPDATE:
as per Yoann Hercouet answer i replace this code :
private ImageView getImageView() {
ImageView i = new ImageView(mContext);
return i;
}
}
with the following below code :
private GestureImageView getImageView() {
GestureImageView i = new GestureImageView(mContext);
return i;
}
}
also adjust the getview , so finally my class will be as below :
@SuppressWarnings("deprecation")
public class DayGallery extends Activity {
TextView tv;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);
Boolean customTitleSupported = requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
setContentView(R.layout.main);
if (customTitleSupported) {
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,R.layout.custom_title);
tv = (TextView) findViewById(R.id.title_tv1);
tv.setTypeface(FontFactory.getBFantezy(getBaseContext()));
}
InfiniteGallery galleryOne = (InfiniteGallery) findViewById(R.id.galleryOne);
galleryOne.setAdapter(initializeImages());
galleryOne.setSelection(galleryOne.getCount()/2);
}
private InfiniteGalleryAdapter initializeImages() {
InfiniteGalleryAdapter galleryAdapter = null;
String day = getIntent().getStringExtra("dayname");
if(day.equalsIgnoreCase("Day1")){
int[] tempimages = { R.drawable.day_one_1, R.drawable.day_one_2,R.drawable.day_one_3,
R.drawable.day_one_4, R.drawable.day_one_5,R.drawable.day_one_6,R.drawable.day_one_7,
R.drawable.day_one_8, R.drawable.day_one_9,R.drawable.day_one_10,R.drawable.day_one_11,
R.drawable.day_one_12
};
String[] name = { "00:35","00:35","00:35","1:07","2:00","2:01","2:09",
"2:12","2:15","6:13","6:13","6:13"
};
tv.setText("Day one pictures");
galleryAdapter=new InfiniteGalleryAdapter(this, tempimages, name);
}
else if(day.equalsIgnoreCase("Day2")){
int[] tempimages = { R.drawable.day_two_1, R.drawable.day_two_2,R.drawable.day_two_3,
R.drawable.day_two_4, R.drawable.day_two_5,R.drawable.day_two_6,R.drawable.day_two_7,
R.drawable.day_two_8, R.drawable.day_two_9,R.drawable.day_two_10,R.drawable.day_two_11,
R.drawable.day_two_12
};
String[] name = { "12:04","12:04", "12:04","12:05","12:06", "12:07",
"12:07","12:07","12:08","12:10","12:10","12:10"
};
tv.setText("Day two pictures");
galleryAdapter=new InfiniteGalleryAdapter(this, tempimages, name);
}
// AND THE SAME FOR REST OF DAYS TILL Day10//
return galleryAdapter;
}
}
class InfiniteGalleryAdapter extends BaseAdapter {
private Context mContext;
private int[] images;
private String[] name;
public InfiniteGalleryAdapter(Context c, int[] imageIds,String[] names) {
this.mContext = c;
images = imageIds;
name=names;
inflater = (LayoutInflater)mContext.getSystemService ( Context.LAYOUT_INFLATER_SERVICE);
}
public int getCount() {
return Integer.MAX_VALUE;
}
public Object getItem(int position) {
return position;
}
public long getItemId(int position) {
return position;
}
private LayoutInflater inflater=null;
public class ViewHolder{
public TextView text;
public ImageView image;
}
public View getView(int position, View convertView, ViewGroup parent) {
GestureImageView i = getImageView();
int itemPos = (position % images.length);
LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);//addition
try {
i.setImageResource(images[itemPos]);
((BitmapDrawable) i.getDrawable()).setAntiAlias(true);
i.setLayoutParams(params); //addition
}
catch (OutOfMemoryError e) {
Log.e("InfiniteGalleryAdapter", "Out of memory creating imageview. Using empty view.", e);
}
View vi=convertView;
ViewHolder holder;
if(convertView==null){
vi = inflater.inflate(R.layout.gallery_items, null);
holder=new ViewHolder();
holder.text=(TextView)vi.findViewById(R.id.textView1);
holder.image=(ImageView)vi.findViewById(R.id.image);
vi.setTag(holder);
}
else holder=(ViewHolder)vi.getTag();
holder.text.setText(name[itemPos]);
final int stub_id=images[itemPos];
holder.image.setImageResource(stub_id);
return vi;
}
private GestureImageView getImageView() {
GestureImageView i = new GestureImageView(mContext);
return i;
}
@SuppressWarnings("deprecation")
class InfiniteGallery extends Gallery {
public InfiniteGallery(Context context) {
super(context);
init();
}
public InfiniteGallery(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public InfiniteGallery(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
private void init(){
// These are just to make it look pretty
setSpacing(25);
setHorizontalFadingEdgeEnabled(false);
}
}
}
AND if i use my modified class with my original main.xmla below :
<?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"
android:background="#FFDAB9">
<com.test.demo.InfiniteGallery
android:id="@+id/galleryOne"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
it gave force clos with the below logcat:
java.lang.RuntimeException: Unable to start activity ComponentInfo{com.test.demo/com.ttest.demo.DayGallery}: android.view.InflateException: Binary XML file line #7: Error inflating class com.test.demo.InfiniteGallery
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:1651)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:1667)
at android.app.ActivityThread.access$1500(ActivityThread.java:117)
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:935)
at android.os.Handler.dispatchMessage(Handler.java:99)
at android.os.Looper.loop(Looper.java:130)
at android.app.ActivityThread.main(ActivityThread.java:3687)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:507)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:867)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:625)
at dalvik.system.NativeStart.main(Native Method)
Caused by: android.view.InflateException: Binary XML file line #7: Error inflating class com.tsn.dr.InfiniteGallery
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:581)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:623)
at android.view.LayoutInflater.inflate(LayoutInflater.java:408)
at android.view.LayoutInflater.inflate(LayoutInflater.java:320)
at android.view.LayoutInflater.inflate(LayoutInflater.java:276)
at com.android.internal.policy.impl.PhoneWindow.setContentView(PhoneWindow.java:216)
at android.app.Activity.setContentView(Activity.java:1660)
at com.test.demo.DayGallery.onCreate(DayGallery.java:35)
at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1047)
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:1615)
... 11 more
Caused by: java.lang.ClassNotFoundException: com.test.demo.InfiniteGallery in loader dalvik.system.PathClassLoader[/data/app/com.test.demo-1.apk]
at dalvik.system.PathClassLoader.findClass(PathClassLoader.java:240)
at java.lang.ClassLoader.loadClass(ClassLoader.java:551)
at java.lang.ClassLoader.loadClass(ClassLoader.java:511)
at android.view.LayoutInflater.createView(LayoutInflater.java:471)
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:570)
... 20 more
AND if i use the modified class with my modified main.xml as below :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:gesture-image="http://schemas.polites.com/android"
android:id="@+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#FFDAB9">
<com.test.demo.InfiniteGallery
android:id="@+id/galleryOne"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.polites.android.GestureImageView
android:id="@+id/image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
gesture-image:min-scale="0.75"
gesture-image:max-scale="10.0"
/>
it gave also force close with the below logcat:
java.lang.RuntimeException: Unable to start activity ComponentInfo{com.test.demo/com.test.demo.DayGallery}: android.view.InflateException: Binary XML file line #9: Error inflating class com.test.demo.InfiniteGallery
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:1651)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:1667)
at android.app.ActivityThread.access$1500(ActivityThread.java:117)
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:935)
at android.os.Handler.dispatchMessage(Handler.java:99)
at android.os.Looper.loop(Looper.java:130)
at android.app.ActivityThread.main(ActivityThread.java:3687)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:507)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:867)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:625)
at dalvik.system.NativeStart.main(Native Method)
Caused by: android.view.InflateException: Binary XML file line #9: Error inflating class com.test.demo.InfiniteGallery
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:581)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:623)
at android.view.LayoutInflater.inflate(LayoutInflater.java:408)
at android.view.LayoutInflater.inflate(LayoutInflater.java:320)
at android.view.LayoutInflater.inflate(LayoutInflater.java:276)
at com.android.internal.policy.impl.PhoneWindow.setContentView(PhoneWindow.java:216)
at android.app.Activity.setContentView(Activity.java:1660)
at com.test.demo.DayGallery.onCreate(DayGallery.java:35)
at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1047)
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:1615)
... 11 more
Caused by: java.lang.ClassNotFoundException: com.tsn.dr.InfiniteGallery in loader dalvik.system.PathClassLoader[/data/app/com.tsn.dr-1.apk]
at dalvik.system.PathClassLoader.findClass(PathClassLoader.java:240)
at java.lang.ClassLoader.loadClass(ClassLoader.java:551)
at java.lang.ClassLoader.loadClass(ClassLoader.java:511)
at android.view.LayoutInflater.createView(LayoutInflater.java:471)
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:570)
... 20 more
UPDATE 2
You can use my Pinch to zoom Gallery project. You can choose any image from gallery and then in
onDoubleTap(MotionEvent e)
open full image and zoom it. You should use two widget classesPinchZoomGallery
,TouchImageView
and activity classPinchZoomActivity
or add gallery functionality into your activity class.I think your
ClassNotFoundException
is due to the android runtime trying to instantiate acom.tsn.dr.InfiniteGallery
, which you specified in your activity:But the InfiniteGallery class is private, and inside DayGallery:
Make it public and fix the package path in the .xml to match it's actual namespace. (sorry for the c# terminology, haven't done android work in a few months)
you can use custom imagGallery control.. check this https://github.com/kilaka/ImageViewZoom you can swipe images as gallery view and able to do a pinch zoom. in this example you have a adapter class.. check it out.
I'm using PhotoView in my projects. It is similar to the GestureImageView you're trying now.
Here is an example of PhotoView's usage:
In your Java code, you could use it as if it is a simple ImageView. Here is my code (I've used the UrlImageViewHelper to load images asynchronously):
You have an error in your code in the public View getView(int position, View convertView, ViewGroup parent) method. You create a GestureImageView at line 96, but you don't use it after that. Instead you are inflating the contents of gallery_items.xml and return them. I guess gallery_items.xml contains just an image with a text label, so here is an example which should work fine:
Then you could simplify your getView method to something like that:
If you have troubles running the code, I could assemble a simple gallery project for you. :)
I use the following library on my apps: https://github.com/jasonpolites/gesture-imageview
This library offers what you are asking (double tap and pinch zoom) along with other features.
You can setup programmatically the image doing this:
Then you just need to add the view in your layout, in your case the idea would be to provide these views to your
InfiniteGalleryAdapter
but I did not find much information about this library.This class is pretty easy to setup, just integrate it in your project and follow the example in the link.
EDIT:
The changes must be done in your
InfiniteGalleryAdapter
, I think you can give it a try by changing yourgetImageView
function this way:You might also need to modify the
try
part of your adapter to add the layout parameters:For the XML, there is an example in the website where the library is from. In our case the GestureImageView is added programmatically, so it seems you just need to modify a little the XML file by adding the line
xmlns:gesture-image="http://schemas.polites.com/android"
:EDIT2:
Here is what you can try to block the scroll from "burning" the event, replace the original
onTouch
function from theGestureImageViewTouchListener
class by the one below, I just added a check on the motion action: