Android: ImageView not showing with UIL and TouchImageView

Question

I am trying to implement loading images with URL using Universal Image Loader and zoom using TouchImageView Mike Ortiz . But when you try to view the image, a black screen is displayed . I have verified that the urls are correct. I if I see a TextView there ...

What am I doing wrong?

ImagePagerActivity.java

 public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); this.requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.activity_fullscreen_view); Bundle bundle = getIntent().getExtras(); assert bundle != null; String[] imageUrls = bundle.getStringArray("urls"); int pagerPosition = bundle.getInt("pos", 0); tipo = bundle.getString("tipo"); monumento = bundle.getString("monumento"); num = bundle.getInt("num"); for(int i = 0; i < imageUrls.length; i++) { // URLS with data Toast.makeText(this, "URL = " + imageUrls[i], 0).show(); } if (savedInstanceState != null) { pagerPosition = savedInstanceState.getInt(STATE_POSITION); } options = new DisplayImageOptions.Builder() .showImageForEmptyUri(R.drawable.imagen) .showImageOnFail(R.drawable.imagen) .resetViewBeforeLoading(true) .cacheOnDisc(true) .imageScaleType(ImageScaleType.EXACTLY) .bitmapConfig(Bitmap.Config.RGB_565) .considerExifParams(true) .displayer(new FadeInBitmapDisplayer(300)) .build(); pager = (ExtendedViewPager) findViewById(R.id.pager); pager.setAdapter(new ImagePagerAdapter(imageUrls)); pager.setCurrentItem(pagerPosition); } @Override public void onSaveInstanceState(Bundle outState) { outState.putInt(STATE_POSITION, pager.getCurrentItem()); } private class ImagePagerAdapter extends PagerAdapter { private String[] images; private LayoutInflater inflater; ImagePagerAdapter(String[] images) { this.images = images; inflater = getLayoutInflater(); } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView((View) object); } @Override public int getCount() { return images.length; } @Override public Object instantiateItem(ViewGroup view, int position) { final View imageLayout = inflater.inflate(R.layout.ampliar_imagen, view, false); assert imageLayout != null; imageView = (TouchImageView) imageLayout.findViewById(R.id.imagenFullScreen); infoImagen = (LinearLayout)imageLayout.findViewById(R.id.textoInfoImagen); info = (TextView) imageLayout.findViewById(R.id.textoInfoImagenDesc); cargarInfo(position, images); android.graphics.PorterDuff.Mode.MULTIPLY); imageView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { LinearLayout infoImagen = (LinearLayout)imageLayout.findViewById(R.id.textoInfoImagen); if(infoImagen.getVisibility() == View.GONE) { infoImagen.setVisibility(View.VISIBLE); } else { infoImagen.setVisibility(View.GONE); } } }); imageLoader.displayImage(images[position], imageView, options, new SimpleImageLoadingListener() { @Override public void onLoadingStarted(String imageUri, View view) { spinner.setVisibility(View.VISIBLE); } @Override public void onLoadingFailed(String imageUri, View view, FailReason failReason) { spinner.setVisibility(View.GONE); } @Override public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) { spinner.setVisibility(View.GONE); } }); view.addView(imageLayout, 0); return imageLayout; } @Override public boolean isViewFromObject(View view, Object object) { return view.equals(object); } @Override public void restoreState(Parcelable state, ClassLoader loader) { } @Override public Parcelable saveState() { return null; } } private void cargarInfo(int position, String[] images) { if(tipo.equals("fotos")) { info.setText((position + 1) + " de " + images.length + "\n" + InfoImagenes.devolverInfoFotos(monumento, position, num, ImagePagerActivity.this)); } else if(tipo.equals("planos")) { info.setText((position + 1) + " de " + images.length + "\n" + InfoImagenes.devolverInfoPlanos(position, num, ImagePagerActivity.this)); } } 

activity_full_screen.xml

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <imagenes.ExtendedViewPager android:id="@+id/pager" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </LinearLayout> 

ampliar_imagen.xml

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/negro" > <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent" > <imagenes.TouchImageView android:id="@+id/imagenFullScreen" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center" android:adjustViewBounds="true" /> <ProgressBar android:id="@+id/cargandoFoto" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:visibility="gone" /> </FrameLayout> <LinearLayout android:id="@+id/textoInfoImagen" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:background="@color/grisTransparente" android:orientation="horizontal" android:visibility="visible" > <TextView android:id="@+id/textoInfoImagenDesc" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center_horizontal" android:paddingBottom="3dp" android:paddingTop="3dp" android:textColor="@color/blanco" android:textSize="13sp" /> </LinearLayout> </RelativeLayout> 

EDIT

If I change TouchImageView to ImageView, it will display the image

Answer 1

I also encountered this problem, I found that it is related to the visibility of the ProgressBar , and the following code can be used to solve it.

• In onLoadingStarted() add view.setVisibility(View.GONE)
• In onLoadingComplete() add view.setVisibility(View.VISIBLE)

the code:

 imageLoader.displayImage(imageUri.toString(), mPictureView, options, new SimpleImageLoadingListener() { @Override public void onLoadingStarted(String imageUri, View view) { spinner.setVisibility(View.VISIBLE); view.setVisibility(View.GONE); } @Override public void onLoadingFailed(String imageUri, View view, FailReason failReason) { spinner.setVisibility(View.GONE); } @Override public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) { spinner.setVisibility(View.GONE); view.setVisibility(View.VISIBLE); } }); 

Answer 2

I had the same problem. I temporarily solved the problem by resetting the scale.

 touchImage.setZoom(1); 

inside onLoadComplete ()

Of course, touchImage is your TouchImageView object.

Answer 3

if an async bitmap image is given, I found that the matrix is ​​{0,0,0} {0,0,0} {0,0,1}, so the image cannot be shown .. when the imageView that has zero, measure for the first time, TouchImageView.viewWidth and TouchImageView.viewHeight is 0. but when you set the TouchImageView.viewHeight using a bitmap! null, image cannot be measured again. TouchImageView.viewWidth is 0 at this time. Below is the code.

  @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { Drawable drawable = getDrawable(); if (drawable == null || drawable.getIntrinsicWidth() == 0 || drawable.getIntrinsicHeight() == 0) { setMeasuredDimension(0, 0); return; } int drawableWidth = drawable.getIntrinsicWidth(); int drawableHeight = drawable.getIntrinsicHeight(); int widthSize = MeasureSpec.getSize(widthMeasureSpec); int widthMode = MeasureSpec.getMode(widthMeasureSpec); int heightSize = MeasureSpec.getSize(heightMeasureSpec); int heightMode = MeasureSpec.getMode(heightMeasureSpec); viewWidth = setViewSize(widthMode, widthSize, drawableWidth); viewHeight = setViewSize(heightMode, heightSize, drawableHeight); // // Set view dimensions // setMeasuredDimension(viewWidth, viewHeight); // // Fit content within view // fitImageToView(); } 

if you are loading an image from url or loading an image from local, but using async mode by stream, you can change TouchImageView.OnMeasure as follows.

 @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { Drawable drawable = getDrawable(); // if (drawable == null || drawable.getIntrinsicWidth() == 0 || drawable.getIntrinsicHeight() == 0) { //// setMeasuredDimension(0, 0); // // super.onMeasure(widthMeasureSpec, heightMeasureSpec); // return; // } int drawableWidth = drawable == null ? 0 : drawable.getIntrinsicWidth(); int drawableHeight = drawable == null ? 0 : drawable.getIntrinsicHeight(); int widthSize = MeasureSpec.getSize(widthMeasureSpec); int widthMode = MeasureSpec.getMode(widthMeasureSpec); int heightSize = MeasureSpec.getSize(heightMeasureSpec); int heightMode = MeasureSpec.getMode(heightMeasureSpec); viewWidth = setViewSize(widthMode, widthSize, drawableWidth); viewHeight = setViewSize(heightMode, heightSize, drawableHeight); // // Set view dimensions // setMeasuredDimension(viewWidth, viewHeight); // // Fit content within view // fitImageToView(); } 

Answer 4

You can edit it, it starts in tab2, but the other device does not work, I don’t know why

 private void sharedConstructing(Context context) { super.setClickable(true); this.context = context; ScaleListener scaleListner = new ScaleListener(); //Added mScaleDetector = new ScaleGestureDetector(context, scaleListner); //Edited mGestureDetector = new GestureDetector(context, new GestureListener()); matrix = new Matrix(); prevMatrix = new Matrix(); m = new float[9]; normalizedScale = 1; if (mScaleType == null) { mScaleType = ScaleType.FIT_CENTER; } minScale = 1; maxScale = 3; superMinScale = SUPER_MIN_MULTIPLIER * minScale; superMaxScale = SUPER_MAX_MULTIPLIER * maxScale; setImageMatrix(matrix); setScaleType(ScaleType.MATRIX); setState(State.NONE); onDrawReady = false; scaleListner.onScale(mScaleDetector);//Added super.setOnTouchListener(new PrivateOnTouchListener()); } 

or you change it, it will help you show the image, good luck.

 ImageLoader.getInstance().displayImage(urlDownload, mImageView, new ImageLoadingListener() { @Override public void onLoadingStarted(String imageUri, View view) { // TODO Auto-generated method stub } @Override public void onLoadingFailed(String imageUri, View view, FailReason failReason) { // TODO Auto-generated method stub } @Override public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) { // TODO Auto-generated method stub Log.v(TAG, "Bitmap What "+loadedImage.getWidth()+ " "+loadedImage.getHeight()); } @Override public void onLoadingCancelled(String imageUri, View view) { // TODO Auto-generated method stub } }); 

Answer 5

The same problem I encountered. I solved the problem by setting the scale to 0.99f as follows: imageView.setZoom (0.99f);

where imageView is a reference to TouchImageView. I ran into this problem in ImageLoader, so I just put the above line in the onLoadingComplete method. You can also put the same line before loading the URL of a glide or ImageLoader image, but it's better to put it after a full load . Enjoy :)