resizing imagebutton set in layout xml android

Question

New to Android development, in Android Studio, I've created a layout that includes 2-ImageButtons and 1-ImageView, all lined up in a row.

I've made all the ldpi, mdpi, hdpi, xhdpi, xxhdpi images and placed them in their folders.

It all looks good in Android Studio, but when running in the simulator, the images are larger, and extends past the device screen, and is just not the scale that I would like to see.

So I attempted to call out the items by their id's and manually set them relative to the screen size from the MainActivity Java file..

Here is the entire layout xml, I currently have

<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:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
android:id="@+id/mainView" tools:context=".MainActivity">

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/backgroundView"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:background="@mipmap/yellow_background" />

<GridLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:id="@+id/gridLayout">

    <ImageButton
        android:layout_width="35dp"
        android:layout_height="35dp"
        android:id="@+id/menuBtn"
        android:layout_row="0"
        android:layout_column="0"
        android:background="@mipmap/menu_button"
        android:layout_marginTop="65dp"
        android:layout_marginRight="20dp"
        android:layout_marginLeft="30dp" />

    <ImageView
        android:layout_width="200dp"
        android:layout_height="81dp"
        android:id="@+id/logo"
        android:layout_row="0"
        android:layout_column="1"
        android:background="@mipmap/logo_image"
        android:layout_marginTop="20dp"
        android:layout_gravity="center_horizontal" />

    <ImageButton
        android:layout_width="35dp"
        android:layout_height="35dp"
        android:id="@+id/settingsBtn"
        android:layout_row="0"
        android:layout_column="2"
        android:background="@mipmap/settings_button"
        android:layout_marginTop="65dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="30dp" />

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="345dp"
        android:layout_row="1"
        android:layout_column="0"
        android:layout_columnSpan="3"
        android:layout_margin="20dp"
        android:layout_gravity="fill_horizontal|center_horizontal">

        <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="view 1"/>
            <TextView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="view 2"/>
            <TextView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="view 3"/>

        </android.support.v4.view.ViewPager>
    </RelativeLayout>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Rights Reserved"
        android:id="@+id/textView2"
        android:layout_row="2"
        android:layout_column="0"
        android:layout_gravity="center_horizontal"
        android:layout_columnSpan="3" />

</GridLayout>

In the Java file, I am trying to manually resize like this:

    DisplayMetrics metrics = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(metrics);

    int height = metrics.heightPixels;
    int width = metrics.widthPixels;

    double topMenuWidth = 0.1;

    ImageButton menuBtn = (ImageButton)findViewById(R.id.menuBtn);
    menuBtn.setMaxWidth((int)(width * topMenuWidth));

But, this is not working.. Any ideas how I can resize the menuBtn like how I am trying? Or any other ideas to a more automatic way of scaling images for each screen for Android development?

Answer 1

after 7 days of watching plenty of tutorial videos and banging my head against the wall, i finally attained eureka!

I've changed the xml many times, so I will just post the latest that worked for me. But there were 2 key items that helped me get past this.

1. adding "scaleType="fitCenter"" in the XML
2. using "settingLayoutParams" in the Java

In the XML:

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:id="@+id/headerLayout">
    <ImageButton
        android:id="@+id/menuBtn"
        android:contentDescription="@string/menu_button"
        android:src="@mipmap/menu_button"
        android:background="#00000000"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:scaleType="fitCenter" />
</RelativeLayout>

In the Java:

DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);

height = metrics.heightPixels;
width = metrics.widthPixels;

double topMenuWidthScale = 0.1;
int topMenuWidth = (int)(topMenuWidthScale * width);

menuBtn = (ImageButton)findViewById(R.id.menuBtn);

menuBtn.setLayoutParams(new RelativeLayout.LayoutParams(topMenuWidth, topMenuWidth));