2010-04-21 63 views
0

可能我还不明白TableLayout的布局属性。似乎没有可能像HTML一样实现这样一个灵活的表格,因为没有单元格。我的目标是要实现这样的布局:如何将TableLayout中的按钮对齐到不同的方向?

enter image description here

我怎样才能做到这一点?我想过使用GridView,但这在XML中似乎不太有用。 我的努力是这样的:

 <TableLayout 
     android:id="@+id/tableLayout" 
     android:layout_width="320sp" 
     android:layout_height="fill_parent" 
     android:layout_gravity="center_horizontal" 
     android:gravity="bottom" 
     android:layout_alignParentBottom="true"> 
     <TableRow 
     android:background="#333333" 
     android:gravity="bottom" 
     android:layout_width="fill_parent">  
     <Button 
      android:id="@+id/btnUp" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:gravity="left" 
      android:text="Lift U" 
      /> 
     <Button 
      android:id="@+id/btnScreenUp" 
      android:gravity="right" 
      android:layout_gravity="right" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:text="Scrn U" 
      /> 
     </TableRow> 
     <TableRow 
      android:background="#444444" 
      android:gravity="bottom" 
      android:layout_gravity="right"> 
      <Button 
      android:id="@+id/btnDown" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:text="Lift D" 
      /> 
      <Button 
      android:id="@+id/btnScreenLeft" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:gravity="right" 
      android:layout_gravity="right" 
      android:text="Scrn L" 
      /> 
      <Button 
      android:id="@+id/btnScreenDown" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:gravity="right" 
      android:layout_gravity="right" 
      android:text="Scrn D" 
      /> 
      <Button 
      android:id="@+id/btnScreenRight" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:gravity="right" 
      android:layout_gravity="right" 
      android:text="Scrn R" 
      /> 
     </TableRow> 
</TableLayout> 

回答

7

我找到了解决方案。第二排有4个按钮。随着android:stretchColumns =“1”我拉伸第二列,所以对齐已经是我想要的。唯一的问题是按钮“Scrn U”。它也会被拉长。所以,你必须添加一个不可见的按钮(这将被拉伸),这个按钮“按下”按钮“SCRN U”下一个“列”:

 <TableLayout 
     android:id="@+id/tableLayout" 
     android:layout_width="320sp" 
     android:layout_height="fill_parent" 
     android:stretchColumns="1" 
     android:gravity="bottom" 
     android:layout_alignParentBottom="true"> 
     <TableRow 
     android:background="#333333" 
     android:gravity="bottom">  
     <Button 
      android:id="@+id/btnUp" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:text="Lift U" 
      /> 
     <Button 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:visibility="invisible" 
     /> 
     <Button 
      android:id="@+id/btnScreenUp" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:layout_gravity="right" 
      android:text="Scrn U" 
      /> 
     </TableRow> 
     <TableRow 
      android:background="#444444" 
      android:layout_gravity="right"> 
      <Button 
      android:id="@+id/btnDown" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:text="Lift D" 
      /> 
      <Button 
      android:id="@+id/btnScreenLeft" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:layout_gravity="right" 
      android:text="Scrn L" 
      /> 
      <Button 
      android:id="@+id/btnScreenDown" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:layout_gravity="right" 
      android:text="Scrn D" 
      /> 
      <Button 
      android:id="@+id/btnScreenRight" 
      android:layout_width="60sp" 
      android:layout_height="50sp" 
      android:layout_gravity="right" 
      android:text="Scrn R" 
      /> 
     </TableRow> 
</TableLayout> 
1

未经检验的,但是这可能会工作:

<TableLayout 
    android:id="@+id/tableLayout" 
    android:layout_width="320sp" 
    android:layout_height="fill_parent" 
    android:layout_gravity="center_horizontal" 
    android:gravity="bottom" 
    android:layout_alignParentBottom="true"> 
    <TableRow 
    android:background="#333333" 
    android:gravity="bottom" 
    android:layout_width="fill_parent">  
    <Button 
     android:id="@+id/btnUp" 
     android:layout_width="60sp" 
     android:layout_height="50sp" 
     android:layout_span="3" 
     android:text="Lift U" 
     /> 
    <Button 
     android:id="@+id/btnScreenUp" 
     android:layout_width="60sp" 
     android:layout_height="50sp" 
     android:layout_span="2" 
     android:text="Scrn U" 
     /> 
    </TableRow> 
    <TableRow 
     android:background="#444444" 
     android:gravity="bottom" 
     android:layout_gravity="right"> 
     <Button 
     android:id="@+id/btnDown" 
     android:layout_width="60sp" 
     android:layout_height="50sp" 
     android:layout_span="2" 
     android:text="Lift D" 
     /> 
     <Button 
     android:id="@+id/btnScreenLeft" 
     android:layout_width="60sp" 
     android:layout_height="50sp" 
     android:text="Scrn L" 
     /> 
     <Button 
     android:id="@+id/btnScreenDown" 
     android:layout_width="60sp" 
     android:layout_height="50sp" 
     android:text="Scrn D" 
     /> 
     <Button 
     android:id="@+id/btnScreenRight" 
     android:layout_width="60sp" 
     android:layout_height="50sp" 
     android:text="Scrn R" 
     /> 
    </TableRow> 

基本上,我只是规定了一些细胞有layout_span,这是怎样的像HTML表格colspan一样。有了这个,你不必尝试和对齐等。

+0

你好,对不起 它没有这方面的工作办法。它看起来与我以前的努力相似。在你的情况下,第一行包含按钮“抬起U”,看起来是正确的,但下一个按钮“Scrn U”被延伸到下一行的下面的按钮上。此外,下一行中的“Scrn L”按钮看起来会被裁剪。另外两个按钮“Scrn D”,“Scrn R”看起来正确。但是所有按钮都贴在左侧。我以前的努力看起来很相似。我无法管理它将它们中的一些对准右侧。 我不知道为什么这一个布局是如此繁琐。其他布局看起来相当精心。 – Bevor 2010-04-22 17:23:22