Apps Can't center ImageView inside of other ImageView properly?

[Camphi]

Hello, I am currently in the process of developing an app that deals with music. I coded a music stave and tried to put it on a rectangle, both are image views, but I cannot seem to center the music stave on the rectangle correctly. The bottom line of the stave is in the center of the rectangle and the rest of the lines are in the top half of the rectangle. The entire bottom half is unused. Here is my code:

Activity:

<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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:background="@color/colorBackground"
    tools:context="aphitech.musicappproject.MainActivity">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="90dp"
                android:clickable="false">
                <ImageView
                    android:id="@+id/LowAb"
                    android:layout_width="match_parent"
                    android:layout_height="90dp"
                    android:src="@drawable/rectangle"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentTop="true"
                    />
                <ImageView
                    android:layout_width="match_parent"
                    android:layout_height="90dp"
                    android:layout_alignParentBottom="true"
                    android:layout_centerVertical="true"
                    android:src="@drawable/stavelines"/>

                <ImageView
                    android:id="@+id/tr"
                    android:layout_width="match_parent"
                    android:layout_height="11dp"
                    android:src="@drawable/note"
                    android:layout_marginTop="52dp"
                    android:layout_marginEnd="225dp"/>
                <ImageView
                    android:id="@+id/b"
                    android:layout_width="match_parent"
                    android:layout_height="11dp"
                    android:src="@drawable/note"
                    android:layout_marginTop="28dp"
                    android:layout_marginEnd="60dp"/>
            </RelativeLayout>
</RelativeLayout>

Rectangle:

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/listview_background_shape">
            <stroke android:width="1dp" android:color="#e0dfde" />
            <padding android:left="2dp"
                android:top="2dp"
                android:right="2dp"
                android:bottom="2dp"/>
            <solid android:color="#ffffff" />
        </shape>
    </item>

</layer-list>

Music Stave:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
            <stroke android:width="2dp" android:color="#000000"/>
            <size android:height="20dp" />
            <padding android:bottom="20dp"/>
        </shape>
    </item>

    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
            <stroke android:width="2dp" android:color="#000000"/>
            <size android:height="20dp" />
            <padding android:bottom="20dp"/>
        </shape>
    </item>

    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
            <stroke android:width="2dp" android:color="#000000"/>
            <size android:height="20dp" />
            <padding android:bottom="20dp"/>
        </shape>
    </item>

    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
            <stroke android:width="2dp" android:color="#000000"/>
            <size android:height="20dp" />
            <padding android:bottom="20dp"/>
        </shape>
    </item>

    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
            <stroke android:width="2dp" android:color="#000000"/>
            <size android:height="20dp" />
        </shape>
    </item>

</layer-list>

I am thinking that the music staves drawable is the reason why it isn't centering correctly, which could be due to the padding that I placed in between the lines so that it actually looks like a music stave.

 

[Deleted User]

Do you have a screenshot of this?
Another approach you might want to look into is using 2D graphics on a canvas for this. Would give you absolute control over position of graphical elements. Just a suggestion.

 

[Camphi]

Do you have a screenshot of this?
Another approach you might want to look into is using 2D graphics on a canvas for this. Would give you absolute control over position of graphical elements. Just a suggestion.

Here is what is happening:

 

[Camphi]

bump