How to overlay a GridView over an ImageView?

Question

I have an ImageView which contains an image of a Sudoku grid. I am creating a GridView which is containing all the numbers of the Sudoku grid. So it should completely overlay the ImageView. Here is the code:

   <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:layout_above="@+id/textView"
        android:layout_below="@+id/timer">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/imageView"
            android:layout_gravity="center"
            android:src="@drawable/sudoku_grid_2"
            android:scaleType="fitXY"/>

        <GridView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/sudoku_grid"
            android:layout_gravity="center"
            android:numColumns="9"
            android:verticalSpacing="10dp"
            android:horizontalSpacing="5dp"/>


</FrameLayout>

NOTE: The horizontal and vertical spacings been given in terms of dp.

Here is the code for creating GridView:

     public View getView(int position, View convertView, ViewGroup parent) {
            ImageView imageView = new ImageView(context);
            imageView.setImageResource(numbers.get(position));
            imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
            imageView.setLayoutParams(new GridView.LayoutParams(120, 120));
            //Some more lines
            return imageView;
}

The size of each Grid item is also given in terms of dps.

How can I make my app to be supported by screens having different sizes and densities?