将视图与 RelativeLayout 之外的视图对齐

Question

我正在使用 Android 中的 RelativeLayout 设计一个 table 并以编程方式添加条目。到目前为止，结果令我满意：

布局代码为

<RelativeLayout
    android:id="@+id/table_relativelayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
  <TextView
      android:id="@+id/column1_header"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:layout_alignParentLeft="true"
      android:layout_alignParentTop="true"
      android:text="@string/column1_header"
      style="?android:attr/listSeparatorTextViewStyle"
      android:layout_weight="1.0"
      />
  <TextView
      android:id="@+id/column2_header"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_centerHorizontal="true"
      android:layout_alignBaseline="@id/column1_header"
      android:text="@string/column1_header"
      android:textSize="14sp"
      android:textStyle="bold"
      android:textAllCaps="true"
      android:textColor="@color/textColor"
      />
  <TextView
      android:id="@+id/column3_header"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignParentRight="true"
      android:layout_alignBaseline="@id/column1_header"
      android:text="@string/column3_header"
      android:textSize="14sp"
      android:textAllCaps="true"
      android:textStyle="bold"
      android:paddingRight="8dip"
      />

  <TextView
      android:id="@+id/example_column1_entry"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignLeft="@id/column1_header"
      android:text=""
      android:paddingLeft="8dip"
      android:visibility="gone"
      />
  <TextView
      android:id="@+id/example_column2_entry"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignRight="@id/column2_header"
      android:text=""
      android:visibility="gone"
      />
  <TextView
      android:id="@+id/example_column3_entry"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignRight="@id/column3_header"
      android:paddingRight="8dip"
      android:text=""
      android:visibility="gone"
      />

</RelativeLayout>

但是，随着添加的条目越来越多，滚动变得有必要。所以我把整个东西包装在 ScrollView (as per this answer)

<ScrollView
  android:id="@+id/table_scrollview"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:scrollbars="vertical"
  android:fillViewport="true"
  >
    ...
</ScrollView>

这当然会导致 header 行在我向下滚动时被隐藏。我宁愿把它放在 ScrollView 之外，但我不知道如何将条目与 header 对齐。有什么想法吗？

Answer 1

试试这样的东西：

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">
   <LinearLayout 
       android:id="@+id/header"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:orientation="horizontal"
       android:layout_alignParentTop="true">
    <TextView
      android:id="@+id/column1_header"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:layout_alignParentLeft="true"
      android:layout_alignParentTop="true"
      android:text="@string/column1_header"
      style="?android:attr/listSeparatorTextViewStyle"
      android:layout_weight="1.0"
      />
  <TextView
      android:id="@+id/column2_header"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_centerHorizontal="true"
      android:layout_alignBaseline="@id/column1_header"
      android:text="@string/column1_header"
      android:textSize="14sp"
      android:textStyle="bold"
      android:textAllCaps="true"
      android:textColor="@color/textColor"
      />
  <TextView
      android:id="@+id/column3_header"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignParentRight="true"
      android:layout_alignBaseline="@id/column1_header"
      android:text="@string/column3_header"
      android:textSize="14sp"
      android:textAllCaps="true"
      android:textStyle="bold"
      android:paddingRight="8dip"
      />
</LinearLayout>
<ScrollView 
    android:layout_below="@id/header"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

   <LinearLayout
       android:id="@+id/scroll_view_container"
       android:layout_width="match_parent" 
       android:layout_height="wrap_content"> 

       <rows>

    </LinearLayout>

</ScrollView>
<RelativeLayout>

Answer 2

您不想用 xml 执行此操作。因为您根本无法在 relativeLayout 中引用视图从外部，反之亦然，以对齐事物。我必须准确地处理你的问题，因为我实现了一个尺寸自调整的 tableView。诀窍是将一行的所有 textView 添加到 ViewGroup（例如 LinearLayout，因为易于与 addView 一起使用）并计算每一行的宽度 header forehand。比以编程方式设置 viewGroups 的大小。这就是关键。这样，您以后可以轻松更改行 header 并保持灵活性。此外，您不限于固定大小的列。

计算header
为每行设置（例如）LinearLayouts 的大小
将所有 TextView 添加到 LinearLayouts

希望这对您有所帮助。如果您发现自己在 Whosebug 上，就可以回答所有即将出现的计算大小等问题。

你好，史蒂夫。

Answer 3

好的，我找到了一个解决方案：我将在 ScrollView 之外添加三个 header TextView，正如一些评论者所建议的，另外三个 "header" TextView 具有相同的参数加上 android:visibility="invisible" 在滚动视图中。那些不可见的 TextView 将用于对齐可见条目。

感谢您的回答！

将视图与 RelativeLayout 之外的视图对齐

Aligning views with views outside the RelativeLayout

android

android-layout