Ich versuche, eine Rasteransicht mit zwei Spalten zu erstellen. Ich meine zwei Fotos pro Reihe nebeneinander, genau wie dieses Bild.
Aber meine Bilder haben Leerzeichen dazwischen, weil sie nicht gleich groß sind. Hier ist was ich bekomme.
Wie Sie sehen können, verbirgt das erste Bild die Legende, die den Kontaktnamen und die Telefonnummer anzeigt. und die anderen Bilder sind nicht richtig gedehnt.
Hier ist meine GridView- XML-Datei. Wie Sie sehen können, columnWidth
ist der Wert auf 200 dp eingestellt . Ich möchte, dass es automatisch ist , damit die Größe der Bilder für jede Bildschirmgröße automatisch geändert wird.
<?xml version="1.0" encoding="utf-8"?>
<GridView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gridViewContacts"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="2"
android:columnWidth="200dp"
android:stretchMode="columnWidth"
android:gravity="center" />
und hier ist die Element-XML-Datei, die jedes Element selbst darstellt.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="@+id/imageViewContactIcon"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY" />
<LinearLayout
android:id="@+id/linearlayoutContactName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:background="#99000000"
android:layout_alignBottom="@+id/imageViewContactIcon">
<TextView
android:id="@+id/textViewContactName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:textStyle="bold"
android:textSize="15sp"
android:text="Lorem Ipsum" />
<TextView
android:id="@+id/textViewContactNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:layout_marginLeft="5dp"
android:focusable="true"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:textSize="10sp"
android:text="123456789" />
</LinearLayout>
</RelativeLayout>
Ich möchte also zwei Bilder pro Zeile anzeigen und die Größe der Bilder unabhängig von der Bildschirmgröße automatisch ändern. Was mache ich falsch in meinem Layout?
Vielen Dank.
scaleType
Eigenschaft in der ImageView. Was ich erreichen muss, ist eine Möglichkeit, die Bilder nebeneinander zu erstellen und die Größe automatisch für verschiedene Bildschirmgrößen zu ändern.Antworten:
Hier ist eine relativ einfache Methode, um dies zu tun. Fügen Sie eine GridView in Ihr Layout ein, stellen Sie den Streckmodus so ein, dass die Spaltenbreiten gedehnt werden, setzen Sie den Abstand auf 0 (oder was auch immer Sie wollen) und setzen Sie die Anzahl der Spalten auf 2:
res / layout / main.xml
Erstellen Sie einen benutzerdefinierten Benutzer
ImageView
, der sein Seitenverhältnis beibehält:src / com / example / graphicsstest / SquareImageView.java
Erstellen Sie mit dieser SquareImageView ein Layout für ein Rasterelement und setzen Sie den scaleType auf centerCrop:
res / layout / grid_item.xml
Machen Sie jetzt eine Art Adapter für Ihre
GridView
:src / com / example / graphicsstest / MyAdapter.java
Stellen Sie diesen Adapter auf Folgendes ein
GridView
:Und genießen Sie die Ergebnisse:
quelle
ImageView
und warum Sie so etwas<com.example.graphicstest.SquareImageView>
anstelle eines einfachen<ImageView>
Tags in der XML- Datei verwenden. Können Sie mir mehr über dieses Seitenverhältnis erklären und wie sich das Nichterstellen dieser Klasse auf die Elemente auswirkt? Gibt es eine Möglichkeit, dies zu optimieren, ohne dass die benutzerdefinierteImageView
Klasse erforderlich ist ? Trotzdem danke für deine Hilfe.Ein weiterer einfacher Ansatz mit modernen integrierten Funktionen wie PercentRelativeLayout ist jetzt für neue Benutzer verfügbar, die auf dieses Problem stoßen . Vielen Dank an das Android-Team für die Veröffentlichung dieses Artikels.
und für eine bessere Leistung können Sie einige Dinge wie Picasso Image Loader verwenden, die Ihnen helfen, die gesamte Breite aller Bildeltern zu füllen. In Ihrem Adapter sollten Sie beispielsweise Folgendes verwenden:
Jetzt brauchen Sie keine CustomImageView-Klasse mehr.
PS Ich empfehle, ImageView anstelle von Typ Int in der Klasse Item zu verwenden.
Ich hoffe das hilft..
quelle