Loading image from the internet inside a fragment with Universal Image Loader

Question

I am having troubles to get image from custom url in a fragment using the universal image loader library, here is the code I'm using: I have no idea why it is not working as it is supposed to work. Any help of advice would be strongly appreciated !

Best Regards,

public class Fragment2 extends Fragment {

public Fragment2(){}

String[] imageUrls;
AbsListViewBaseActivity aa = new AbsListViewBaseActivity();

DisplayImageOptions options;

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
       Bundle savedInstanceState) {

    View rootView = inflater.inflate(R.layout.fragment2, container, false);

    Bundle bundle = getActivity().getIntent().getExtras();
    imageUrls = bundle.getStringArray(Extra.IMAGES);

    options = new DisplayImageOptions.Builder()
        .showImageOnLoading(R.drawable.ic_stub)
        .showImageForEmptyUri(R.drawable.ic_empty)
        .showImageOnFail(R.drawable.ic_error)
        .cacheInMemory(true)
        .cacheOnDisc(true)
        .considerExifParams(true)
        .bitmapConfig(Bitmap.Config.RGB_565)
        .build();

    aa.listView = (GridView) rootView.findViewById(R.id.gridview);
    ((GridView) aa.listView).setAdapter(new ImageAdapter());
    aa.listView.setOnItemClickListener(new OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            startImagePagerActivity(position);
        }

    });
    return rootView;
}

private void startImagePagerActivity(int position) {
    Intent intent = new Intent(getActivity(), ImagePagerActivity.class);
    intent.putExtra(Extra.IMAGES, imageUrls);
    intent.putExtra(Extra.IMAGE_POSITION, position);
    startActivity(intent);
}

public class ImageAdapter extends BaseAdapter {
    @Override
    public int getCount() {
        return imageUrls.length;
    }

    @Override
    public Object getItem(int position) {
        return null;
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        final ViewHolder holder;
        View view = convertView;
        if (view == null) {
            view = getActivity().getLayoutInflater().inflate(R.layout.item_grid_image, parent, false);
            holder = new ViewHolder();
            assert view != null;
            holder.imageView = (ImageView) view.findViewById(R.id.image);
            holder.progressBar = (ProgressBar) view.findViewById(R.id.progress);
            view.setTag(holder);
        } else {
            holder = (ViewHolder) view.getTag();
        }

        aa.imageLoader.displayImage(imageUrls[position], holder.imageView, options, new SimpleImageLoadingListener() {
                                     @Override
                                     public void onLoadingStarted(String imageUri, View view) {
                                         holder.progressBar.setProgress(0);
                                         holder.progressBar.setVisibility(View.VISIBLE);
                                     }

                                     @Override
                                     public void onLoadingFailed(String imageUri, View view,
                                             FailReason failReason) {
                                         holder.progressBar.setVisibility(View.GONE);
                                     }

                                     @Override
                                     public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) {
                                         holder.progressBar.setVisibility(View.GONE);
                                     }
                                 }, new ImageLoadingProgressListener() {
                                     @Override
                                     public void onProgressUpdate(String imageUri, View view, int current,
                                             int total) {
                                         holder.progressBar.setProgress(Math.round(100.0f * current / total));
                                     }
                                 }
        );

        return view;
    }

    class ViewHolder {
        ImageView imageView;
        ProgressBar progressBar;
    }

}

}

Code of the layout:

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:horizontalSpacing="4dip"
android:numColumns="3"
android:stretchMode="columnWidth"
android:verticalSpacing="4dip"
android:padding="4dip" />

and manifest file:

<uses-permission android:name="android.permission.INTERNET"/>
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.SET_DEBUG_APP"></uses-permission>

<application
    android:name="MyApplication"
    android:allowBackup="true"
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:theme="@style/AppTheme" >
    <activity
        android:name="com.example.loadimage.SplashScreen"
        android:label="@string/app_name" >
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
       <activity
        android:name="zeal.kingdom.koreamania.Fragment1"
        android:label="@string/app_name"  >
    </activity>
<activity
        android:name="com.example.loadimage.Fragment2"
        android:label="@string/app_name"  >
    </activity>
     <activity
        android:name="com.example.loadimage.Fragment3"
        android:label="@string/app_name"  >
    </activity>
    <activity
        android:name="com.example.loadimage.Fragment4"
        android:label="@string/app_name"  >
    </activity>
             <activity
        android:name="com.example.loadimage.Fragment5"
        android:label="@string/app_name"  >
    </activity>
     <activity
        android:name="com.example.loadimage.Fragment6"
        android:label="@string/app_name"       
android:configChanges="locale|orientation|keyboardHidden"
 android:noHistory="true" >
    </activity>

             <activity
        android:name="com.example.loadimage.Fragment7"
        android:label="@string/app_name"  >
    </activity>


    <activity
        android:name="com.example.loadimage.MainActivity"
        android:label="@string/app_name"  >
    </activity>

</application>

log cat:

Thread [<1> main] (Suspended (exception NullPointerException))  
<VM does not provide monitor information>   
Fragment2.onCreateView(LayoutInflater, ViewGroup, Bundle) line: 42  
Fragment2(Fragment).performCreateView(LayoutInflater, ViewGroup, Bundle) line: 1700 
FragmentManagerImpl.moveToState(Fragment, int, int, int, boolean) line: 890 
FragmentManagerImpl.moveToState(int, int, int, boolean) line: 1062  
BackStackRecord.run() line: 684 
FragmentManagerImpl.execPendingActions() line: 1447 
FragmentManagerImpl$1.run() line: 443   
Handler.handleCallback(Message) line: 733   
Handler.dispatchMessage(Message) line: 95   
Looper.loop() line: 136 
ActivityThread.main(String[]) line: 5017    
Method.invokeNative(Object, Object[], Class, Class[], Class, int, boolean) line: not available [native method]  
Method.invoke(Object, Object...) line: 515  
ZygoteInit$MethodAndArgsCaller.run() line: 779  
ZygoteInit.main(String[]) line: 595 
NativeStart.main(String[]) line: not available [native method]  

42: imageUrls = bundle.getStringArray(Extra.IMAGES);
1700: return onCreateView(inflater, container, savedInstanceState);
890: f.mView = f.performCreateView(f.getLayoutInflater(
moveToState(f, newState, transit, transitStyle, false);

Answer 1

I added this code in onCreateView

imageLoader = ImageLoader.getInstance();
imageLoader.init(ImageLoaderConfiguration.createDefault(getActivity()));

imageUrls = IMAGES;

and declare

import static com.example........app.Constants.IMAGES;  

Answer 2

Even i was facing same problem. The issue was not with Fragment. Issue was that width and height of the ImageView where i was trying to load image was "wrap_content" and Universal Image Loader will not accept that. So, we need to specify width and height of ImageView like "100dp" or something. Hope it helps :)

Answer 3

ImageLoader imageLoader = ImageLoader.getInstance();
imageLoader.init(ImageLoaderConfiguration.createDefault(getActivity()));

pass imageLoader object to Adapter when required