Android TableLayout问题 - 无法正确设置

问题描述:

请分享TableLayout的修复 - 有点困惑如何设置权重和列以根据需要安排布局。我希望你能得到基于layout_span的格式化需求。但会尝试用文字解释。放下我如何可视化的布局Android TableLayout问题 - 无法正确设置

  1. 第一行 - 有一个按钮,整个宽度跨越
  2. 第二排 - 有标题居中对齐
  3. 第三排 - 有两个TextViews以50%的面积每个
  4. 第四行 - 使标题中心对齐
  5. 第五行 - 使一个ImageView占用16.6%的宽度,而TextView占用其余的83.3%。
  6. 第六行 - 使一个ImageView占用16.6%的宽度,而TextView占用其余的83.3%。

下面是代码:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    > 

    <TableRow 
     android:layout_height="wrap_content" 
     android:layout_width="match_parent" 
     android:padding="10dp"> 
     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/app_get_questions" 
      android:id="@+id/btnNext" 
      android:textColor="@color/windowBackground" 
      android:layout_span="4" 
      android:layout_column="1" 
      /> 
    </TableRow> 
    <TableRow 
     android:layout_height="fill_parent" 
     android:layout_width="match_parent" 
     > 
     <TextView 
      android:layout_height="wrap_content" 
      android:gravity="center_horizontal" 
      android:text="@string/app_scoring_leaders" 
      android:textAppearance="?android:attr/textAppearanceMedium" 
      android:textStyle="bold" 
      android:layout_span="4" 
      android:layout_column="1" 
      android:padding="5dp"/> 
    </TableRow> 
    <TableRow 
     android:layout_height="fill_parent" 
     android:layout_width="match_parent" 
     android:padding="5dp"> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/txtDailyScores" 
      android:text="1. Kapil Bhagia (34511)\n2. Hardik Bhagia (2231)" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:layout_margin="5dp" 
      android:layout_column="1" 
      android:layout_span="2" 
      android:layout_weight="3"/> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/txtAllTimeScores" 
      android:text="1. Kapil Bhagia (34511)\n2. Hardik Bhagia (2231)" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:layout_margin="5dp" 
      android:layout_column="3" 
      android:layout_span="2" 
      android:layout_weight="3"/> 
    </TableRow> 
    <TableRow 
     android:layout_height="fill_parent" 
     android:layout_width="match_parent" 
     > 
     <TextView 
      android:layout_height="wrap_content" 
      android:gravity="center_horizontal" 
      android:text="@string/app_get_started" 
      android:textAppearance="?android:attr/textAppearanceMedium" 
      android:textStyle="bold" 
      android:layout_column="1" 
      android:layout_span="4" 
      android:padding="5dp"/> 
    </TableRow> 
    <TableRow 
     android:layout_height="fill_parent" 
     android:layout_width="match_parent" 
     android:padding="5dp"> 
     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/ic_assessment_black_36dp" 
      android:layout_gravity="center_vertical" 
      android:layout_column="1" 
      android:layout_span="1" 
      android:layout_weight="1" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/app_intro" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:layout_margin="5dp" 
      android:layout_column="2" 
      android:layout_span="3" 
      android:layout_weight="5"/> 

    </TableRow> 
    <TableRow 
     android:layout_height="wrap_content" 
     android:layout_width="match_parent" 
     android:padding="5dp"> 
     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_vertical" 
      android:src="@drawable/ic_today_black_36dp" 
      android:layout_column="1" 
      android:layout_span="1" 
      android:layout_weight="1" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_vertical" 
      android:gravity="left" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:text="@string/app_base_score" 
      android:layout_margin="5dp" 
      android:layout_column="2" 
      android:layout_span="3" 
      android:layout_weight="5"/> 
    </TableRow> 
</TableLayout> 

这花了一点时间,但也有layout_weight,我不得不做相关的变化,整个表的结构必须改变。我使用LinearLayout来代替最后两行。前四行可以使用TableLayout完成。 Layout_spans不得不简化 - 似乎我们不能有复杂的布局。高兴地了解是否有更好的解决方案。

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    > 

    <TableRow 
     android:layout_height="wrap_content" 
     android:layout_width="wrap_content" 
     android:padding="5dp" > 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/app_rankgrade" 
      android:textAppearance="?android:attr/textAppearanceMedium" 
      android:textStyle="bold" 
      android:textColor="@android:color/black" 
      android:textAlignment="center" 
      android:layout_weight="2" 
      /> 

    </TableRow> 
    <TableRow 
     android:layout_height="wrap_content" 
     android:layout_width="wrap_content" 
     android:padding="2dp" android:layout_gravity="center"> 
     <RelativeLayout 
      xmlns:android="http://schemas.android.com/apk/res/android" 
      android:id="@+id/relativelayout" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" android:layout_gravity="center" android:gravity="center" android:layout_weight="1"> 

      <ImageView 
       android:id="@+id/myImageView" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/trframered1" 

       /> 

      <LinearLayout 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignLeft="@id/myImageView" 
       android:layout_alignTop="@id/myImageView" 
       android:layout_alignRight="@id/myImageView" 
       android:layout_alignBottom="@id/myImageView" 
       android:layout_margin="1dp" 
       android:gravity="center" 
       android:orientation="vertical" 
       > 
       <TextView 
        android:id="@+id/myImageViewTextHead" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_margin="1dp" 
        android:gravity="center" 
        android:text="@string/app_last_rank_grade" 
        android:textColor="#000000" /> 
       <TextView 
        android:id="@+id/txtLastDayRankGrade" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_margin="1dp" 
        android:gravity="center" 
        android:text="-" 
        android:textColor="#000000" /> 

      </LinearLayout> 


     </RelativeLayout> 

     <RelativeLayout 
      xmlns:android="http://schemas.android.com/apk/res/android" 
      android:id="@+id/relativelayout1" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" android:layout_gravity="center" android:gravity="center" android:layout_weight="1"> 

      <ImageView 
       android:id="@+id/myImageView1" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/trframered1" /> 

      <LinearLayout 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignLeft="@id/myImageView1" 
       android:layout_alignTop="@id/myImageView1" 
       android:layout_alignRight="@id/myImageView1" 
       android:layout_alignBottom="@id/myImageView1" 
       android:layout_margin="1dp" 
       android:gravity="center" 
       android:orientation="vertical" 
       > 
       <TextView 
        android:id="@+id/myImageViewTextHead1" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_margin="1dp" 
        android:gravity="center" 
        android:text="All Time" 
        android:textColor="#000000" /> 
       <TextView 
        android:id="@+id/txtLastAllTimeRankGrade" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_margin="1dp" 
        android:gravity="center" 
        android:text="-" 
        android:textColor="#000000" /> 

      </LinearLayout> 


     </RelativeLayout> 
    </TableRow> 
</TableLayout> 
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    > 

    <TableRow 
     android:layout_height="wrap_content" 
     android:layout_width="match_parent" 
     android:padding="5dp"> 
     <Button 
      android:layout_height="wrap_content" 
      android:text="@string/app_get_questions" 
      android:id="@+id/btnNext" 
      android:textColor="@color/windowBackground" 
      android:layout_span="2" 
      android:layout_weight="2" 
      /> 
    </TableRow> 
    <TableRow 
     android:layout_height="fill_parent" 
     android:layout_width="match_parent" 
     > 
     <TextView 
      android:layout_height="wrap_content" 
      android:gravity="center_horizontal" 
      android:text="@string/app_scoring_leaders" 
      android:textAppearance="?android:attr/textAppearanceMedium" 
      android:textStyle="bold" 
      android:layout_span="2" 
      android:layout_weight="2" 
      android:padding="5dp"/> 
    </TableRow> 
    <TableRow 
     android:layout_height="fill_parent" 
     android:layout_width="match_parent" 
     android:padding="5dp"> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/txtDailyScores" 
      android:text="1. Kapil Bhagia (34511)\n2. Hardik Bhagia (2231)" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:layout_margin="5dp" 
      android:layout_weight="1"/> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/txtAllTimeScores" 
      android:text="1. Kapil Bhagia (34511)\n2. Hardik Bhagia (2231)" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:layout_margin="5dp" 
      android:layout_weight="1"/> 
    </TableRow> 

    <TableRow 
     android:layout_height="fill_parent" 
     android:layout_width="match_parent" 
     > 
     <TextView 
      android:layout_height="wrap_content" 
      android:gravity="center_horizontal" 
      android:text="@string/app_get_started" 
      android:textAppearance="?android:attr/textAppearanceMedium" 
      android:textStyle="bold" 
      android:layout_weight="2" 
      android:layout_span="2" 
      android:padding="5dp"/> 
    </TableRow> 
    </TableLayout> 

      <LinearLayout 
       xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:orientation="horizontal" > 
       <ImageView 
        android:layout_height="wrap_content" 
        android:src="@drawable/ic_assessment_black_36dp" 
        android:layout_gravity="center_vertical" 
        android:layout_width="wrap_content" 
        android:padding="10dp" 
        /> 
       <TextView 
        android:layout_height="wrap_content" 
        android:layout_width="wrap_content" 
        android:text="@string/app_intro" 
        android:textAppearance="?android:attr/textAppearanceSmall" 
        android:padding="10dp" 
        /> 
      </LinearLayout> 

      <LinearLayout 
       xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:orientation="horizontal" > 
       <ImageView 
        android:layout_height="wrap_content" 
        android:layout_gravity="center_vertical" 
        android:src="@drawable/ic_today_black_36dp" 
        android:layout_width="wrap_content" 
        android:padding="10dp" 
        /> 
       <TextView 
        android:layout_height="wrap_content" 
        android:layout_width="wrap_content" 
        android:textAppearance="?android:attr/textAppearanceSmall" 
        android:text="@string/app_base_score" 
        android:padding="10dp" 
        /> 
      </LinearLayout>