parent layout corners not visible because selector overlaps

Question

Im tryng to build tabs using rounded linearlayout which has 2 textviews.

I want the following output

What happens instead is the following

The selector applied to textview gets drawn on top of parent layouts drawable, because of which the corners are not visible. I cannot add corners to textview selector because it will round all 4 corners in each textview.

I also thought of using specific corners i.e shaping each textview, but tht will increase number of drawables for each textview, which is not a flexible solution, in future I may choose to use more tabs.

Please can anyone suggest a generic xml solution so that I can change the background of textviews without affecting parent layout corners?

My Code Layout

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:background="@drawable/layout_background"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/issue_tab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/tab_selector"
        android:fontFamily="@raw/roboto_medium"
        android:gravity="center_horizontal"
        android:padding="5dp"
        android:text="TAB 1" />

    <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#4c8bff" />

    <TextView
        android:id="@+id/activity_tab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/tab_selector"
        android:fontFamily="@raw/roboto_medium"
        android:gravity="center_horizontal"
        android:padding="5dp"
        android:text="TAB 2" />
</LinearLayout>

layout_background.xml

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

    <stroke android:width="1dp" android:color="#4c8bff"/>
    <corners android:radius="5dp" />
    <solid android:color="#FFFFFFFF" />

</shape>

tab_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:drawable="@drawable/tab_selected"/>
 <!-- selected -->
    <item android:state_pressed="true" android:drawable="@drawable/tab_pressed"/>
 <!-- pressed -->
    <item android:state_focused="true" android:drawable="@drawable/tab_pressed"/>
 <!-- focused -->
    <item android:drawable="@drawable/tab_normal"/>
 <!-- default -->    
</selector>

tab_selected.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#4c8bff" />
</shape>

Answer 1

Updated Code

Create tab_selected_left_corner.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#4c8bff" />
    <corners
       android:bottomLeftRadius="5dp"
       android:bottomRightRadius="0dp"
       android:topLeftRadius="5dp"
       android:topRightRadius="0dp" />
</shape>

Create tab_selected_right_corner.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#4c8bff" />
    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="5dp"
        android:topLeftRadius="0dp"
        android:topRightRadius="5dp" />
</shape>

Create layout_background.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:dither="true"
android:shape="rectangle" >

<stroke
    android:width="1dp"
    android:color="#4c8bff" />

<corners android:radius="5dp" />

<solid android:color="#FFFFFFFF" />

</shape>

Your main xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:background="@drawable/layout_background"
    android:orientation="horizontal" >

<TextView
    android:id="@+id/issue_tab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center_horizontal"
    android:padding="5dp"
    android:text="TAB 1" />

<View
    android:layout_width="1dp"
    android:layout_height="match_parent"
    android:background="#4c8bff" />

<TextView
    android:id="@+id/activity_tab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center_horizontal"
    android:padding="5dp"
    android:text="TAB 2" />

</LinearLayout>

Put this in your activity

issueTab.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            issueTab.setBackgroundResource(R.drawable.tab_selected_left_corner);
              activity_tab.setBackgroundResource(android.R.color.transparent);
        }
    });
    activity_tab.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
              issueTab.setBackgroundResource(android.R.color.transparent);
            activity_tab.setBackgroundResource(R.drawable.tab_selected_right_corner);
        }
    });

This works for me.. Hope for you also.