2015-12-11 176 views
0

經過大量搜索線性佈局以及如何使用線性佈局完成位置任務之後,我發現了大量問題,並且流行答案是「使用相對佈局」。瞭解Android線性佈局

我想深入瞭解線性佈局,並且難以找到解決方案,解決了我認爲應該很簡單的任務。另外一個有意義的解決方案似乎很合理。

如果我正在考慮將屏幕作爲一個tic tac toe板,並且想要在每個位置放置一個按鈕,我怎麼可以這樣做而不依賴於上一個按鈕的堆疊或邊距的寬度。

例如,如果我想跳過廣場上的一個點,我跳過的點將保持空白。

{1} {2} {3} 
{4} {5} {6} 
{7} {8} {9} 

從我讀我的XML應該放置我的按鈕1 3 5 7 9 但這不是結局。

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:orientation="vertical" 
    android:id="@+id/myLayout" > 

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

     <Button 
      android:id="@+id/Button1" 
      android:layout_width="100dp" 
      android:layout_height="wrap_content" 
      android:layout_gravity="top|left" 
      android:text="@string/btn1" /> 

     <Button 
      android:id="@+id/Button2" 
      android:layout_width="100dp" 
      android:layout_height="wrap_content" 
      android:layout_gravity="top|right" 
      android:text="@string/btn2" /> 
</LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="match_parent" 
     android:orientation="vertical" > 

     <Button 
      android:id="@+id/Button3" 
      android:layout_width="100dp" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      android:text="@string/btn3" /> 

</LinearLayout> 

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

     <Button 
      android:id="@+id/Button4" 
      android:layout_width="100dp" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom|left" 
      android:text="@string/btn4" /> 

     <Button 
      android:id="@+id/Button5" 
      android:layout_width="100dp" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom|right" 
      android:text="@string/btn5" /> 
    </LinearLayout> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:src="@drawable/background" 
     android:background="@drawable/background"/> 

</LinearLayout> 

我的結果是,

{1} {2} { } 
{ } {5} { } 
{7} {8} { } 

我如此接近擁有下來! (我認爲...)

我錯過了什麼2和8移動到正確的一個空間?我沒有按照指示使用線性佈局嗎?

這是我的目標。

{1} { } {2} 
{ } { } { } 
{ } { } { } 
{ } {3} { } 
{ } { } { } 
{ } { } { } 
{4} { } {5} 
+0

如果你有你爲什麼不使用'RelativeLayout'或'FrameLayout',而不是'LinearLayout'這麼多的水平和垂直的看法? –

+0

因爲我正在嘗試學習如何使用線性佈局。 – wuno

+0

這種佈局會對性能產生影響,因爲計算每個佈局的屏幕密度需要花費一些時間,並且有太多的佈局。更好地嘗試不同的方法學習'LinearLayouts'。 –

回答

1

您之所以沒有得到直接的答案是因爲LinearLayout不是您嘗試做的事情的好方法。

由於您的目標是理解LinearLayout,而不是真正實現最終結果,我會評論一些我注意到的事情。

這裏的一個關鍵點是使用layout_gravity。它不會做你想做的事。在LinearLayout中,layout_gravity一次只能在一個方向上工作。在水平LinearLayout中,layout_gravity僅影響元素的垂直位置,而在垂直LinearLayout中,layout_gravity僅影響元素水平位置的位置。所以你不能製作一個水平的LinearLayout,在其中放置兩個按鈕,並使用layout_gravity使一個留下來,另一個保持正確。

在LinearLayout中,孩子們總是放在一個直接一個(或從左到右或從上到下),它們在XML佈局輸入的順序。那麼你如何創造差距?

有跡象表明,映入腦海的兩個主要途徑:

你可以使用layout_margin。這定義了在特定元素之外留出空間的空間量,如按鈕。所以如果你想在按鈕1和按鈕2之間有100dp的差距,你可以在按鈕1上添加android:layout_marginRight="100dp",或者你可以在按鈕1的右邊添加50dp,按鈕2的左邊添加50dp。

另一種方法是應包括一個寬度爲100dp的空白視圖以離開該空間。 這是你的佈局修正,以反映在實踐中這兩個方法:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="wrap_content" 
android:orientation="vertical" 
android:id="@+id/myLayout" > 

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

    <Button 
     android:id="@+id/Button1" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:text="@string/btn1" 
     android:layout_marginRight="100dp"/> 

    <Button 
     android:id="@+id/Button2" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:text="@string/btn2" /> 
</LinearLayout> 

<LinearLayout 
    android:layout_width="fill_parent" 
    android:layout_height="match_parent" 
    android:orientation="horizontal" > 
    <View 
     android:layout_width="100dp" 
     android:layout_height="0dp"/> 
    <Button 
     android:id="@+id/Button3" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:text="@string/btn3" /> 

</LinearLayout> 

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

    <Button 
     android:id="@+id/Button4" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:text="@string/btn4" /> 
    <View 
     android:layout_width="100dp" 
     android:layout_height="0dp"/> 

    <Button 
     android:id="@+id/Button5" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:text="@string/btn5" /> 
</LinearLayout> 

<ImageView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:src="@drawable/background" 
    android:background="@drawable/background"/> 

</LinearLayout> 

最後,ImageView的。它沒有具體提到,所以我可能是錯誤的,但由於可繪製的名稱是背景,我猜可能它的目的是這些按鈕顯示在ImageView前面。如果是這樣,那麼值得一提的是LinearLayouts 中的孩子不會重疊。該ImageView將始終在按鈕佈局之後。如果您確實需要按鈕後面的背景,您可以通過將android:background="@drawable/background"添加到父LinearLayout的開始標記(雖然它可能會拉伸),或者您可以使用不同類型的佈局來允許向父LinearLayout本身添加背景重疊。

+0

非常感謝您回答我的問題。是的,當我複製它時,我意外地在代碼中留下了背景,但我很高興我確實讓你的解釋讓答案更好。 – wuno

+0

非常好,不客氣。 –

0

對於井字棋,你需要預留空間,每一個按鈕,但文本將有一個X或O或空間。這將解決任何格式問題。

我不清楚你的目標是什麼。

您是否想通過X網格對X進行井字遊戲?如果是這樣,我上面的觀點仍然適用。

+0

請在我的問題底部查看我的目標示例。我希望能夠在線性佈局上定位按鈕右上角左上角中心點左下角右下角 – wuno

0

正如您所知,您可以使用水平和垂直線性佈局。此外,您可以應用佈局權重來製作具有相同大小的佈局以覆蓋整個屏幕。對於這種情況,您可以使用3個垂直線性佈局,全高和相同重量來覆蓋屏幕。然後你可以用完全寬度的按鈕來填充它們的內部,這些按鈕的重量基於你想要的數字。

0

嘗試了這一點爲:

for ur 7 x 3 matrix style button arragement

它的XML:

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 
    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal"> 
     <Button 
      android:layout_width="@dimen/btnwidth" 
      android:layout_height="wrap_content" 
      android:text="{1}" 
      android:layout_weight="1" 
      android:id="@+id/b1" /> 

     <Button 
      android:layout_width="@dimen/btnwidth" 
      android:layout_height="wrap_content" 
      android:text="New Button" 
      android:id="@+id/b2" 
      android:visibility="invisible"/> 

     <Button 
      android:layout_width="@dimen/btnwidth" 
      android:layout_height="wrap_content" 
      android:text="{2}" 
      android:layout_weight="1" 
      android:id="@+id/b3" /> 

    </LinearLayout> 
<LinearLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal"> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:id="@+id/b4" 
     android:visibility="invisible"/> 

    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:visibility="invisible" 
     android:id="@+id/b5" /> 

    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:visibility="invisible" 
     android:id="@+id/b6" /> 

</LinearLayout><LinearLayout 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:orientation="horizontal"> 
<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="New Button" 
    android:visibility="invisible" 
    android:id="@+id/b7" /> 

<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="New Button" 
    android:visibility="invisible" 
    android:id="@+id/b8" /> 

<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="New Button" 
    android:visibility="invisible" 
    android:id="@+id/b9" /> 
</LinearLayout><LinearLayout 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:orientation="horizontal"> 
<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="New Button" 
    android:visibility="invisible" 
    android:id="@+id/b10" /> 
<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="{3}" 
    android:id="@+id/b11" /> 
<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="New Button" 
    android:visibility="invisible" 
    android:id="@+id/b12" /> </LinearLayout> 
<LinearLayout 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:orientation="horizontal"> 
<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="New Button" 
    android:visibility="invisible" 
    android:id="@+id/b13" /> 
<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="New Button" 
    android:clickable="false" 
    android:visibility="invisible" 
    android:id="@+id/b14" /> 
<Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="New Button" 
    android:visibility="invisible" 
    android:id="@+id/b15" /></LinearLayout> 
<LinearLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal"> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:visibility="invisible" 
     android:id="@+id/b16" /> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:visibility="invisible" 
     android:id="@+id/b17" /> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:visibility="invisible" 
     android:id="@+id/b18" /> 
</LinearLayout> 
<LinearLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal"> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="{4}" 
     android:id="@+id/b19" /> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:visibility="invisible" 
     android:id="@+id/b20" /> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="{5}" 
     android:id="@+id/b21" /> </LinearLayout></LinearLayout> 

併爲:

enter image description here

對於它的XML:

<?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"> 
    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal"> 
     <Button 
      android:layout_width="@dimen/btnwidth" 
      android:layout_height="wrap_content" 
      android:text="{1}" 
      android:layout_weight="1" 
      android:id="@+id/b1" /> 
     <android.support.v4.widget.Space 
      android:layout_width="@dimen/btnwidth" 
      android:layout_height="wrap_content" /> 

     <Button 
      android:layout_width="@dimen/btnwidth" 
      android:layout_height="wrap_content" 
      android:text="{2}" 
      android:layout_weight="1" 
      android:id="@+id/b3" /> 
    </LinearLayout> <LinearLayout 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:orientation="horizontal"> 
    <android.support.v4.widget.Space 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" /> 
    <Button 
    android:layout_width="@dimen/btnwidth" 
    android:layout_height="wrap_content" 
    android:text="{3}" 
    android:id="@+id/b11" /> 
    <android.support.v4.widget.Space 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" /> </LinearLayout> 
<LinearLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal"> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="{4}" 
     android:id="@+id/b19" /> 
    <android.support.v4.widget.Space 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" /> 
    <Button 
     android:layout_width="@dimen/btnwidth" 
     android:layout_height="wrap_content" 
     android:text="{5}" 
     android:id="@+id/b21" /> 
</LinearLayout> 

差B/W 1日和2日爲: 在第一次我們使用第二個與invisiblity鍵.. 我們使用空間... 在第1我們cannt使用空間,整條生產線(裝置所有3按鈕不能被空間回報..如果我們這樣做,那麼它將堆疊在頁面末尾與空白sp ..它不會把空間在黑白兩行。