Überlappende Ansichten in Android


75

Ist es möglich, überlappende Ansichten in Android zu haben? Ich hätte gerne eine ImageView mit einem transparenten PNG vorne und einer anderen Ansicht im Hintergrund.

bearbeiten:

Dies ist, was ich im Moment habe, das Problem ist, dass das Bild in der Bildansicht nicht transparent ist, die Teile, die transparent sein sollten, sind nur schwarz.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/gallerylayout"
>
<Gallery android:id="@+id/overview"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    />

 <ImageView android:id="@+id/navigmaske"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:src="@drawable/navigmask"
    /> 

</RelativeLayout>

bearbeiten:

Ich habe es zum Laufen gebracht, es war eine Themendatei von einem anderen Programmierer im Team. Hab das gerade geändert

<item name="android:background">#FF000000</item>

dazu

<item name="android:background">#00000000</item>

Was Sie haben, sollte funktionieren - Sind Sie sicher, dass die Galerie sichtbare Inhalte hat und dass das navigierbare Navigationselement ein PNG mit Transparenz ist?
Reto Meier

Ja, die Galerie ist ohne Overlay sichtbar und ich bin sicher, dass das PNG transparent ist
Alexander Stolz

Antworten:


71

Android behandelt die Transparenz über Ansichten und Zeichnungen (einschließlich PNG-Bilder) nativ, sodass das von Ihnen beschriebene Szenario (teilweise transparent ImageViewvor a Gallery) durchaus möglich ist.

Wenn Sie Probleme haben, hängt dies möglicherweise entweder mit dem Layout oder Ihrem Bild zusammen. Ich habe das von Ihnen beschriebene Layout repliziert und den gewünschten Effekt erfolgreich erzielt. Hier ist das genaue Layout, das ich verwendet habe.

<RelativeLayout 
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/gallerylayout"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
  <Gallery
    android:id="@+id/overview"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
  />
  <ImageView
    android:id="@+id/navigmaske"
    android:background="#0000"      
    android:src="@drawable/navigmask"
    android:scaleType="fitXY"
    android:layout_alignTop="@id/overview"
    android:layout_alignBottom="@id/overview"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
  />
</RelativeLayout>

Beachten Sie, dass ich das übergeordnete Element RelativeLayoutauf eine Höhe und Breite geändert habe, fill_parentwie es im Allgemeinen für eine Hauptaktivität gewünscht wird. Dann habe ich die Ober- und Unterseite ImageViewder oben und unten ausgerichtet, Galleryum sicherzustellen, dass sie davor zentriert ist.

Ich habe auch den Hintergrund des explizit so eingestellt ImageView, dass er transparent ist.

Wenn Sie die PNG-Datei an einem für mich sichtbaren Ort ablegen, kann ich sie in meinem Projekt verwenden und prüfen, ob sie dafür verantwortlich ist.


Nett! Ich habe versucht, einen ImageView-Hintergrund auf # 0000 (und @android: color / transparent) zu setzen ... ohne Erfolg. Wenn ich versuche, es auszublenden (Alpha von 1,0 bis 0,0), wird es schwarz, anstatt transparent. Dies ist auf Android 2.0.
Joe D'Andrea

3
Aha! Ich habe LinearLayout verwendet. Ich habe es in Relativ geändert und dann die ImageView als letztes eingefügt. Jetzt funktioniert die Überblendung "einfach" ... yay! Vielen Dank für den Code / Tipp. Das hat mich auf meinen Trottel hingewiesen.
Joe D'Andrea

2
Hallo, ich verwende die gleiche XML-Layout-Codierung, aber mein transparentes Bild wird nicht angezeigt. Es wird nur ein schwarzer Bildschirm angezeigt. Alles, was ich in meinen Code einfügen möchte.
David

In Anbetracht der Funktionalität würde ich sagen, FrameLayoutdass für solche Zwecke generell bevorzugt werden sollte, um den viel geringeren Layout-Overhead zu gewährleisten. Für API <11 kann FrameLayout die oben genannte Kombination der Weitergabe der Größe des zweiten Kindes an das erste Kind jedoch nicht korrekt verarbeiten. RelativeLayoutDies ist in diesem Fall Ihre einzige Option. siehe hier .
Klassenstapler

9

Schauen Sie sich auch an FrameLayout, wie die Galerie-Anwendung der Kamera die Überlagerung der Zoom-Schaltflächen implementiert.


1
Ich bin immer gegangen, für FrameLayoutdie ich für solche Zwecke perfekt finde. Ich habe jedoch erst jetzt herausgefunden, dass vor API 11 FrameLayoutdie maximal gemessene Höhe nicht an alle untergeordneten Elemente weitergegeben werden kann ( siehe hier) . Daher muss man für die Unterstützung von Android 2 verwenden, es RelativeLayoutsei denn, man wählt eine vorgegebene Höhe.
Klasse Stapler

7

Wenn Sie Ihrem Layout einen benutzerdefinierten Überlagerungsbildschirm hinzufügen möchten, können Sie ein benutzerdefiniertes lineares Layout erstellen und die Steuerung von Zeichnungen und Schlüsselereignissen erhalten. Sie können mein Tutorial- Overlay auf Android Layout- http://prasanta-paul.blogspot.com/2010/08/overlay-on-android-layout.html


Sicherlich ein schönes Experiment, danke, dass Sie den Code geteilt haben. Dies kann jedoch einfach erreicht werden, es FrameLayoutsei denn, Ihr spezifisches Szenario ist von einem Fehler vor API 11 betroffen ( siehe hier) . In diesem Fall können Sie es weiterhin verwenden RelativeLayout.
Klassenstapler

1

Die sichtbare Galerie ändert die Sichtbarkeit. Auf diese Weise erhalten Sie die Galerie über andere Ansichtsüberlappungen. Die Home-Beispiel-App bietet einige gute Beispiele für diese Technik.


0

Die einfache Möglichkeit besteht darin, einen Rand von -40 dp am unteren Rand der oberen Bildansicht zu platzieren


-2

Ja das ist möglich Die Herausforderung besteht jedoch darin, das Layout richtig zu gestalten. Der einfachste Weg, dies zu tun, wäre, ein AbsoluteLayout zu haben und dann die beiden Bilder dort zu platzieren, wo Sie sie haben möchten. Sie müssen nichts Besonderes für das transparente PNG tun, außer es später zum Layout hinzuzufügen.


16
AbsoluteLayout wird jetzt abgeschrieben. Niemand sollte es mehr benutzen.
Nummer 1
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.