Responsive Layout

[Black NEXUS]

Hiho Community,

ich habe ein mittelschweres Problem mit der Layout-Gestaltung in Eclipse, es wird auf verschiedenen 10.1" Tablets unterschiedlich dargestellt. Generell ist die Gestaltung von Layouts in Eclipse ein bisschen umständlich, kann mich auch irren, weil ich als Webentwickler mit HTML und CSS "verwöhnt" bin...

Wie auch immer, dass Grundproblem ist, dass ich versuche, ein responsive Layout zu erstellen, dies aber nicht so ganz gelingen möchte. Feste Werte sind genau das Gegenteil von dem, was ich versuche zu erreichen, aber prozentuale Angaben zerhauen mir alles.
Gibt es gute Tutorial für sowas? Ich glaube dann wäre ich nicht der einzige, dem damit geholen wäre :3

Momentan sieht es so aus:

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/GridLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bg_android"
    android:columnCount="2"
    android:orientation="horizontal"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <LinearLayout
        android:layout_width="120dp"
        android:layout_height="match_parent"
        android:layout_gravity="top|left"
        android:gravity="center"
        android:orientation="vertical" >

        <ImageButton
            android:id="@+id/ImageButton26"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            android:background="@drawable/no_card" />

        <ImageButton
            android:id="@+id/ImageButton25"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            android:background="@drawable/no_card" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="700dp"
        android:layout_height="match_parent"
        android:layout_gravity="top|left|center"
        android:gravity="center"
        android:orientation="vertical" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center" >

            <ImageButton
                android:id="@+id/ImageButton27"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton06"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton05"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton04"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton03"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton02"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton01"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton07"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

        </LinearLayout>

        <Space
            android:layout_width="match_parent"
            android:layout_height="10dp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center" >

            <ImageButton
                android:id="@+id/ImageButton18"
                android:layout_width="100dp"
                android:layout_height="160dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton17"
                android:layout_width="100dp"
                android:layout_height="160dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton16"
                android:layout_width="100dp"
                android:layout_height="160dp"
                android:background="@drawable/no_card" />

        </LinearLayout>

        <Space
            android:layout_width="match_parent"
            android:layout_height="10dp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center" >

            <ImageButton
                android:id="@+id/ImageButton21"
                android:layout_width="100dp"
                android:layout_height="160dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton20"
                android:layout_width="100dp"
                android:layout_height="160dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton19"
                android:layout_width="100dp"
                android:layout_height="160dp"
                android:background="@drawable/no_card" />

        </LinearLayout>

        <Space
            android:layout_width="match_parent"
            android:layout_height="10dp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center" >

            <ImageButton
                android:id="@+id/ImageButton15"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton14"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton13"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton12"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton11"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton10"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton09"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

            <ImageButton
                android:id="@+id/ImageButton08"
                android:layout_width="80dp"
                android:layout_height="120dp"
                android:background="@drawable/no_card" />

        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="120dp"
        android:layout_height="match_parent"
        android:layout_column="1"
        android:layout_gravity="top|right"
        android:layout_row="0"
        android:gravity="center"
        android:orientation="vertical" >

        <ImageButton
            android:id="@+id/ImageButton24"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            android:background="@drawable/no_card" />

        <ImageButton
            android:id="@+id/ImageButton23"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            android:background="@drawable/no_card" />

        <ImageButton
            android:id="@+id/ImageButton22"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            android:background="@drawable/no_card" />

    </LinearLayout>

</GridLayout>

Ich kann sagen, im Designer und im Emulator sieht es ok aus, aber auf den Geräten rückt gerade der rechte Bereich entweder in die Mitte oder verschwindet teilweise.
Noch so ein Problem wäre, warum man ca. 10% des linken Randes nicht nutzen kann. Es ist so viel Platz den ich nicht ausnutzen kann, weil ich ihn nicht erreichen kann D:

Falls es hilft, ich verwende MinSDK 14 und möchte dies auf 10.1" Tablets nutzen. Wenn das große Problem gelöst wurde, kann man es auch evtl. für kleinere Auflösungen nutzen, aber dann werden die einzelnen Elemente sicherlich zu klein.

Falls man mit den Fachbegriff nix anfangen kann, hier geht es um ein Layout, was sich der Große des Displayes automatisch anpasst und nicht verrückt

Ich danke jetzt schon mal für hilfreiche Antworten

Gruß
Black NEXUS

 

[derjens]

Zeig doch mal dein XML File.

 

[StefMa]

Vielleicht erstmal ein Tutorial Posten wie man richtig fragen stellt?

 

[derjens]

Wäre auch mal ne Idee.

 

[Black NEXUS]

Vielleicht erstmal ein Tutorial Posten wie man richtig fragen stellt?

Es gibt auch Leute die durch ihre Arbeit ein bisschen unter Druck stehen, aber dennoch auf Hilfe von außerhalb angewiesen sind. Außerdem passiert dies doch sehr oft, dass man mit Informationen geizt, oder?

Zeig doch mal dein XML File.

Erledigt, siehe Startpost

Ich hoffe, dass durch die Überarbeitung ein bisschen mehr Licht ins dunkel fällt. Wenn Fragen offen sind, bin ja anwesend, ist ja nicht so das man immer alles sofort sagen kann, Laien neigen ja dazu hin und wieder Dinge aus zu lassen

Evtl. gibt es auch richtige Designer, welche man verwenden kann, weil es ist teilweise so schwer in Eclipse was zusammenzubasteln, da bei vielen Änderungen an anderer Stelle was zerschossen wird -.-

Und nun lass ihr den Profis das Wort o.o

Gruß
Black NEXUS

 

[ui_3k1]

Wieso machst du es nicht mit einem Relative Layout?
Seitdem ich für "schnelle Sachen" das nutze, habe ich null Probleme und das sogar obwohl ich weitestgehend die grafische Oberfläche benutze und nur selten mal was am Code verändere.

Gibt da ein sehr gutes Tutorial von Video2Brain. Eclipse kommt einem in einigen Fällen schon sehr stark entgegen, wenn man weiß wo man welchen Button hinterlegen soll. (zB "show all Relationships")

Für den Anfang kann ich dir nur empfehlen mit wenigen Elementen zu spielen und zu schauen wie sie sich verändern, dadurch kommt man schon recht schnell dahinter.
Und natürlich nicht dabei vergessen, dass eine "übergeordnete" Einstellung sich auf die darunterliegenden auswirkt und Änderungen ggf. nicht angezeigt bzw. ignoriert werden.

 

[Black NEXUS]

Vererbungen sind mir schon klar, sonst hätte das mit Parent/Child ja keinen Sinn^^

Mit den relative Layouts passiert das was ich meinte mit den verschieben sehr schnell :/ Ob das Übung alleine weg macht^^ Ja mal schauen, Videos sind bei meiner Leitung immer so ne Sache, hätte auch lieber was schriftliches, da kann man schnell immer nachschauen.

 

[ui_3k1]

Hehe, jo habs schon gesehen.. Aber wirklich viel mehr weiß ich auch nicht - bin selbst noch Beginner und hab das bis vor Kurzem immer wieder mal falsch gemacht...

 

[Sentenza]

Wenn du prozentuale Angaben machen willst kannst du das Attribut "weight" verwenden (funktioniert allerdings nur in manchen Layouts, im RelativeLayout zum Beispiel nicht). Wenn du dann zum Beispiel sagst ImageButton1, 2 und 3 haben alle "width=0dp" und "weight=0.1", "weight=0.8", "weight=0.1" dann belegen button 1 und button3 je 10% und button2 nimmt sich 80% (als Beispiel).

// Edit kleines Beispiel

<LinearLayout
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:padding="30dp">

    <ImageButton
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:id="@+id/imageButton"
        android:layout_weight="0.1"
        android:background="#ff4940"/>

    <ImageButton
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:id="@+id/imageButton2"
        android:layout_weight="0.8"
        android:background="#50ff38"/>

    <ImageButton
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:id="@+id/imageButton3"
        android:layout_weight="0.1"
        android:background="#5146ff"/>
</LinearLayout>

 

[StefMa]

Hi,

also zu deinem "Platz" problem:

androidaddingBottom="@dimen/activity_vertical_margin"
androidaddingLeft="@dimen/activity_horizontal_margin"
androidaddingRight="@dimen/activity_horizontal_margin"
androidaddingTop="@dimen/activity_vertical_margin"

Das dort, verscheibt dein komplettes Layout jeweils in die Mitte... Daher hast du auch, je nach Gerät, verschiedene "einrückungen".

Generelln solltest du dir das hier mal durchlesen: Supporting Multiple Screens | Android Developers

Denke dort steht alles drin, was du benötigst.

Gruß

 

[Black NEXUS]

Hi,

also zu deinem "Platz" problem:

Das dort, verscheibt dein komplettes Layout jeweils in die Mitte... Daher hast du auch, je nach Gerät, verschiedene "einrückungen".

Generelln solltest du dir das hier mal durchlesen: Supporting Multiple Screens | Android Developers

Denke dort steht alles drin, was du benötigst.

Gruß

Das sieht sehr gut aus, sogar mit wichtigen Hintergrundinformationen zu den verwendeten Auflösungen

Wenn du prozentuale Angaben machen willst kannst du das Attribut "weight" verwenden (funktioniert allerdings nur in manchen Layouts, im RelativeLayout zum Beispiel nicht). Wenn du dann zum Beispiel sagst ImageButton1, 2 und 3 haben alle "width=0dp" und "weight=0.1", "weight=0.8", "weight=0.1" dann belegen button 1 und button3 je 10% und button2 nimmt sich 80% (als Beispiel).

// Edit kleines Beispiel

<LinearLayout
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:padding="30dp">

    <ImageButton
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:id="@+id/imageButton"
        android:layout_weight="0.1"
        android:background="#ff4940"/>

    <ImageButton
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:id="@+id/imageButton2"
        android:layout_weight="0.8"
        android:background="#50ff38"/>

    <ImageButton
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:id="@+id/imageButton3"
        android:layout_weight="0.1"
        android:background="#5146ff"/>
</LinearLayout>

Wie wirkt sich das auf Höhe und Breite aus? Die Bilder, welche ich verwende haben ja eine gewisse Größe, meist 500x800 um den Dreh rum, aber dies ist definitiv zu groß. Heißt wenn ich 10% nehme, passt sich der ImageButton den Verhältnissen des Parent-Layoutes an, oder tut er dies im Bezug auf die Bildgröße? Ist ja ein Unterschied, wenn es das Bild verzerrt oder ob es verhältnismäßig "passt"

 

[Sentenza]

Mal doch mal eine Skizze wie dein Layout aussehen soll, ich kann es mir im Moment nicht vorstellen ^^

 

[Black NEXUS]

Mal doch mal eine Skizze wie dein Layout aussehen soll, ich kann es mir im Moment nicht vorstellen ^^

Du kannst dir das ungefähre Format des Spielfeldes HIER anschauen.

Muss natürlich angepasst werden, weil man in Android Platz sparen muss und durch Touch sollten die Buttons eine gewisse Größe haben^^

 

[Sentenza]

Die Bilder werden in der Tat verzerrt, du müsstest es halt so einrichten dass das Verhältnis stimmt. Mir schwebte das (ohne jegliche Optimierungen) etwa so vor: wichtig sind die angaben 0dp, weight und weightsum. Der Nachteil wie du schon sagst sind verzerrungen, wenn man die Werte nicht genau einstellt, der Vorteil wäre dass es erstmal auf allen Displays laufen würde, von 2.7" bis 10" (dass man auf den kleinen Geräten dann eine Lupe braucht steht auf einem anderen Blatt ^^).

Ich muss allerdings sagen dass ich auch kein Experte bin sondern nur ein bisschen hobbymäßig an einigen Apps rumwerkle, kann also auch völliger Bullshit sein was ich hier poste.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:background="@drawable/bg_android">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:weightSum="2"
        android:gravity="center_vertical"
        android:padding="5dp"
        android:layout_weight="0.1">

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:id="@+id/imageButton"
            android:layout_weight="0.5"
            android:background="@drawable/no_card"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:id="@+id/imageButton2"
            android:layout_weight="0.5"
            android:background="@drawable/no_card"
            />
    </LinearLayout>

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="0.8">

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="0.2"
            android:weightSum="10">

            <ImageButton
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/imageButton3"
            android:layout_weight="1"
            android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton3"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton3"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton3"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton3"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton3"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton3"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton3"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
        </LinearLayout>

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="0.6"
            android:weightSum="1.2"
            android:gravity="center_vertical">

            <LinearLayout
                android:orientation="horizontal"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="0.5"
                android:gravity="center_horizontal"
                android:weightSum="10">

                <ImageButton
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:id="@+id/imageButton5"
                    android:layout_weight="1"
                    android:background="@drawable/no_card"/>

                <ImageButton
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:id="@+id/imageButton6"
                    android:layout_weight="1"
                    android:background="@drawable/no_card"/>

                <ImageButton
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:id="@+id/imageButton7"
                    android:layout_weight="1"
                    android:background="@drawable/no_card"/>
            </LinearLayout>

            <LinearLayout
                android:orientation="horizontal"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="0.5"
                android:gravity="center_horizontal"
                android:weightSum="10">

                <ImageButton
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:id="@+id/imageButton8"
                    android:layout_weight="1"
                    android:background="@drawable/no_card"/>

                <ImageButton
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:id="@+id/imageButton9"
                    android:layout_weight="1"
                    android:background="@drawable/no_card"/>

                <ImageButton
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:id="@+id/imageButton10"
                    android:layout_weight="1"
                    android:background="@drawable/no_card"/>
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="0.2"
            android:weightSum="10"
            >

            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton4"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton4"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton4"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton4"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton4"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton4"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton4"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
            <ImageButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:id="@+id/imageButton4"
                android:layout_weight="1"
                android:background="@drawable/no_card"/>
        </LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="0.1"
        android:weightSum="2"
        android:gravity="center_vertical"
        android:padding="5dp">

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:id="@+id/imageButton"
            android:layout_weight="0.5"
            android:background="@drawable/no_card"/>

        <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:id="@+id/imageButton2"
        android:layout_weight="0.5"
        android:background="@drawable/no_card"/>
        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:id="@+id/imageButton2"
            android:layout_weight="0.5"
            android:background="@drawable/no_card"/>
    </LinearLayout>

</LinearLayout>

Das problem das verschiedene Displays verschiedene Verhältnisse haben (Galaxy Nexus 720x1280 versus Nexus 7 2012: 800x1280) könntest du eventuell in den Griff bekommen in dem du das ganze Layout noch einmal in einen Container packst und den fest auf ein bestimmtes Verhältnis einstellst, notfalls zur Laufzeit.

 

[amfa]

Gegen die Verzerrung von Bilder könnte aber ein 9-Patch-Image helfen.

Das wird ja automtatisch verlängert/verbreitert ohne Verzerrung mit den Pixeln die man beim erstellen angibt.

 

[Sentenza]

Für manche Elemente wie Hintergründe und Buttons sicherlich, aber soweit ich es sehe geht es hier um ein Trading Card Game, und bei solchen Spielkarten nützt ein 9patch nichts

 

[Black NEXUS]

So, es hat mich ein paar Stunden gekostet, aber nun klappt es. Ist zwar noch nicht zu 100% optimal, aber man kann das Layout nun auch bei Tablets und Smartphones anwenden, ohne das was verschwindet oder sich etwas überlappt :3

<?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:background="@drawable/bg_android"
    android:gravity="center"
    android:orientation="horizontal"
    android:weightSum="10.0" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="vertical"
        android:layout_weight="2.0"
        android:weightSum="10.0" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal"
            android:layout_weight="2.0"
            android:weightSum="10.0" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:gravity="center"
                android:orientation="vertical"
                android:layout_weight="4.0" >

                <ImageButton
                    android:id="@+id/ImageButton01"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />

            </LinearLayout>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal"
            android:layout_weight="2.0"
            android:weightSum="10.0" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:gravity="center"
                android:orientation="vertical"
                android:layout_weight="4.0" >

                <ImageButton
                    android:id="@+id/ImageButton02"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />

            </LinearLayout>

        </LinearLayout>
        
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="vertical"
        android:layout_weight="6.0"
        android:weightSum="10.0" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1.0"
            android:gravity="center"
            android:orientation="horizontal"
            android:weightSum="10.0" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.4"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton15"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.4"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton14"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.4"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton17"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.4"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton16"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.4"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton18"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.4"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton21"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.4"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton20"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.4"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton19"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal"
            android:layout_weight="3.0"
            android:weightSum="10.0" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:gravity="center"
                android:orientation="vertical"
                android:layout_weight="0.8" >

                <ImageButton
                    android:id="@+id/ImageButton06"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:gravity="center"
                android:orientation="vertical"
                android:layout_weight="0.8" >

                <ImageButton
                    android:id="@+id/ImageButton07"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:gravity="center"
                android:orientation="vertical"
                android:layout_weight="0.8" >

                <ImageButton
                    android:id="@+id/ImageButton08"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />

            </LinearLayout>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="3.0"
            android:gravity="center"
            android:orientation="horizontal"
            android:weightSum="10.0" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton10"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton09"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton11"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1.6"
            android:gravity="center"
            android:orientation="horizontal"
            android:weightSum="10.0" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton23"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton25"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton13"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton22"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton12"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton26"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton27"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton24"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>
        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="vertical"
        android:layout_weight="2.0"
        android:weightSum="10.0" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal"
            android:weightSum="10.0"
            android:layout_weight="2.2" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="4.0"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton05"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="2.2"
            android:gravity="center"
            android:orientation="horizontal"
            android:weightSum="10.0" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="4.0"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton04"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="2.2"
            android:gravity="center"
            android:orientation="horizontal"
            android:weightSum="10.0" >

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="4.0"
                android:gravity="center"
                android:orientation="vertical" >

                <ImageButton
                    android:id="@+id/ImageButton03"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/no_card" />
            </LinearLayout>
        </LinearLayout>

    </LinearLayout>

</LinearLayout>

Wichtig sind schon die Gewichtungen, aber das Problem ist, diese gehen primär vom benutzten Layout aus und es gilt nur für eine Ausrichtung! Also muss man mindestens zwei Layouts verschiedener Ausrichtungen um ein Objekt drumherum legen, damit man die Größe automatisch berechnen lassen kann... Ist zwar umständlich, aber es funzt

Bin HIER auf die Erklärung gestoßen. In der Praxis klappt das nicht immer, aber man kann ja testen

Im Anhang habt ihr mal den Vergleich vom Tablet zum Smartphone