Is there a way to create this on XML ? 2 colors box

Create 2 XML drawables

rect_colored.xml

<shape android:shape="rectangle"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <solid android:color="@color/colorAccent"/>
    <corners android:bottomRightRadius="5dp"
        android:topRightRadius="5dp"/>

</shape>

rect_white.xml

<shape android:shape="rectangle"
    xmlns:android="http://schemas.android.com/apk/res/android" >
    <stroke android:color="@color/colorPrimaryDark"
        android:width="2dp"/>
    <corners android:radius="5dp"/>
</shape>

Position the drawables appropriately

This will work differently with different root views. I'm using ConstraintLayout for simplicity

<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <FrameLayout
        android:layout_width="0dp"
        android:layout_height="40dp"
        android:layout_marginRight="8dp"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_marginLeft="8dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:layout_marginTop="8dp"
        android:background="@drawable/rect_white"
        android:id="@+id/frameLayout"
        app:layout_constraintBottom_toBottomOf="parent"
        android:layout_marginBottom="8dp">

        <!--Content here-->

    </FrameLayout>

    <FrameLayout
        android:layout_width="36dp"
        android:layout_height="36dp"
        android:layout_marginBottom="0dp"
        android:layout_marginRight="2dp"
        android:layout_marginTop="0dp"
        android:background="@drawable/rect_colored"
        app:layout_constraintBottom_toBottomOf="@+id/frameLayout"
        app:layout_constraintRight_toRightOf="@+id/frameLayout"
        app:layout_constraintTop_toTopOf="@+id/frameLayout">

        <!--Content here-->

    </FrameLayout>

</android.support.constraint.ConstraintLayout>

The output

Just use a LayerList with the shapes you need nested. May take a little tweaking, but it is simple enough. You can even add in your bitmaps for the left icon if you like. Just make your layers, and adjust from the sides and handle your corners.

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

    <item
        android:left="50dp">
        <shape
            android:shape="rectangle" >
            <solid android:color="#0000FF" />
            <corners android:bottomRightRadius="20dp" android:topRightRadius="20dp" />
        </shape>
    </item>
    <item android:right="50dp">
        <shape
            android:shape="rectangle" >
            <solid android:color="#ffffff" />
            <corners android:bottomLeftRadius="20dp" android:topLeftRadius="20dp" />
        </shape>
    </item>

</layer-list>

Here simply you create a one xml file & drawable file to create shape & border.

MyActivity.Xml

<LinearLayout
    android:id="@+id/ll_mobile_img"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="30dp"
    android:paddingLeft="15dp"
    android:paddingRight="15dp">

    <RelativeLayout
        android:id="@+id/rr_verification_code"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.3">

        <EditText
            android:id="@+id/et_verification_code"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/ractangle_mobile_white_border"
            android:ems="10"
            android:hint="Enter Code"
            android:drawableLeft="@mipmap/ic_launcher"
            android:imeOptions="actionGo"
            android:inputType="number|textAutoComplete"
            android:maxLength="6"
            android:paddingBottom="15dp"
            android:paddingLeft="10dp"
            android:paddingTop="16dp"
            android:singleLine="true"
            android:textColor="@android:color/white"
            android:textColorHint="@android:color/white"
            android:textSize="18sp" />
    </RelativeLayout>

    <LinearLayout
        android:id="@+id/ll_country_img"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:background="@android:color/white"
        android:gravity="center_vertical"
        android:orientation="vertical">

        <TextView
            android:id="@+id/tv_verification_code_img"
            android:layout_width="38dp"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:gravity="center"
            android:text="@string/globe"
            android:textColor="@color/blue_font_color"
            android:textSize="20dp" />
    </LinearLayout>
</LinearLayout>

Drawable:- ractangle_mobile_white_border.xml

[![<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <layer-list>
            <item>
                <shape>
                    <gradient android:angle="360" android:endColor="@android:color/transparent" android:startColor="@android:color/transparent" />
                    <stroke android:width="1dp" android:color="@android:color/white" />
                    <corners android:bottomRightRadius="1dp" android:topRightRadius="1dp"/>
                    <padding android:bottom="3dp" android:left="0dp" android:right="3dp" android:top="3dp" />
                </shape>
            </item>
        </layer-list>
    </item>
</selector>

Hope this helps you.