Unterstützte Projektionscontainer

Wählen Sie das vorhandene DOM-Element, das den vorgesehenen Ort und die Web-Ebene der nativen Fläche belegt. Diese Tabellen gelten für projectionSelector und das an createWebProjectionScope übergebene Element, sowohl für Capacitor als auch für Cordova.

⭕️ bedeutet, dass das Element unter den genannten Bedingungen das projizierte Bild der Engine aufnehmen kann. ❌ bedeutet, dass es kein unterstütztes direktes Ziel ist; wählen Sie stattdessen einen geeigneten umschließenden Container. Dies ist ein Vertrag für die DOM-Darstellung, keine Zusage, dass die Engine das native Bedienelement, die Interaktionen oder Animationen dieser Komponente implementiert. Die Eignung für native Aufnahmen ist eine separate Voraussetzung.

Gemeinsame Anforderungen

• Stellen Sie ein verbundenes HTML-Element mit einer nicht fragmentierten Layoutbox mit einer Größe größer als null bereit. Größe, Platzierung und Ebene liegen bei der Anwendung. Verwenden Sie für Inline-Hosts display: inline-block oder block und geben Sie ihnen die vorgesehenen Abmessungen.
• projectionSelector verwendet CSS-Selektoren des Dokuments (ID, Klasse, Attribut oder Nachfahre). Er muss genau ein Element treffen und dringt nicht in Shadow DOM ein. Ein fehlendes Element kann später erstellt werden; bei keinem oder mehreren Treffern bleibt Native ausgeblendet.
• Das vorgehaltene Bild wird in den offenen ShadowRoot des Elements eingefügt, andernfalls als Kind im Light DOM. Geschlossene Shadow-Inhalte müssen die Sichtbarkeit des Hosts erben und einen Slot bereitstellen, der das Bild anzeigen kann.
• Ein Overlay, eingeklapptes Element oder eine inaktive Seite ist nur geeignet, solange eine sichtbare Layoutbox vorhanden ist. Erzwingen Sie nicht die Darstellung verborgener Konfigurationselemente, nur um sie als Ziele zu nutzen.
• Beschneidung, Deckkraft, Transformationen und Filter des Hosts und seiner Vorfahren beeinflussen das Bild weiterhin. Das Bild ist nicht interaktiv und friert das aufgenommene Erscheinungsbild ein. Siehe Projektionsverhalten für Lebenszyklus, Ausschlüsse bei Mutationsbeobachtern und Grenzen nativer Aufnahmen.

HTML-Container

Ionic-Elemente

Das folgende Inventar umfasst jede Komponente im Ionic-API-Index, mit einer Zeile pro Element. Es wurde gegen @ionic/core 9.0.9 geprüft; ion-icon wird von Ionicons bereitgestellt. Die letzte Tabelle führt die zusätzliche interne Komponente dieser Version separat auf.

Eigene Ionic-Elemente sind nicht die ähnlich benannten HTML-Elemente: ion-select, ion-input, ion-textarea und ion-img können Bildcontainer sein, die HTML-Elemente select, input, textarea und img hingegen nicht. Jedes ⭕️ unten setzt weiterhin die obigen gemeinsamen Layoutbedingungen und den üblichen Ionic-Elternkontext der Komponente voraus.

Schaltflächen und Werkzeugleiste

Formulare und Auswahl

Inhalt und Layout

Karten, Text und Medien

Listen und Gesten

Navigation und Tabs

Overlays, Menüs und FAB

Interne Komponente

Ein nicht unterstütztes Element umschließen

Wählen Sie #seat-projection, nicht das HTML-select:

<span id="seat-projection" style="display: inline-block; width: 12rem; height: 2.75rem">
  <select aria-label="Seat" style="width: 100%; height: 100%">
    <option>Any seat</option>
  </select>
</span>

DOM, Wert und Ereignislistener des Steuerelements bleiben bei der Übergabe erhalten. Natives Verhalten und Wertsynchronisierung liegen weiterhin beim Plugin; das vorbereitete Bild nimmt keine Eingaben an.

Verifikationsumfang

Temporäre Chromium- und WebKit-Prüfungen testen das Ionic-Inventar mit expliziter Layoutbox, erforderlichen Eltern und sichtbaren Zuständen. Ein vorbereitetes einfarbiges Bild prüft Platzierung und sichtbare Pixelabdeckung; die Prüfungen kontrollieren auch den Erhalt von Identität/Werten ursprünglicher Kinder und das Entfernen von Engine-Bildern beim Abbau. Konfigurationselemente werden auf das Fehlen einer darstellbaren Box geprüft. Die refresher-Prüfung wählt dessen aktiven CSS-Zustand; sie validiert die Ziehgeste nicht. Animierte Ladeindikatoren können sich zwischen Vorher-/Nachher-Aufnahmen verändern.

In beiden Browsern hatten alle 90 unterstützten öffentlichen Ionic-Elemente eine gemessene Bildrahmenabweichung von null, vollständige einfarbige Abdeckung im untersuchten Innenbereich, erhaltene ursprüngliche Kinder/Werte und nach der Zerstörung kein verbleibendes Engine-Bild. Die vier öffentlichen Konfigurationselemente hatten keine darstellbare Box. Die interne Komponente wurde ebenfalls geprüft, bleibt aber außerhalb des unterstützten öffentlichen Vertrags. HTML-Prüfungen decken 41 Element-/Layoutkombinationen einschließlich offener und geschlossener Shadow Roots ab.

Dies sind Prüfungen von DOM-Containern, keine Tests nativer Aufnahmen, der SDK-Eignung oder sämtlicher Ionic-Interaktionen. Sie garantieren nicht jedes Theme, jede Implementierung geschlossener Shadow Roots oder jedes Anwendungsstylesheet. Die Prüfungen gehören nicht zur permanenten Testsuite der Bibliothek.