如何对齐第一个元素填充所有可用空间的2个元素？

我试图创建下面的布局，我有一些困难：如何对齐第一个元素填充所有可用空间的2个元素？

enter image description here

的困难是获得左侧的Button填写所有不是由所占用的可用空间右边的ImageButton。

这是我使用的axml：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal" 
    android:gravity="center_vertical"> 
    <LinearLayout 
     android:id="@+id/layout1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal"> 
     <Button 
      android:background="@null" 
      android:text="The Button Text" 
      android:id="@+id/btnText" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" /> 
    </LinearLayout> 
    <ImageButton 
     android:id="@+id/imgSettings" 
     android:layout_toRightOf="@id/layout1" 
     android:background="@null" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentRight="true" 
     android:src="@drawable/settings_light" 
     android:layout_centerVertical="true" /> 
</RelativeLayout>

，它的出现是这样的：

我如何能得到这个显示为第一个图像中概述？

enter image description here

来源

2013-07-01 DaveDev

我知道有一种方法可以通过编辑XML来完成它，但有时我发现自己忘记了使用Eclipse ADT进行可视化编辑是相当不错的。因此，请尝试使用鼠标拉视图以适应可用空间。它通常会创建正确的代码。 –

你可以做到这两个方面 - 首先是一个线性布局。你给文本的宽度为0dp，但告诉它在第一次测量之后留下剩余的空间和“layout_weight”属性。图片后，它需要，然后由文本元素完全推入到右侧的空间：

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/layout1" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal"> 
    <Button 
     android:background="@null" 
     android:text="The Button Text" 
     android:id="@+id/btnText" 
     android:layout_width="0dp" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:gravity="left" 
     /> 
    <ImageButton 
     android:id="@+id/imgSettings" 
     android:background="@null" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:src="@drawable/settings_light" 
     android:layout_centerVertical="true" 
     android:layout_weight="0" /> 
</LinearLayout>

第二种是相对布局 - 你再给文本的0dp的宽度，但你告诉它将它的左边与父对齐，并且与图像对齐。图像在右对齐，因为它需要

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/layout1" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal"> 
    <Button 
     android:background="@null" 
     android:text="The Button Text" 
     android:id="@+id/btnText" 
     android:layout_width="0dp" 
     android:layout_height="match_parent" 
     android:layout_toLeftOf="@+id/imgSettings" 
     android:layout_alignParentLeft="true" 
     android:gravity="left" 
     /> 
    <ImageButton 
     android:id="@id/imgSettings" 
     android:background="@null" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:src="@drawable/settings_light" 
     android:layout_centerVertical="true" 
     android:layout_alignParentRight="true" /> 
</RelativeLayout>

来源

2013-07-01 16:32:42 JRaymond

这些看起来非常好，谢谢！我怎样才能让左侧按钮的文本左对齐而不是居中？ – DaveDev

没关系 - 我明白了：向按钮添加'android：gravity =“left | center_vertical”' – DaveDev

@DaveDev只需添加重力！见上面编辑 – JRaymond

你应该包括android:layout_weight属性仅占据尽可能多的空间。使用此属性，同一布局中的元素按百分比共享空间。

因此，将<Button>和<ImageButton>放在同一个<LinearLayout>中，以便他们可以共享空间百分比。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal" 
    android:gravity="center_vertical"> 
    <LinearLayout 
     android:id="@+id/layout1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal"> 
     <Button 
      android:background="@null" 
      android:text="The Button Text" 
      android:id="@+id/btnText" 
      android:layout_weight:".80" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" /> 
     <ImageButton 
      android:id="@+id/imgSettings" 
      android:layout_toRightOf="@id/layout1" 
      android:background="@null" 
      android:layout_weight:".20" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_alignParentRight="true" 
      android:src="@drawable/settings_light" 
      android:layout_centerVertical="true" /> 
    </LinearLayout> 
</RelativeLayout>

来源

2013-07-01 16:42:07 dontholdthelittlefella

如何对齐第一个元素填充所有可用空间的2个元素？

回答

相关问题