View an kleinere Screens anpassen

  • 9 Antworten
  • Letztes Antwortdatum
H

Hoerti

Neues Mitglied
1
Hallo zusammen,

bräuchte bitte dringend eure Hilfe, bin grad am verzweifeln. Und zwar hab ich eine App entwickelt in der 24 Buttons in einem TableLayout aufgegliedert sind, sprich 6 Reihen und je 4 Spalten. Diese Buttons schalten sich abwechselnd visible und unvisible.

Ich hab das ganze auf meinem 5'' Smartphone entwickelt und blödsinnigerweise erst jetzt, nach Fertigstellung, auf einem kleineren Display getestet.

Hier mal mein xml File:

Code:
<FrameLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" 
    
    
    android:background="@drawable/bg">



<TableLayout
  
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >
        
        <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/willi"
        />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
		android:layout_marginLeft="70dp"
        
      
        android:background="@drawable/willi"
         />

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
	android:layout_marginLeft="140dp"
        android:background="@drawable/willi"
/>
    
    <Button
        android:id="@+id/button4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
	android:layout_marginLeft="210dp"

        android:background="@drawable/willi"
         />
        
        
    </TableRow>
    
    
    <TableRow
        android:id="@+id/tableRow2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_marginTop="90dp">
    
        
        
         <Button
        android:id="@+id/button5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi"
        />
    
    <Button
        android:id="@+id/button6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
		android:layout_marginLeft="70dp"
        android:background="@drawable/willi"
   />

    <Button
        android:id="@+id/button7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
		android:layout_marginLeft="140dp"
        android:background="@drawable/willi"
         />

    <Button
        android:id="@+id/button8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
		android:layout_marginLeft="210dp"
        android:background="@drawable/willi"
         />
        
        </TableRow>
       <TableRow
        android:id="@+id/tableRow3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="90dp" >
    
    
       <Button
        android:id="@+id/button9"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi" />
    <Button
        
        android:id="@+id/button10"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="70dp"
        android:background="@drawable/willi"  />

    <Button
        android:id="@+id/button11"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="140dp"
        android:background="@drawable/willi"  />

    <Button
        android:id="@+id/button12"
        android:layout_marginLeft="210dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi" />

	</TableRow>



              <TableRow
        android:id="@+id/tableRow4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="90dp" >
    
    
       <Button
        android:id="@+id/button13"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi" />
    <Button
        
        android:id="@+id/button14"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="70dp"
        android:background="@drawable/willi"  />

    <Button
        android:id="@+id/button15"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="140dp"
        android:background="@drawable/willi"  />

    <Button
        android:id="@+id/button16"
        android:layout_marginLeft="210dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi" />

	</TableRow>
	
      <TableRow
        android:id="@+id/tableRow5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="90dp" >
    
    
       <Button
        android:id="@+id/button17"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi" />
    <Button
        
        android:id="@+id/button18"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="70dp"
        android:background="@drawable/willi"  />

    <Button
        android:id="@+id/button19"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="140dp"
        android:background="@drawable/willi"  />

    <Button
        android:id="@+id/button20"
        android:layout_marginLeft="210dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi" />

	</TableRow>
	
    <TableRow
        android:id="@+id/tableRow6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="90dp" >
    
    
       <Button
        android:id="@+id/button21"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi" />
    <Button
        
        android:id="@+id/button22"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="70dp"
        android:background="@drawable/willi"  />

    <Button
        android:id="@+id/button23"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="140dp"
        android:background="@drawable/willi"  />

    <Button
        android:id="@+id/button24"
        android:layout_marginLeft="210dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:background="@drawable/willi" />


	</TableRow>
    
    </TableLayout>
    
<TextView
        android:id="@+id/tvPunktewaehrend"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:textStyle="bold"
        android:layout_gravity="center_horizontal"
        android:textColor="@color/white"
        android:textSize="20sp"
        android:text=" " />


</FrameLayout>

Mein Problem ist, dass die Buttons in der 5 Tabellenreihe "zusammengequetscht" sind und die Buttons in der unteren Tabellenreihe leider garnicht angezeigt werden. Normalerweise sollte das ja über die Verwendung von dp angepasst werden?!
Habe auch schon versucht die Grafik, die für die ImageButtons bereitsgestellt wird, in verschiedenen Auflösungen in den jeweiligen Ordnern abzulegen, leider ohne Erfolg.

Gibt es eine Lösung für mein Problem? Wäre über jede Hilfe sehr sehr dankbar!
 
Du verwendest bei den Buttons beide male wrap_content. Dadurch nimmt er sich so viel platz wie er braucht. Da du dadrauf ein Drawable legst, passt sich dein Button dadran an. Wenn du in layout_width und layout_height dp's benutzt wird es gehen
 
Ok danke schonmal für die Antwort. Was meinst du denn mit "beide Male bei den Buttons"? Ich nehme an das muss ich dann für alle 24 Buttons so verwenden oder?
 
Mit dem beide male meinte ich nur
Code:
android:layout_width
android:layout_height

Das musst du dann bei allen buttons auf einen Dp Wert setzten
 
Ok, hab das ganze jetzt getestet und scheint auch so zu passen. Problem: Sowohl am Wildfire als auch am Nexus sind die Buttons jetzt so minifuziklein, dass der User sie kaum mehr erwischen wird.

Gibts hierzu keine andere Lösung?
 
Wenn du Screenshots mal hochladen würdest, da könnte man sich mal ein Bild machen. Ich persönlich find die riesen Margins irgendwie seltsam/too much, aber wie gesagt, ein Screenshot sagt mehr als 1000 Worte...
 
Ok, das ganze sieht wiefolgt aus:

Bild 1 zeigt, wie es sein sollte. Sprich das der Button mit dem Kamel wird ganz normal angezeigt, auf Bild 2 sieht man jedoch einen der 4 Buttons aus TableRow4, diesen sieht man nur teilweise. Die Buttons aus TableRow5 werden garnicht angezeigt.

Kannst du mir da weiterhelfen was ich falsch mache?
 

Anhänge

  • IMG_20140208_152044.jpg
    IMG_20140208_152044.jpg
    795,1 KB · Aufrufe: 231
  • IMG_20140208_152048.jpg
    IMG_20140208_152048.jpg
    2,7 KB · Aufrufe: 223
So, ich hab das ganze jetzt noch einmal nachgestellt und mir ein neues Layout zum testen erstellt:

Code:
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:stretchColumns="0,1,2,3,4"
    

    tools:context=".Test" >

    <TableRow 
        android:gravity="center"
        android:paddingTop="22dp"
        android:layout_height="fill_parent">
        
        <Button
            android:text="1" 
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="2"
            android:layout_marginLeft="10dp" 
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="3" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="4" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
        
        
    </TableRow>
        <TableRow 
        android:gravity="center"
        android:layout_height="fill_parent"
       >
        
        <Button
            android:text="1" 
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="2"
            android:layout_marginLeft="10dp" 
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="3" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="4" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
        
        
    </TableRow>
        <TableRow 
        android:gravity="center"
        android:layout_height="fill_parent"
        >
        
        <Button
            android:text="1"
             android:background="@drawable/willi"
            > 
            </Button>
                    <Button
            android:text="2" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="3"
            android:layout_marginLeft="10dp" 
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="4" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
        
        
    </TableRow>
        <TableRow 
        android:gravity="center"
        android:layout_height="fill_parent"
       >
        
        <Button
            android:text="1" 
             android:background="@drawable/willi"
            > 
            </Button>
                    <Button
            android:text="2" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
                    <Button
                        
            android:text="3" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="4" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
        
        
    </TableRow>
        <TableRow 
        android:gravity="center"
        android:layout_height="fill_parent"
       >
        
        <Button
            android:text="1" 
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="2" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="3" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
                    <Button
            android:text="4" 
            android:layout_marginLeft="10dp"
             android:background="@drawable/willi"> 
            </Button>
        
        
    </TableRow>
</TableLayout>

Bild1 zeigt die Anordnung auf einem 5'' Bildschirm, Bild2 auf dem HTC Wildfire.
Wie schaffe ich es jetzt noch dass die Kamele auf dem 5'' Bildschirm auch den ganzen Screen einnehmen und nicht so zusammengequetscht bleiben?
 

Anhänge

  • Screenshot_2014-02-08-16-34-11.png
    Screenshot_2014-02-08-16-34-11.png
    91,2 KB · Aufrufe: 204
  • IMG_20140208_163420[1].jpg
    IMG_20140208_163420[1].jpg
    2,2 KB · Aufrufe: 230
Gib jeder Tablerow noch das Attribut: "android:layout_weight="1""
 
  • Danke
Reaktionen: Hoerti
Perfekt das wars - dankeschön!!
 
Zurück
Oben Unten