Search code examples
androidxmlimageviewpngscale

How to scale an imageview to the right size? (my png images are to small)

A colleague of mine created for me a few pngs to enter inside a main menu. The pngs are suppose to be scaled to the right size like this:

enter image description here

I entered all the pngs in order to fit the hdpi xhdpi etc.,but when I put the "One player game" and "two player game" the images shrink and do not fit the size of the "Exit" button:

enter image description here

I tried all the variations of "android:scaleType" following this question. Also I tried padding (through a diff question that I can't find now). These resolutions did not help me.

I will be happy if you will be able to show me how to scale up these texts that are inside the png.

Here is my xml code:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorBackground"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:layoutDirection="ltr"
    tools:context="com.inbaltako.tictactoe.MenuActivity">


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/logo"
        android:paddingTop="50dp"
        android:id="@+id/imageView"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:id="@+id/relativeLayout">

    </RelativeLayout>

    <ImageButton
        android:id="@+id/exitBtn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/exit_btn"
        android:background="@color/colorPrimary"
        android:padding="16dp"
        android:onClick="btnClicked"
        android:layout_marginTop="2dp"
        android:layout_below="@+id/two_player_game"
        android:layout_toStartOf="@+id/relativeLayout" />

    <ImageButton
        android:id="@+id/one_player_game"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/one_player_game"
        android:background="@color/colorPrimary"
        android:onClick="btnClicked"
        android:padding="16dp"
        android:layout_below="@+id/relativeLayout"
        android:layout_alignStart="@+id/two_player_game" />

    <ImageButton
        android:id="@+id/two_player_game"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="fitXY"
        android:src="@drawable/two_players_game"
        android:background="@color/colorPrimary"
        android:onClick="btnClicked"
        android:padding="16dp"
        android:layout_below="@+id/relativeLayout"
        android:layout_alignStart="@+id/exitBtn"
        android:layout_marginTop="39dp" />


</RelativeLayout>
Solution

  • It's hard to know if you put your drawables I the right places. But if it's just text, why aren't you using TextView? Should be much easier. Dealing with images just for text isn't the right thing to do.