双卡和双指缩放无限画廊图像 [英] Infinite gallery images with double tab and Pinch Zoom

查看:211
本文介绍了双卡和双指缩放无限画廊图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的应用程序,它的活动之一是与存储在水库绘制文件夹的图像无限的厨房,

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 ,

任何意见将AP preciated。

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>

更新:

根据约恩·Hercouet答案我更换此code:

as per Yoann Hercouet answer i replace this code :

 private ImageView getImageView() { 
  ImageView i = new ImageView(mContext); 
  return i; 
 } 
 }

低于code以下内容:

with the following below code :

 private GestureImageView getImageView() {   
  GestureImageView i = new GestureImageView(mContext); 
   return i; 
  } 
  }

也调整getview,所以最后我的类将是如下:

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); 
}
}   
}

如果我用我修改的类与我原来以下main.xmla:

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>

这给了力CLOS与下面的logcat:

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

如果我使用修改过的类,如下修改我的main.xml:

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"
 />

这给了还强制关闭与下面的logcat:

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

更新2

推荐答案

我用我的应用程序下面的库:
https://github.com/jasonpolites/gesture-imageview

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:

GestureImageView view = new GestureImageView(this);
view.setImageResource(R.drawable.image);
view.setAdjustViewBounds(true);
view.setLayoutParams(params);

然后你只需要添加视图布局,你的情况的想法是提供这些意见,以你的 InfiniteGalleryAdapter ,但我没有找到多少信息这个库。

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.

本类是pretty易于安装,只需将其整合在您的项目,然后按照链接的例子。

This class is pretty easy to setup, just integrate it in your project and follow the example in the link.

修改

的变化必须完成你的 InfiniteGalleryAdapter ,我想你可以通过改变试试看你的 getImageView 函数是这样的:

The changes must be done in your InfiniteGalleryAdapter, I think you can give it a try by changing your getImageView function this way:

private GestureImageView getImageView() {   
    GestureImageView i = new GestureImageView(mContext); 

    return i; 
} 

您可能还需要修改试试你的适配器添加布局参数部分:

You might also need to modify the try part of your adapter to add the layout parameters:

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); 
} 

有关的XML中,有一个在网站,该库是从一个例子。在我们的例子中GestureImageView的编程方式添加,这样看来你只需要通过添加行的xmlns修改一点点XML文件:手势图像=htt​​p://schemas.polites.com/android

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":

<?xml version="1.0" encoding="utf-8" ?> 
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:gesture-image="http://schemas.polites.com/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>

EDIT2

下面是你可以尝试从燃烧事件阻挡滚动,取代从原来的 onTouch 功能 GestureImageViewTouchListener 由下一级,我只是说对议案采取行动的检查:

Here is what you can try to block the scroll from "burning" the event, replace the original onTouch function from the GestureImageViewTouchListener class by the one below, I just added a check on the motion action:

@Override
    public boolean onTouch(View v, MotionEvent event) {

        if(event.getAction() != MotionEvent.ACTION_SCROLL){
            if(!inZoom) {

                if(!tapDetector.onTouchEvent(event)) {
                    if(event.getPointerCount() == 1 && flingDetector.onTouchEvent(event)) {
                        startFling();
                    }

                    if(event.getAction() == MotionEvent.ACTION_UP) {
                        handleUp();
                    }
                    else if(event.getAction() == MotionEvent.ACTION_DOWN) {
                        stopAnimations();

                        last.x = event.getX();
                        last.y = event.getY();

                        if(imageListener != null) {
                            imageListener.onTouch(last.x, last.y);
                        }

                        touched = true;
                    }
                    else if(event.getAction() == MotionEvent.ACTION_MOVE) {
                        if(event.getPointerCount() > 1) {
                            multiTouch = true;
                            if(initialDistance > 0) {

                                pinchVector.set(event);
                                pinchVector.calculateLength();

                                float distance = pinchVector.length;

                                if(initialDistance != distance) {

                                    float newScale = (distance / initialDistance) * lastScale;

                                    if(newScale <= maxScale) {
                                        scaleVector.length *= newScale;

                                        scaleVector.calculateEndPoint();

                                        scaleVector.length /= newScale;

                                        float newX = scaleVector.end.x;
                                        float newY = scaleVector.end.y;

                                        handleScale(newScale, newX, newY);
                                    }
                                }
                            }
                            else {
                                initialDistance = MathUtils.distance(event);

                                MathUtils.midpoint(event, midpoint);

                                scaleVector.setStart(midpoint);
                                scaleVector.setEnd(next);

                                scaleVector.calculateLength();
                                scaleVector.calculateAngle();

                                scaleVector.length /= lastScale;
                            }
                        }
                        else {
                            if(!touched) {
                                touched = true;
                                last.x = event.getX();
                                last.y = event.getY();
                                next.x = image.getImageX();
                                next.y = image.getImageY();
                            }
                            else if(!multiTouch) {
                                if(handleDrag(event.getX(), event.getY())) {
                                    image.redraw();
                                }
                            }
                        }
                    }
                }           
            }
            return true;
        } 
        else {
            return false;
        }
    }

这篇关于双卡和双指缩放无限画廊图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆