TableLayout样式化每一行

时间:2013-05-28 05:28:18

标签: android android-layout

我想在TableLayout中设置5行,以获得一种气泡轮廓。我想让每一行都用弯曲的边缘和不同的阴影背景颜色隔离。是否可以使用TableLayout完成此操作?目前我只有一个包含3行的基本表结构,每行只包含一个普通的TextView。谢谢你的时间。

2 个答案:

答案 0 :(得分:5)

这样的东西?

<强> row_blue_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle" >
         <solid   android:color="#2ca4ea"/>
         <corners android:bottomRightRadius="5dp" 
                 android:bottomLeftRadius="5dp" 
                 android:topLeftRadius="5dp" 
                 android:topRightRadius="5dp" />                         

    </shape>
</item>
</layer-list>

<强> row_red_bg.xml

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

    </shape>
</item>
</layer-list>

<强> table_layout.xml

<LinearLayout 
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">

<TableLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:stretchColumns="*" 
    android:background="#373737"
    >
    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/row_red_bg"
        >

          <!-- First  -->
            <LinearLayout
            android:id="@+id/first_text"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_weight="1" >

                  <TextView
                    android:id="@+id/tvMyBooking"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:textColor="#ffffff"
                    android:gravity="center"
                    android:text="r11"
                    android:padding="5dp"
                     />

           </LinearLayout>

        <!-- Second  -->
            <LinearLayout
            android:id="@+id/second_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"

            android:layout_weight="1"  >

                <TextView
                    android:id="@+id/tvPrivate"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r12" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />


           </LinearLayout>

          <!-- third  -->
            <LinearLayout
            android:id="@+id/third_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"

            android:layout_weight="1" >

                <TextView
                    android:id="@+id/tvPublic"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r13" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />



           </LinearLayout>


          <!-- fourth  -->
            <LinearLayout
            android:id="@+id/fourth_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical" 
            android:layout_weight="1" >

                <TextView
                    android:id="@+id/tvAddBooking"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r14" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />



           </LinearLayout>

    </TableRow>

     <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/row_blue_bg"
        >

          <!-- First  -->
            <LinearLayout
            android:id="@+id/first_text"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_weight="1" >

                  <TextView
                    android:id="@+id/tvMyBooking"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:textColor="#ffffff"
                    android:gravity="center"
                    android:text="r21"
                    android:padding="5dp"
                     />




           </LinearLayout>

        <!-- Second  -->
            <LinearLayout
            android:id="@+id/second_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"

            android:layout_weight="1"  >

                <TextView
                    android:id="@+id/tvPrivate"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r22" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />


           </LinearLayout>

          <!-- third  -->
            <LinearLayout
            android:id="@+id/third_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"

            android:layout_weight="1" >

                <TextView
                    android:id="@+id/tvPublic"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r23" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />



           </LinearLayout>


          <!-- fourth  -->
            <LinearLayout
            android:id="@+id/fourth_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical" 
            android:layout_weight="1" >

                <TextView
                    android:id="@+id/tvAddBooking"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r24" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />



           </LinearLayout>

    </TableRow>
     <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/row_red_bg"
        >

          <!-- First -->
            <LinearLayout
            android:id="@+id/first_text"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_weight="1" >

                  <TextView
                    android:id="@+id/tvMyBooking"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:textColor="#ffffff"
                    android:gravity="center"
                    android:text="r31"
                    android:padding="5dp"
                     />

           </LinearLayout>

        <!-- Second  -->
            <LinearLayout
            android:id="@+id/second_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"

            android:layout_weight="1"  >

                <TextView
                    android:id="@+id/tvPrivate"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r32" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />


           </LinearLayout>

          <!-- third  -->
            <LinearLayout
            android:id="@+id/third_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"

            android:layout_weight="1" >

                <TextView
                    android:id="@+id/tvPublic"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r33" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />



           </LinearLayout>


          <!-- fourth  -->
            <LinearLayout
            android:id="@+id/fourth_text"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical" 
            android:layout_weight="1" >

                <TextView
                    android:id="@+id/tvAddBooking"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="r34" 
                    android:textColor="#ffffff"
                    android:padding="5dp"
                    />

           </LinearLayout>

    </TableRow>

</TableLayout>

</LinearLayout>

答案 1 :(得分:2)

是可以为表格布局的不同行创建单独的布局。

尝试这样的事情:

<TableLayout
        android:orientation="vertical" 
        android:layout_gravity="center_horizontal"
        android:gravity="center_horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TableRow
            android:layout_width="match_parent"
            android:layout_marginTop="30dp"
            android:layout_height="wrap_content"
            android:gravity="center">
            <RelativeLayout             
                android:id="@+id/dashboard1BtnMyOwn"
                android:clickable="true"
                android:background="@drawable/click_effect_dashboard"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                >
                <ImageView
                    android:id="@+id/dashboard1ImgMyOwn"
                    android:layout_width="45dp"
                    android:contentDescription="@string/myOwned"
                    android:layout_height="45dp"
                    android:gravity="center"
                    android:layout_centerHorizontal="true"
                    android:src="@drawable/personal"
                    />
                <TextView
                    android:id="@+id/dashboard1TxtMyOwn"
                android:layout_width="95dp"
                    android:layout_height="wrap_content"
                    android:lines="2"
                    android:textSize="20sp"
                    android:gravity="center"
                    android:layout_below="@id/dashboard1ImgMyOwn"
                    android:text="@string/myOwned"
                    />
            </RelativeLayout>
            <TableRow/>
            ....

为TableRow中的RelativeLayout使用自定义Drawable,用于以下边框:

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="rectangle"> 
     <gradient android:startColor="@android:color/holo_blue_light" android:endColor="@android:color/holo_blue_light" 
            android:angle="270"/> 

    <corners android:bottomRightRadius="7dp" android:bottomLeftRadius="7dp" 
     android:topLeftRadius="7dp" android:topRightRadius="7dp"/> 
</shape> 

这应该是结果(设置你自己的图像): enter image description here