Android studio design view looks different than app run time view in emulator

Viewed 1645

I am attempting to create a calculator app which would have a similar layout to the default calculator on iOS. In the design view built into android studio, the layout of the app looks like this (Design view) But when the app runs, it looks like this (App view). Is their a way to fix this?

Thanks!

XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.lontronix.calculator.Calculator">

    <TextView

        android:id="@+id/Screen_View"
        android:layout_width="400dp"
        android:layout_height="125dp"
        android:text="@string/Filler_Text"
        android:textSize="35pt"
        android:layout_alignParentTop="true"
        android:layout_alignParentStart="true"
        android:layout_above="@+id/Clear_Button" />

    <ImageButton
        android:id="@+id/Equals"
        android:adjustViewBounds="true"
        android:padding="0dp"
        android:scaleType="fitXY"
        android:layout_width="200dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/zero"
        android:layout_alignParentBottom="true"
        android:layout_alignParentStart="true" />

    <ImageButton
        android:id="@+id/One"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/one"
        android:layout_above="@+id/Equals"
        android:layout_alignParentStart="true" />

    <ImageButton
        android:id="@+id/Two_button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/two"
        android:layout_above="@+id/Equals"
        android:layout_toEndOf="@+id/One" />

    <ImageButton
        android:id="@+id/Decimal_button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/decimal"
        android:layout_alignParentBottom="true"
        android:layout_toEndOf="@+id/Equals" />

    <ImageButton
        android:id="@+id/three_button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/three"
        android:layout_alignTop="@+id/Two_button"
        android:layout_toEndOf="@+id/Two_button" />

    <ImageButton
        android:id="@+id/equals_button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="110dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/equals"
        android:layout_alignParentBottom="true"
        android:layout_toEndOf="@+id/Decimal_button" />

    <ImageButton
        android:id="@+id/Plus_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="110dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/plus"
        android:layout_above="@+id/equals_button"
        android:layout_toEndOf="@+id/Decimal_button" />

    <ImageButton
        android:id="@+id/Four_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/four"
        android:layout_above="@+id/One"
        android:layout_alignParentStart="true" />

    <ImageButton
        android:id="@+id/Five_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/five"
        android:layout_above="@+id/Two_button"
        android:layout_toEndOf="@+id/Four_Button" />

    <ImageButton
        android:id="@+id/Six_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/six"
        android:layout_below="@+id/Eight_Button"
        android:layout_toEndOf="@+id/Two_button" />

    <ImageButton
        android:id="@+id/Minus_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="110dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/minus"
        android:layout_alignTop="@+id/Six_Button"
        android:layout_toEndOf="@+id/three_button" />

    <ImageButton
        android:id="@+id/Seven_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/seven"
        android:layout_above="@+id/Four_Button"
        android:layout_alignParentStart="true" />

    <ImageButton
        android:id="@+id/Eight_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/eight"
        android:layout_alignTop="@+id/Seven_Button"
        android:layout_toEndOf="@+id/Seven_Button" />

    <ImageButton
        android:id="@+id/Nine_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/nine"
        android:layout_above="@+id/Six_Button"
        android:layout_toEndOf="@+id/Five_Button" />

    <ImageButton
        android:id="@+id/Multiply_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="110dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/multiply"
        android:layout_above="@+id/Minus_Button"
        android:layout_toEndOf="@+id/Nine_Button" />

    <ImageButton
        android:id="@+id/Clear_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/clear"
        android:layout_above="@+id/Seven_Button"
        android:layout_alignParentStart="true" />

    <ImageButton
        android:id="@+id/Plus_Minus_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/plus_minus"
        android:layout_below="@+id/Screen_View"
        android:layout_toEndOf="@+id/Clear_Button" />

    <ImageButton
        android:id="@+id/Percent_Button"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:padding="0dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/percent"
        android:layout_below="@+id/Screen_View"
        android:layout_toEndOf="@+id/Eight_Button" />

</RelativeLayout>
0 Answers
Related