Image GridView Inside Fragment

Question

I have just started to develop on the android platform after developing on iOS. I have looked around and I can't seem to figure it out. I am trying to have a grid view appear after a tab in the action bar is selected. The fragment is brought into view by a main activity that controls the tab bar. I think the problem may be something to do with passing context but I'm not sure.

Here is my MainActivity.java. This is where the fragment is initialized and attached to the activity. It works without the code in the fragment.

if (mFragment == null){
            mFragment = Fragment.instantiate(mActivity, mClass.getName());
            ft.add(android.R.id.content,mFragment,mTag);
        } else {
            ft.attach(mFragment);
        }

Here is my PhotosFragment.java This is where I want the grid view to be populated and displayed.

public class PhotosFragment extends Fragment {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        GridView gridview = (GridView) this.getActivity().findViewById(R.id.photogridview);
        gridview.setAdapter(new PhotoImageAdapter(this.getActivity()));
    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
    }   
}

Here is my PhotoImageAdapter.java class. This is where the images are added to the adapter I think.

  public class PhotoImageAdapter extends BaseAdapter {
    private Context mContext;

    public PhotoImageAdapter(Context c) {
        mContext = c;
    }

    public int getCount() {
        return mThumbIds.length;
    }

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

    public long getItemId(int position) {
        return 0;
    }

    public View getView(int position, View convertView, ViewGroup parent) {
        ImageView imageView;
        if (convertView == null) {  // if it's not recycled, initialize some attributes
            imageView = new ImageView(mContext);
            imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            imageView.setPadding(8, 8, 8, 8);
        } else {
            imageView = (ImageView) convertView;
        }

        imageView.setImageResource(mThumbIds[position]);
        return imageView;
    }

    private Integer[] mThumbIds = {
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7
    };
}

And here is my photos_layout which contains the gridview with the id photogridview. photos_layout.xml

 <?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/photogridview"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:columnWidth="90dp"
    android:numColumns="auto_fit"
    android:verticalSpacing="10dp"
    android:horizontalSpacing="10dp"
    android:stretchMode="columnWidth"
    android:gravity="center">
</GridView>

EDIT

Here is the log report when it crashes

    05-29 14:15:43.895: W/dalvikvm(676): threadid=1: thread exiting with uncaught exception (group=0x409c01f8)
05-29 14:15:43.925: E/AndroidRuntime(676): FATAL EXCEPTION: main
05-29 14:15:43.925: E/AndroidRuntime(676): java.lang.NullPointerException
05-29 14:15:43.925: E/AndroidRuntime(676):  at com.corecoders.PhotosFragment.onCreate(PhotosFragment.java:21)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.app.FragmentManagerImpl.moveToState(FragmentManager.java:795)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.app.FragmentManagerImpl.moveToState(FragmentManager.java:1032)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.app.BackStackRecord.run(BackStackRecord.java:622)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:1382)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.app.FragmentManagerImpl$1.run(FragmentManager.java:426)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.os.Handler.handleCallback(Handler.java:605)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.os.Handler.dispatchMessage(Handler.java:92)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.os.Looper.loop(Looper.java:137)
05-29 14:15:43.925: E/AndroidRuntime(676):  at android.app.ActivityThread.main(ActivityThread.java:4424)
05-29 14:15:43.925: E/AndroidRuntime(676):  at java.lang.reflect.Method.invokeNative(Native Method)
05-29 14:15:43.925: E/AndroidRuntime(676):  at java.lang.reflect.Method.invoke(Method.java:511)
05-29 14:15:43.925: E/AndroidRuntime(676):  at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:784)
05-29 14:15:43.925: E/AndroidRuntime(676):  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:551)
05-29 14:15:43.925: E/AndroidRuntime(676):  at dalvik.system.NativeStart.main(Native Method)
05-29 14:15:44.494: I/dalvikvm(676): threadid=3: reacting to signal 3
05-29 14:15:44.514: I/dalvikvm(676): Wrote stack traces to '/data/anr/traces.txt'
05-29 14:20:43.995: I/Process(676): Sending signal. PID: 676 SIG: 9

The application crashes when you click on the tab and the fragment is initialised. The tutorial I am following is the one on the android developers site.

Any help or explanations would be amazing. Like I said, I am new to this so it would be great to have some pointers to help me understand whats going on.

Disco

Answer 1

It turns out a few simple modifications to the original code and it works.

After debugging and setting breakpoints I was able to find that the context in the PhotoImageAdapter was a null pointer and therefore, causing the app to crash. It was the way I was initialising the adapter in my PhotoFragment and also the method I was initialising it in. Below is the code that works correctly for anyone else who is struggling with this.

    @Override
    public View onCreateView (LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.photos_layout,container,false);
        GridView gridView = (GridView) view.findViewById(R.id.photogridview);
        gridView.setAdapter(new MyAdapter(view.getContext())); // uses the view to get the context instead of getActivity().
        return view;
    }

Again this might not be the best or the only of doing it but this way worked for me. (PhotoImageAdapter.java had a name change to MyAdapter.java)

Answer 2

hi chek the code which i just shared, i made the fragment with gridview so hopefully it will helpful for you check this link, there you will find full detail about gridview implementation with fragment for both device and tablet all the best

check this files mainly in my answer it will sure helpful for u MasterFragment,MasterGridActivity,MyAdapter,gridview.xml

How to Show Different Layouts inside Fragments