2016-04-09 36 views
5

Jestem bardzo nowy nowy do projektowania aplikacji na Androida i próbuję osiągnąć następujący układ przycisków w Android Studio.Android Studio, jak utworzyć 2 kolumnę LinearLayout

[App design[1]

Ive stara się wykorzystać układ liniowy, ale nie mogłem zrobić to dobrze.

<LinearLayout 
    android:orientation="horizontal" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:layout_alignParentTop="true" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="true" 
    android:layout_alignParentRight="true" 
    android:layout_alignParentEnd="true" 
    android:weightSum="1"> 

    <Button 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:id="@+id/button" 
     android:layout_alignParentBottom="true" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentEnd="true" 
     android:background="#016eff" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true" 
     android:layout_margin="10dp" 
     android:textColor="#ffffff" 
     android:layout_weight="0.48" /> 

    <Button 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="New Button" 
     android:id="@+id/button2" 
     android:layout_alignParentBottom="true" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentEnd="true" 
     android:background="#016eff" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true" 
     android:layout_margin="10dp" 
     android:textColor="#ffffff" 
     android:layout_weight="0.48" /> 
</LinearLayout> 

Problem z tym jest, jeśli I dodaje inny przycisk do układu liniowego, a potem po prostu spłaszczony razem, zamiast dodawania przycisku do następnego wiersza.

Czy ktoś może mi pokazać, aby mój LinearLayout miał tylko 2 widżety w każdym wierszu lub dostarczyć inną poprawkę.

Każda pomoc będzie bardzo ceniona dzięki :-)

+1

spróbuj z tablelayout zamiast linelayout – Vishwa

+0

Dobra, chodź i spróbuj tego teraz. –

+0

@Vishwa Wielkie dzięki, udało mi się sprawić, że działa! –

Odpowiedz

8

LinearLayout jest w porządku dla tego, co próbujesz osiągnąć. Proszę spojrzeć na atrybuty wagi i orientacji obiektu LinearLayout. Linear Layout

i co chcesz, możesz to zrobić na przykład tak:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:orientation="vertical" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" 
     android:gravity="center"> 

     <TextView 
      android:text="Whatever You Want Here" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:gravity="center" 
      android:textSize="36sp"/> 
    </LinearLayout> 

    <LinearLayout 
     android:orientation="vertical" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1"> 

     <LinearLayout 
      android:orientation="horizontal" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_weight="1" 
      android:gravity="center"> 

      <Button 
       android:text="Button 1" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:gravity="center"/> 

      <Button 
       android:text="Button 2" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:gravity="center"/> 
     </LinearLayout> 

     <LinearLayout 
      android:orientation="horizontal" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_weight="1" 
      android:gravity="center"> 

      <Button 
       android:text="Button 3" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:gravity="center"/> 

      <Button 
       android:text="Button 4" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:gravity="center"/> 
     </LinearLayout> 

     <LinearLayout 
      android:orientation="horizontal" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_weight="1" 
      android:gravity="center"> 

      <Button 
       android:text="Button 5" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:gravity="center"/> 

      <Button 
       android:text="Button 6" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:gravity="center"/> 
     </LinearLayout> 

     <LinearLayout 
      android:orientation="horizontal" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_weight="1" 
      android:gravity="center"> 

      <Button 
       android:text="Button 7" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:gravity="center"/> 

      <Button 
       android:text="Button 8" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:gravity="center"/> 
     </LinearLayout> 
    </LinearLayout> 
</LinearLayout> 

wyjściowa:

Linear Layout 2 Columns

I uważaj, bo gniazdowania zbyt wiele wagi atrybutów może mieć jakiś negatywny problemy z wydajnością.

1

Alright facetów, udało mi się znaleźć poprawkę dzięki za komentarz Vishwa. Jednak tak naprawdę nie znalazłem sposobu, aby LinearLayout miał 2 kolumny.

Zamiast tego zmieniłem na TableLayout i streściłem kolumnę 0 & 1, aby wyświetlić cały ekran. Oto jak wyglądało moje XML. (Ma dodatkowych rzeczy w to, aby mój projekt)

<TableLayout 
    android:layout_width="wrap_content" 
    android:layout_height="match_parent" 
    android:layout_alignParentRight="true" 
    android:layout_alignParentEnd="true" 
    android:stretchColumns="0,1"> 

    <TableRow 
     android:layout_width="match_parent" 
     android:paddingBottom="8dp" 
     android:layout_height="match_parent"> 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Events" 
      android:id="@+id/eventButton" 
      android:layout_column="0" 
      android:background="#016eff" 
      android:layout_marginRight="8dp" 
      android:textColor="#ffffff" 
      android:textStyle="normal" 
      android:textSize="40px" /> 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Absentee" 
      android:id="@+id/absenteeButton" 
      android:layout_column="1" 
      android:background="#016eff" 
      android:textColor="#ffffff" 
      android:textStyle="normal" 
      android:textSize="40px" /> 

    </TableRow> 

    <TableRow 
     android:layout_width="match_parent" 
     android:paddingBottom="8dp" 
     android:layout_height="match_parent" > 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Contacts" 
      android:id="@+id/contactsButton" 
      android:layout_column="0" 
      android:background="#016eff" 
      android:layout_marginRight="8dp" 
      android:textColor="#ffffff" 
      android:textStyle="normal" 
      android:textSize="40px" /> 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Alerts" 
      android:id="@+id/alertButton" 
      android:layout_column="1" 
      android:background="#016eff" 
      android:textColor="#ffffff" 
      android:textStyle="normal" 
      android:textSize="40px" /> 
    </TableRow> 

    <TableRow 
     android:layout_width="match_parent" 
     android:paddingBottom="8dp" 
     android:layout_height="match_parent" > 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Links" 
      android:id="@+id/linksButton" 
      android:layout_column="0" 
      android:background="#016eff" 
      android:layout_marginRight="8dp" 
      android:textColor="#ffffff" 
      android:textStyle="normal" 
      android:textSize="40px" /> 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Newsletter" 
      android:id="@+id/newsletterButton" 
      android:layout_column="1" 
      android:background="#016eff" 
      android:textColor="#ffffff" 
      android:textSize="40px" 
      android:textStyle="normal" /> 
    </TableRow> 

    <TableRow 
     android:layout_width="match_parent" 
     android:paddingBottom="8dp" 
     android:layout_height="match_parent" > 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Kamar" 
      android:id="@+id/kamarButton" 
      android:layout_column="0" 
      android:background="#016eff" 
      android:layout_marginRight="8dp" 
      android:textColor="#ffffff" 
      android:textStyle="normal" 
      android:textSize="40px" /> 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="News" 
      android:id="@+id/newsButton" 
      android:layout_column="1" 
      android:background="#016eff" 
      android:textColor="#ffffff" 
      android:textSize="40px" 
      android:textStyle="normal" /> 
    </TableRow> 

</TableLayout> 
1

po prostu umieścić oddzielny LinearLayout z android:orientation="horizontal" wokół każdej pary przycisków. Wtedy rodzic LinearLayaout powinien mieć android:orientation="vertical", a waga powinna znajdować się w każdym poziomym LinearLayout.

+0

Dzięki za pomoc, dobrze jest mieć wiele rozwiązań problemu. –

+1

Używanie zagnieżdżonych linii LinearLayouts zapewnia większą elastyczność niż TableLayout, np. Gdy potrzebujesz jednego wiersza przycisków, aby inaczej wyrównać linie, lub jednego wiersza z inną liczbą układów. – Christine