Vertical Line in layout

Question

I am trying to create a vertical line in my layout between each word (similar to the horizontal lines) and it is taking up way too much space. Obviously I am not doing something correctly.

Here is the correct layout look:

Here is the layout after I add my custom view:

here is my XML

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/main_container"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    tools:context=".MainActivity"
    android:background="@color/darkGray"
    android:orientation="vertical"
    android:layout_weight="1" >
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal">

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


            <TableRow
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1">
                <TextView
                    android:id="@+id/myPRsTextView"
                    android:text="My PRs"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
                <View
                    android:background="@drawable/black_red_gradient_vertical"
                    android:layout_width="1dp"
                    android:layout_height="match_parent"
                    android:layout_weight="0"/>
                <TextView
                    android:id="@+id/workoutsTextView"
                    android:text="Workouts"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
            </TableRow>
            <TableRow>
                <View android:id="@+id/divider"
                    android:background="@drawable/black_red_gradient_horizontal"
                    android:layout_width="fill_parent"
                    android:layout_height="1dp"
                    android:layout_weight="1"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"/>
                <View
                    android:background="@drawable/black_red_gradient_horizontal"
                    android:layout_width="fill_parent"
                    android:layout_height="1dp"
                    android:layout_weight="1"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"/>
            </TableRow>

            <TableRow
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1">
                <TextView
                    android:id="@+id/tv3"
                    android:text="Timers"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
                <TextView
                    android:id="@+id/tv4"
                    android:text="Statistics"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
            </TableRow>

            <TableRow>
                <View android:id="@+id/divider"
                    android:background="@drawable/black_red_gradient_horizontal"
                    android:layout_width="fill_parent"
                    android:layout_height="1dp"
                    android:layout_weight="1"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"/>
                <View
                    android:background="@drawable/black_red_gradient_horizontal"
                    android:layout_width="fill_parent"
                    android:layout_height="1dp"
                    android:layout_weight="1"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"/>
            </TableRow>

            <TableRow
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1">
                <TextView
                    android:id="@+id/tv5"
                    android:text="Box Locator"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
                <TextView
                    android:id="@+id/tv6"
                    android:text="Something"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
            </TableRow>
        </TableLayout>
    </LinearLayout>
</FrameLayout>

Answer 1

I have modified some attributes in code.

try this layout:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/main_container"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    tools:context=".MainActivity"
    android:background="@android:color/darker_gray"
    android:orientation="vertical"
    android:layout_weight="1" >
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal">

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

            <TableRow
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1" >

                <TextView
                    android:id="@+id/myPRsTextView"
                    android:text="My PRs"
                    android:layout_width="match_parent"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>

                <View
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:layout_weight="0.03"
                    android:background="@android:color/white" />

                <TextView
                    android:id="@+id/workoutsTextView"
                    android:text="Workouts"
                    android:layout_width="match_parent"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
            </TableRow>
            <TableRow>

                <View
                    android:id="@+id/divider"
                    android:layout_width="fill_parent"
                    android:layout_height="1dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:layout_weight="1"
                    android:background="@android:color/white" />

                <View
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:layout_weight="0.03"
                    android:background="@android:color/white" />
                <View
                    android:layout_width="fill_parent"
                    android:layout_height="1dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:layout_weight="1"
                    android:background="@android:color/white" />

            </TableRow>

            <TableRow
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1">
                <TextView
                    android:id="@+id/tv3"
                    android:text="Timers"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
                <View
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:layout_weight="0.03"
                    android:background="@android:color/white" />
                <TextView
                    android:id="@+id/tv4"
                    android:text="Statistics"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
            </TableRow>

            <TableRow>
                <View android:id="@+id/divider"
                    android:background="@android:color/white"
                    android:layout_width="fill_parent"
                    android:layout_height="1dp"
                    android:layout_weight="1"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"/>
                <View
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:layout_weight="0.03"
                    android:background="@android:color/white" />
                <View
                    android:background="@android:color/white"
                    android:layout_width="fill_parent"
                    android:layout_height="1dp"
                    android:layout_weight="1"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"/>
            </TableRow>

            <TableRow
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1">
                <TextView
                    android:id="@+id/tv5"
                    android:text="Box Locator"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
                <View
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:layout_weight="0.03"
                    android:background="@android:color/white" />
                <TextView
                    android:id="@+id/tv6"
                    android:text="Something"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="fill_parent"
                    android:fontFamily="sans-serif-light"/>
            </TableRow>
        </TableLayout>
    </LinearLayout>
</FrameLayout>