2016-04-05 3 views
1

Ich habe vier Elemente in einem linearen Layout.Ausrichten von Elementen in einem LinearLayout, das den halben Bildschirmplatz einnimmt

Ich möchte sie so ausrichten, dass classALabel & classBLabel nebeneinander nebeneinander die halbe Breite des Bildschirms ausgerichtet sind.

Und classA & classB auch direkt neben einander Seite an Seite unter Halb halbe Breite des Bildschirms, aber unterhalb classALabel & classBLabel ausgerichtet sind.

Unten ist, was ich bisher versucht habe, aber das funktioniert nicht so, wie ich will. Es zeigt nur alle vier Elemente nebeneinander, die jeweils 25% Platz auf dem Bildschirm geben.

<LinearLayout 
    android:id="@+id/ClassALayout" 
    android:layout_width="match_parent" 
    android:layout_height="@dimen/tile_height" 
    android:layout_below="@+id/ClassLayout" 
    android:layout_marginBottom="8dp" 
    android:layout_marginTop="8dp" 
    android:orientation="horizontal"> 

    <TextView 
     android:id="@+id/classALabel" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:text="@string/classALabel" /> 

    <TextView 
     android:id="@+id/classA" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/classALabel" 
     android:layout_marginTop="@dimen/dimen_2" 
     android:layout_alignParentLeft="true" 
     android:layout_weight="1" 
/> 

    <TextView 
     android:id="@+id/classBLabel" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/classA" 
     android:layout_weight="1" 
     android:text="@string/classBLabel" /> 

    <TextView 
     android:id="@+id/classB" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/classBLabel" 
     android:layout_marginTop="@dimen/dimen_2" 
     android:layout_weight="1" 
/> 
</LinearLayout> 

Antwort

1

Das passiert, weil Sie nur ein LinearLayout mit horizontaler Ausrichtung erstellt haben. Alle Ansichten, die Sie in dieses Layout einfügen, befinden sich in derselben Zeile.

Alles, was Sie tun müssen, ist ein übergeordnetes Layout zu erstellen, es könnte ein lineares Layout mit vertikaler Ausrichtung sein und innerhalb dieses Layouts zwei separate lineare Layouts mit horizontaler Ausrichtung erstellen und jeweils zwei Textansichten einfügen.

2

Ich denke, die beste Lösung für Sie diese

<TableLayout 
android:id="@+id/ClassALayout" 
android:layout_width="match_parent" 
android:layout_height="@dimen/tile_height" 
android:layout_below="@+id/ClassLayout" 
android:layout_marginBottom="8dp" 
android:layout_marginTop="8dp" 
> 
<TableRow 
    android:layout_width="match_parent" 
    android:layout_height="0dp" 
    android:layout_weight="1"> 

<TextView 
    android:id="@+id/classALabel" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_weight="1" 
    android:text="@string/classALabel" /> 

<TextView 
    android:id="@+id/classA" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_marginTop="@dimen/dimen_2" 
    android:layout_weight="1" 
    /> 
</TableRow> 
<TableRow 
android:layout_width="match_parent" 
android:layout_height="0dp" 
android:layout_weight="1"> 
<TextView 
    android:id="@+id/classBLabel" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_weight="1" 
    android:text="@string/classBLabel" /> 

<TextView 
    android:id="@+id/classB" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_marginTop="@dimen/dimen_2" 
    android:layout_weight="1" 
    /> 
</TableRow> 

ist oder wenn Sie wirklich ein LinearLayout Sie verwenden möchten, müssen ein Elternteil LinearLayout mit android:orientation="vertical" mit 2 Kind linearen Layout mit android:orientation="horizontal" verwenden, aber Beachten Sie, dass je mehr untergeordnete Layouts Sie mit relativen Größen haben (dh die Verwendung von android:layout_weight), desto mehr Belastung für das System.

Oder könnten Sie eine relative Layout verwenden, aber Sie können nicht android:layout_weight

1

verwenden, was geschieht, weil Sie alle Ihre Ansichten in ein einziges lineares Layout mit horizontaler Ausrichtung gesetzt worden. Da es 4 Ansichten mit Gewicht = 1 gibt, ist der Bildschirm in 4 gleiche Teile unterteilt.

Der folgende Code sollte Ihnen helfen zu erreichen, was Sie wollen.

Das lineare Layout von ClassALayout ist das übergeordnete Layout, das außerdem zwei untergeordnete lineare Layouts enthält: LabelContainer Linear Layout und ClassContainer Linear Layout. Das ClassContainer-Layout befindet sich unterhalb des LabelContainer-Layouts, da das übergeordnete Layout vertikal ausgerichtet ist. Beide untergeordneten Layouts enthalten 2 Textansichten. Die Label-Textansichten liegen oberhalb der Klassen-Textansichten und alle von ihnen belegen 50% des Bildschirmplatzes.

<LinearLayout     
android:id="@+id/ClassALayout" 
android:layout_width="match_parent" 
android:layout_height="@dimen/tile_height" 
android:layout_below="@+id/ClassLayout" 
android:layout_marginBottom="8dp" 
android:layout_marginTop="8dp" 
android:orientation="vertical"> 

<LinearLayout 
android:id="@+id/LabelContainer" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:orientation="horizontal"> 

<TextView 
    android:id="@+id/classALabel" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_weight="1" 
    android:text="@string/classALabel" /> 

<TextView 
    android:id="@+id/classBLabel" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_weight="1" 
    android:text="@string/classBLabel" /> 


</LinearLayout> 

<LinearLayout 
android:id="@+id/ClassContainer" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:orientation="horizontal"> 

<TextView 
    android:id="@+id/classA" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_marginTop="@dimen/dimen_2" 
    android:layout_weight="1"/> 

<TextView 
    android:id="@+id/classB" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_marginTop="@dimen/dimen_2" 
    android:layout_weight="1"/> 

</LinearLayout> 
</LinearLayout> 
0

Es ist eine schnelle und schmutzige Lösung, aber es wird dir geben, was Sie wollen:

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

    <LinearLayout 
     android:orientation="horizontal" 
     android:layout_weight="1" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 
    </LinearLayout> 

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

     <TextView 
      android:id="@+id/classALabel" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.5" 
      android:text="classALabel" /> 

     <TextView 
      android:id="@+id/classBLabel" 
      android:layout_width="match_parent" 
      android:layout_weight="0.5" 
      android:layout_height="wrap_content" 
      android:text="ClassBLabel" /> 
    </LinearLayout> 
</LinearLayout> 

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

    <LinearLayout 
     android:orientation="horizontal" 
     android:layout_weight="1" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 
    </LinearLayout> 

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

     <TextView 
      android:id="@+id/classA" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="10dp" 
      android:text="ClassA" 
      android:layout_weight="1" 
      /> 

     <TextView 
      android:id="@+id/classB" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="10dp" 
      android:layout_weight="1" 
      android:text="ClassB" 
      /> 

    </LinearLayout> 

</LinearLayout> 

Hier ist der Ausgang:

enter image description here

Hälfte der ScreenSize.

Verwandte Themen