How can I have transparent Text Field with dotted border?

Question

I want to have a dotted border on right side of a Text field. I have found these link but I can't do what I want.

-How to remove border only from one side of the element?

-android dashed border with padding

Here my activity_fullscreen.xml :

<EditText
            android:id="@+id/editText1"
            android:layout_width="278dp"
            android:layout_height="52dp"
            android:background="@drawable/dotted"
            android:ems="10"
            android:inputType="textShortMessage" />

Here my drawable/dotted.xml :

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

<!-- Border TOP LEFT BOTTOM -->
    <item>
        <shape>
<!-- Border TOP LEFT BOTTOM color-->
            <solid android:color="#fff"/><!-- White-->
        <stroke
                android:width="5dp"
                android:color="#000" /><!-- Black-->
        </shape>
    </item>

<!-- Border TOP LEFT BOTTOM width -->
    <item android:left="2dip"
          android:top="2dp"
          android:bottom="2dp">
        <shape>
            <solid android:color="#fff"/> <!-- White-->
<!-- Dotted border RIGHT -->
        <stroke     android:dashGap="3dp"
                    android:dashWidth="3dp"
                    android:width="5dp"
                    android:color="#ff0000" /><!-- Red-->
        </shape> 
    </item>

<item android:bottom="2dip"
android:top="2dip"
android:left="2dip"
android:right="2dip">
        <shape>
<!-- Background Color-->
            <solid android:color="#ffafafaf"/><!-- Grey -->
        </shape> 
    </item>

</layer-list>

I get this result : https://i.stack.imgur.com/QyHyZ.jpg

I want this : https://i.stack.imgur.com/Bqnc0.jpg