Screen resolution with images issue

Question

I've been working on an app for a little while now that creates a tile puzzle. I'm to the point where I'm testing for various size and density screens. Using Krita I scaled the tile images down to 110 X 110 pixels for use in the mdpi format. Strangely this size worked just fine in the xhdpi emulator I've been using to test thus far, but the mdpi emulator I created shrinks the images significantly. While I could just create larger images for the smaller screen densities it defies what I understand about how android handles densities from the documentation. Shouldn't those images have been blown up on lower resolutions? Here is the Grid Layout portion of the layout file:

    <GridLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:columnCount="3"
    android:rowCount="3"
    android:id="@+id/TheGrid"
    android:layout_centerInParent="true"
    android:background="@color/background_floating_material_light"
    android:animateLayoutChanges="true"
    android:layout_toRightOf="@+id/title_inflater"
    android:layout_toLeftOf="@+id/picture_inflator"
    >

    <ImageView
        android:id="@+id/TopLeft"
        android:clickable="true"
        android:layout_column="0"
        android:layout_row="0"
        android:layout_gravity="fill"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />
    <ImageView
        android:id="@+id/TopCenter"
        android:clickable="true"
        android:layout_gravity="fill"
        android:layout_row="0"
        android:layout_column="1"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />
    <ImageView
        android:id="@+id/TopRight"
        android:clickable="true"
        android:layout_gravity="fill"
        android:layout_row="0"
        android:layout_column="2"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />


    <ImageView
        android:id="@+id/CenterLeft"
        android:clickable="true"
        android:layout_gravity="fill"
        android:layout_row="1"
        android:layout_column="0"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />

    <ImageView
        android:id="@+id/CenterCenter"
        android:clickable="true"
        android:layout_gravity="fill"
        android:layout_row="1"
        android:layout_column="1"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />
    <ImageView
        android:id="@+id/CenterRight"
        android:clickable="true"
        android:layout_gravity="fill"
        android:layout_row="1"
        android:layout_column="2"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />

    <ImageView
        android:id="@+id/BottomLeft"
        android:clickable="true"
        android:layout_gravity="fill"
        android:layout_row="2"
        android:layout_column="0"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />
    <ImageView
        android:id="@+id/BottomCenter"
        android:clickable="true"
        android:layout_gravity="fill"
        android:layout_row="2"
        android:layout_column="1"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />
    <ImageView
        android:id="@+id/BottomRight"
        android:clickable="true"
        android:layout_gravity="fill"
        android:layout_row="2"
        android:layout_column="2"
        android:src="@drawable/star_trek_federation_emblem_9pc_1"
        />

    <ImageView
        android:id="@+id/mover"
        android:layout_row="2"
        android:layout_column="2"
        android:visibility="invisible"
        android:layout_gravity="fill"
        />
</GridLayout>

This is how it looks in the previewer (which is how it looks on an xhdpi screen):

yet in an mdpi screen it looks like:

I'd like to know why this is happening before i just blindly adjust images, but after most of a day of creating various emulators and searching the web I'm stuck. Any help would be most appreciated.

Aditay Kaushal · Answer 1 · 2015-12-24T08:03:57.053

1) First Way you can create all size of images from this link https://romannurik.github.io/AndroidAssetStudio/ just upload image to this site and you will get all sizes images for all drawable.it may help you to adjust in all sizes.

or if you not like from first way you can use

this Second Way To create an icon for different densities, you should follow the 2:3:4:6 scaling ratio between the four primary densities (medium, high, x-high, and xx-high, respectively).

For example, consider that the size for a launcher icon is specified to be 48x48 dp.

This means the baseline (MDPI) asset is 48x48 px,

and the high density (HDPI) asset should be 1.5x the baseline at 72x72 px,

and the x-high density (XHDPI) asset should be 2x the baseline at 96x96 px, and so on.

Note: Android also supports low-density (LDPI) screens with asset size 36x36 px, but you normally don't need to create custom assets at this size because Android effectively down-scales your HDPI assets by 1/2 to match the expected size.

Similarly for XXHDPI asset size should be 144x144 px.

Source: developer.android.com

I appreciate the attempt but that's straight from the developer site. It doesn't explain why why an image properly sized for xldpi screens would be _smaller_ on an mdpi screen. My understanding is that a lower resolution screen will spread out larger density images. — Brandon Thompson, Dec 24 '15 at 22:35

Screen resolution with images issue

1 Answers1