2011-06-11 130 views
137

我正在設計我的應用程序用戶界面。我需要一個佈局是這樣的:如何使視圖佈局填充剩餘的空間?

Example of desired layout

(<和>按鈕)。問題是,我不知道如何確保TextView將填充剩餘的空間,其中兩個按鈕的大小是固定的。

如果我使用fill_parent作爲文本視圖,則不能顯示第二個按鈕(>)。

如何製作看起來像圖像的佈局?

+0

你有什麼作爲根佈局使用? – woodshy 2011-06-11 14:49:38

+0

@woodshy任何佈局都可以,沒關係。 – 2011-06-11 15:11:13

回答

131

回答爲我工作,而且由於它不使用RelativeLayout它是不是由溫古雷亞努利維烏答案簡單。 我給我的佈局清晰:

<LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" 
     > 

    <Button 
     android:layout_width = "80dp" 
     android:layout_weight = "0" 
     android:layout_height = "wrap_content" 
     android:text="&lt;"/> 
    <TextView 
     android:layout_width = "fill_parent" 
     android:layout_height = "wrap_content" 
     android:layout_weight = "1"/> 
    <Button 
     android:layout_width = "80dp" 
     android:layout_weight = "0" 
     android:layout_height = "wrap_content" 
     android:text="&gt;"/> 
</LinearLayout> 
+0

這是一個很好的例子。謝謝! – Joqus 2015-08-05 22:15:56

+0

有一些像'alignLeft'和'alignParentLeft'等等,這是'LinearLayout'永遠無法實現的。 – IcyFlame 2016-06-28 07:23:42

+6

這是一個男人理解線性佈局中的真實體重的日子。:P(y) – 2016-11-24 04:07:01

85

如果< TEXT VIEW>被置於LinearLayout中,則爲TextView設置Layout_weight屬性<和>爲0和1。
在RelativeLayout的情況下對準<和>左側和右側,設置「佈局左」和「佈局,以權」的TextView的財產的< IDS和>

+3

這是正確的答案,但一個例子會很好:) – Noel 2011-06-11 15:11:31

+0

有沒有人還需要樣品? – woodshy 2011-06-11 16:18:34

+0

如何在這個佈局中添加圖像填滿整個視圖 – 2014-05-25 11:43:49

68

如果使用RelativeLayout,你可以做到這一點是這樣的:

<RelativeLayout 
    android:layout_width = "fill_parent" 
    android:layout_height = "fill_parent"> 
    <ImageView 
     android:id = "@+id/my_image" 
     android:layout_width = "wrap_content" 
     android:layout_height = "wrap_content" 
     android:layout_alignParentTop ="true" /> 
    <RelativeLayout 
     android:id="@+id/layout_bottom" 
     android:layout_width="fill_parent" 
     android:layout_height = "50dp" 
     android:layout_alignParentBottom = "true"> 
     <Button 
      android:id = "@+id/but_left" 
      android:layout_width = "80dp" 
      android:layout_height = "wrap_content" 
      android:text="&lt;" 
      android:layout_alignParentLeft = "true"/> 
     <TextView 
      android:layout_width = "fill_parent" 
      android:layout_height = "wrap_content" 
      android:layout_toLeftOf = "@+id/but_right" 
      android:layout_toRightOf = "@id/but_left" /> 
     <Button 
      android:id = "@id/but_right" 
      android:layout_width = "80dp" 
      android:layout_height = "wrap_content" 
      android:text="&gt;" 
      android:layout_alignParentRight = "true"/> 
    </RelativeLayout> 
</RelativeLayout> 
+0

謝謝,它的工作原理:)但我不明白。爲什麼TextView不能填充所有的空間,而不是''''按鈕? – 2011-06-11 15:09:07

+2

爲什麼有兩個嵌套的相對佈局?根源應該是足夠的。然後,你需要做的就是確保底部相對佈局的孩子都是alignParentBottom =「true」 – Noel 2011-06-11 15:10:12

+0

@Noel你是對的。我選擇2的佈局,因爲這是我習慣的方式:在我的應用程序可能發生的是我需要改變的一些看法知名度和更容易把所有的人都在佈局和改變的知名度只是此佈局。我的例子並不完美,但它的工作原理可能對某人有用。 – 2011-06-11 15:48:13

7

It's簡單 您設置minWidth或了minHeight,取決於你在找什麼,水平或垂直。 對於另一個對象(您想要填充剩餘空間的對象),您將權重設置爲1(設置寬度以包裹它的內容),因此它將填充其餘區域。從woodshy

<LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:gravity="center|left" 
     android:orientation="vertical" > 
</LinearLayout> 
<LinearLayout 
     android:layout_width="80dp" 
     android:layout_height="fill_parent" 
     android:minWidth="80dp" > 
</LinearLayout> 
2

對於那些具有<LinearLayout...>相同的毛刺,像我一樣:

指定android:layout_width="fill_parent"是很重要的,它不會與wrap_content工作。

OTOH,您可能省略android:layout_weight = "0",這不是必需的。

我的代碼基本上是相同https://stackoverflow.com/a/25781167/755804代碼(由維韋克潘迪)

4

可以使用高layout_weight屬性。下面你可以看到一個佈局,其中的ListView在底部採取所有可用空間的按鈕:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 
    xmlns:tools="http://schemas.android.com/tools" 
 
    android:layout_width="fill_parent" 
 
    android:layout_height="fill_parent" 
 
    tools:context=".ConfigurationActivity" 
 
    android:orientation="vertical" 
 
    > 
 

 
     <ListView 
 
      android:id="@+id/listView" 
 
      android:layout_width="fill_parent" 
 
      android:layout_height="fill_parent" 
 
      android:layout_weight="1000" 
 
      /> 
 

 

 
     <Button 
 
      android:id="@+id/btnCreateNewRule" 
 
      android:layout_width="fill_parent" 
 
      android:layout_height="wrap_content" 
 
      android:layout_weight="1" 
 
      android:text="Create New Rule" /> 
 

 

 

 
     <Button 
 
      android:id="@+id/btnConfigureOk" 
 
      android:layout_width="fill_parent" 
 
      android:layout_height="wrap_content" 
 
      android:layout_weight="1" 
 
      android:text="Ok" /> 
 

 

 
</LinearLayout>

0

你應該避免嵌套2相對佈局,因爲相對佈局總是2遍繪製(對1任何其他類型的佈局)。嵌套它們時它變得指數級。您應該對要填充剩餘空間的元素使用width = 0和weight = 1的線性佈局。 此答案對性能和實踐更好。記住:只有在沒有其他選擇時才使用相對佈局。

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical"> 

    <ImageView 
     android:id="@+id/imageview" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" /> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="50dp" 
     android:orientation="horizontal"> 

     <Button 
      android:id="@+id/prev_button" 
      android:layout_width="80dp" 
      android:layout_height="wrap_content" 
      android:text="&lt;" /> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:ellipsize="end" 
      android:singleLine="true" 
      android:gravity="center" 
      android:text="TextView" /> 

     <Button 
      android:id="@+id/next_button" 
      android:layout_width="80dp" 
      android:layout_height="wrap_content" 
      android:text="&gt;" /> 
    </LinearLayout> 
</LinearLayout> 
0

您可以使用設置layout_widthlayout_width0dp(通過要填充剩餘空間的方位)。 然後使用layout_weight使其填充剩餘空間。

0

使用RelativeLayout的包裹的LinearLayout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:round="http://schemas.android.com/apk/res-auto" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 
<LinearLayout 
android:layout_width="fill_parent" 
android:layout_height="match_parent" 
android:orientation="vertical"> 
    <Button 
     android:layout_width = "wrap_content" 
     android:layout_height = "wrap_content" 
     android:text="&lt;"/> 
    <TextView 
     android:layout_width = "fill_parent" 
     android:layout_height = "wrap_content" 
     android:layout_weight = "1"/> 
    <Button 
     android:layout_width = "wrap_content" 
     android:layout_height = "wrap_content" 
     android:text="&gt;"/> 

</LinearLayout> 

</RelativeLayout>` 
7

使用ConstraintLayout,我發現像

<Button 
    android:id="@+id/left_button" 
    android:layout_width="80dp" 
    android:layout_height="48dp" 
    android:text="&lt;" 
    app:layout_constraintBottom_toBottomOf="parent" 
    app:layout_constraintLeft_toLeftOf="parent" 
    app:layout_constraintTop_toTopOf="parent" /> 

<TextView 
    android:layout_width="0dp" 
    android:layout_height="0dp" 
    app:layout_constraintBottom_toBottomOf="parent" 
    app:layout_constraintLeft_toRightOf="@+id/left_button" 
    app:layout_constraintRight_toLeftOf="@+id/right_button" 
    app:layout_constraintTop_toTopOf="parent" /> 

<Button 
    android:id="@+id/right_button" 
    android:layout_width="80dp" 
    android:layout_height="48dp" 
    android:text="&gt;" 
    app:layout_constraintBottom_toBottomOf="parent" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintTop_toTopOf="parent" /> 

作品。關鍵是適當地設置左,右,上,下緣的限制,那麼寬度和高度設置爲0dp,讓它計算出它自己的尺寸。

+1

剛開始使用ConstraintLayout時,知道當將寬度和高度設置爲「0」時,可以通過約束來確定寬度和高度, 感謝那:) – MQoder 2018-02-28 12:58:44