TableLayout 각 행 스타일링

Question

TableLayout 안에 5 개의 행을 설정하여 일종의 버블 아웃 라인을 만들려고합니다. 각 행을 곡선 가장자리와 다른 음영 배경색으로 분리하고 싶습니다. TableLayout으로이 작업을 수행 할 수 있습니까? 현재 나는 3 행의 기본 테이블 구조 만 가지고 있으며 각각은 보통 TextView 만 포함하고 있습니다. 시간 내 줘서 고마워.

Answer 1

이와 비슷한?

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> 

Answer 2

예는 possib입니다 테이블 레이아웃의 다른 행에 대해 별도의 레이아웃을 만듭니다.

이 같은 것을보십시오 :

<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의에 대한 사용자 지정 그리기를 사용

<?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> 

이 있어야 결과 (자신의 이미지를 설정) :