Xodera Plugins · Bubble Native
Xodera Photo Editor Native
Maak van een geselecteerde foto een consistente avatar, productafbeelding of rapportbijlage. Snijd bij, roteer en wijzig de grootte, en sla vervolgens de geëxporteerde kopie op in je app.
Public beta guides · Haptics instructions are in its Bubble listing
Public beta offer: free Bubble install · 7-day card trial, then US$1.50/month per plugin/project.
Documentatie beoordeeld 6 november 2026
Praktische voorbeelden
Consistente profielfoto‑avatars vóór upload
Gebruikers moeten kiezen welk deel van hun foto in een vierkante profielfoto verschijnt in plaats van een willekeurige bijsnijding te accepteren.
`source_url = selected profile image`; `crop_aspect = "1:1"`; `document_context = the account’s stable reference`.
Wacht op `source_loaded`; Begin crop → Apply crop, met Rotate of Undo naar behoefte. Bij expliciete opslaan, Export image.
Alleen bij `export_completed`, gebruik `output_uri`, `output_width`, `output_height` en `output_mime` als invoer voor uw bestands‑uploadworkflow. Sla daarna de duurzame referentie op in het profiel.
Als de gebruiker annuleert of `editor_error` wordt geactiveerd, behoud dan de oude avatar. Maak de sessie leeg bij accountwissel zodat een andere gebruiker de concept‑avatar niet kan zien.
Bewerken maakt een lokale kopie. Uw app bepaalt hoe deze wordt opgeslagen of geüpload.
Bereid consistente markt‑ of catalogusfoto’s voor
Verschillende kaders en te grote afbeeldingen maken een catalogus ongelijkmatig en vergroten de uploadgrootte.
`source_url = selected item photo`; `crop_aspect = the app’s chosen ratio`; `export_max_dimension`, `export_format` en `export_quality` komen uit uw uploadbeleid.
Bijsnijd het relevante gebied, eventueel Resize, en vervolgens Export image nadat de gebruiker bevestigt. Bewaar het originele bestand/de referentie apart.
Controleer `output_width`, `output_height`, `output_bytes` en `output_mime` voordat uw uploadworkflow het resultaat opslaat. Bewaar de resulterende afbeeldingsreferentie op het item.
Als export mislukt of het resultaat uw uploadbeleid schendt, toon `error_code` en laat de gebruiker het aanpassen. Overschrijf de vorige item‑afbeelding niet vóór bevestiging van de upload.
Bewerken maakt een lokale kopie. Uw app bepaalt hoe deze wordt opgeslagen of geüpload.
Maak een gerichte afbeeldingskopie voor een veldrapport
Een technicus heeft mogelijk een close‑up van een beschadigd onderdeel nodig, terwijl de originele rapportafbeelding behouden blijft.
`source_url = Current Report Photo’s source`; `document_context = the report/account reference`; bijsnijdverhouding kan onbegrensd blijven.
Begin crop → Apply crop, gebruik vervolgens Undo/Redo om bewerkingen te vergelijken. Export image maakt de bewerkte kopie; uw app vraagt of die kopie aan het Rapport moet worden gekoppeld.
Doe gebruik van `has_changes`, `can_undo`, `can_redo` en `output_uri`. Sla originele en bewerkte referenties op in afzonderlijke app‑velden na een succesvolle upload.
Cancel crop of Reset edits herstelt het bewerkingspad; annulering moet de oorspronkelijke Rapport‑bijlage ongewijzigd laten.
Bewerken maakt een lokale kopie. Uw app bepaalt hoe deze wordt opgeslagen of geüpload.
Wat nu werkt
Public beta. Use the documented controls and actions; test supported formats, permissions and device behavior in your own native app. Browser preview does not validate native device output.
Bouw de workflow
Gebruik de beschikbare bèta-acties hieronder en test het resultaat op uw doelapparaten.
Deze voorbeelden gebruiken app‑records zoals Lesson, Message en Order. Vervang ze door uw eigen gegevenstypen en elementnamen. Voorbeeld‑mediapaden moeten worden vervangen door uw eigen bestanden.
Stel source_url in op de gekozen afbeelding. Gebruik document_context om het account en het te bewerken record te identificeren, zodat het wijzigen van het record de vorige foto wist.
Na source_loaded voer je Begin crop uit. Kies 1:1 voor een avatar, pas het bijsnijden aan en gebruik Apply crop. Cancel crop laat de afbeelding ongewijzigd.
Gebruik Rotate, Flip of Resize indien nodig. Undo en Redo gaan door voltooide bewerkingen; Reset edits herstelt de oorspronkelijke afbeelding.
Voer Export image uit. Bij export_completed, lees output_uri, output_width, output_height en output_mime. Sla die kopie op of upload deze met uw gekozen bestandsopslagworkflow, en bewaar vervolgens het opgeslagen bestand in het record.
Eenmalig configureren
Activatie van een sleutel is gepland voor deze plug‑in. Maak of kies je Bubble‑app‑project in BestPlugins → Dashboard → Plugins. Kies Xodera Photo Editor Native, kopieer de sleutel, open vervolgens Bubble → Plugins → Xodera Photo Editor Native en plak deze in licensing_api_key. Sla één keer op; gebruik daarna de onderstaande acties. Elke plug‑in in elk project heeft zijn eigen sleutel.
Selecteer of maak eerst de afbeelding met je app. Geef de editor het resulterende leesbare afbeeldingsadres. Camera‑ en fotobibliotheek‑machtigingen behoren tot de picker die je gebruikt.
Eenmalig configureren
- Maak of kies uw Bubble app‑project op BestPlugins → Dashboard → Plugins.
- Kies deze plug‑in en kopieer de projectsleutel.
- Open Bubble → Plugins → this plugin. Paste its project key into licensing_api_key and save.
- Voeg het element toe, kies uw app‑gegevens en bouw de workflow hieronder.
- In the dashboard, review and confirm the 7-day card trial for this plugin. It then costs US$1.50/month per app project, including development and production. Cancel before the trial ends to avoid the first charge.
Installatie en abonnement
For Audio Player, Video Player, Photo Editor, Audio Recorder, Files Kit and Haptics: free Bubble installation, a 7-day trial with a card, then US$1.50 per month per plugin and app project. Development and production are included, with no operation cap. File-size and feature limits still apply. Review billing and cancellation before confirming. Other plugins remain unavailable for purchase.
Sla het resultaat op in je app
Sla de geüploade of permanent opgeslagen afbeelding op in Profile.image of uw bijlageveld. output_uri is een tijdelijk bestand op het apparaat, dus sla dat bestand eerst op met uw gekozen workflow. Sla vervolgens output_width, output_height en output_mime op als metadata. Bewaar de originele afbeelding als u beide versies nodig heeft.
Fout, annulering en herstel
Bij source_load_failed of editor_error toon je error_code en bied je Load source aan. Cancel operation stopt met het accepteren van het onafgewerkte resultaat; wacht tot is_busy=no voordat je een andere bewerking start. Clear session wist de editor, niet een afbeelding die elders al is opgeslagen.
Mogelijkheden en limieten
JPEG en PNG export; kwaliteit 0–1; maximale uitvoerzijde 1–4096 pixels. Invoer: tot 15 MiB en 20 megapixels. Tot 20 voltooide bewerkingen. Bijsnijdopties: vrij, 1:1, 4:3, 3:4 en 16:9. Geen ingebouwde camera, filters, tekstoverlays, perspectiefcorrectie, WebP export of automatische upload.
Instellingen, acties en resultaten
Gebruik deze namen in Bubble. Geplande functies worden apart gemarkeerd.
Beschikbare bètainstellingen
Elementinstellingen
source_url · textdocument_context · textis_active · yes_nodisabled · yes_noshow_controls · yes_nocrop_aspect · textexport_format · textexport_quality · numberexport_max_dimension · numberallow_upscale · yes_noui_text_json · textlanguage · textStatussen
editor_status · textis_busy · yes_nohas_image · yes_nohas_changes · yes_nocan_undo · yes_nocan_redo · yes_noimage_width · numberimage_height · numberoutput_uri · textoutput_width · numberoutput_height · numberoutput_bytes · numberoutput_mime · texterror_code · textcrop_active · yes_nocrop_rect_json · textEvenementen
source_loadedsource_load_failededit_appliededit_undoneedit_redoneeditor_resetexport_startedexport_completedoperation_cancellededitor_errorActies en hun invoer
Load sourceBegin cropApply cropCancel cropRotateFlipResizeUndoRedoReset editsExport imageCancel operationClear sessionElementinstellingen · 12
source_urltext · Standaard: ""- Voorbeeldwaarde
https://bestplugins.online/native-samples/avatar.jpg - Voorbeeld Bubble-expressie
Selected Profile's image_url - Adres van het geselecteerde audio‑, video‑ of afbeeldingsbestand. Gebruik een bestandstype dat deze plug‑in ondersteunt.
document_contexttext · Standaard: ""- Voorbeeldwaarde
<current-user-id> - Voorbeeld Bubble-expressie
Current User's unique id - Stabiele waarde voor dit account of record. Gebruik dezelfde waarde bij het herstellen van opgeslagen bestanden of concepten.
is_activeyes_no · Standaard: true- Voorbeeldwaarde
yes - Voorbeeld Bubble-expressie
GuideHost's view_is_active (your yes/no custom state) - Stel ja in zolang dit overzicht geopend is. Stel nee in bij verlaten, zodat afspelen of huidig werk kan stoppen.
disabledyes_no · Standaard: false- Voorbeeldwaarde
no - Voorbeeld Bubble-expressie
GuideHost's is_busy (your yes/no custom state) - Schakel het element uit terwijl uw app bezig is of deze actie niet beschikbaar is.
show_controlsyes_no · Standaard: true- Voorbeeldwaarde
yes - Voorbeeld Bubble-expressie
App Settings' show_editor_controls - Toon of verberg de ingebouwde bedieningselementen.
crop_aspecttext · Standaard: "free"- Voorbeeldwaarde
1:1 - Voorbeeld Bubble-expressie
Avatar Settings' crop_ratio - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
export_formattext · Standaard: "jpeg"- Voorbeeldwaarde
jpeg - Voorbeeld Bubble-expressie
Format Dropdown's value - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
export_qualitynumber · Standaard: 0.85- Voorbeeldwaarde
0.85 - Voorbeeld Bubble-expressie
Image Settings' quality - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
export_max_dimensionnumber · Standaard: 2048- Voorbeeldwaarde
2048 - Voorbeeld Bubble-expressie
Image Settings' max_side - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
allow_upscaleyes_no · Standaard: false- Voorbeeldwaarde
no - Voorbeeld Bubble-expressie
Allow upscale Checkbox is checked - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
ui_text_jsontext · Standaard: ""- Voorbeeldwaarde
{} - Voorbeeld Bubble-expressie
App Settings' player_labels_json (supported keys only) - Optionele JSON met ondersteunde knoplabels. Laat leeg om de ingebouwde tekst te gebruiken.
languagetext · Standaard: "auto"- Voorbeeldwaarde
uk - Voorbeeld Bubble-expressie
Current User's preferred_language - Stel language=auto in om een ondersteund apparaat of browsertaal te volgen. Voer een ondersteunde taalcodes in om deze expliciet te kiezen.
Acties en hun invoer · 13
Load source
Geen actieparameters
Begin crop
Geen actieparameters
Apply crop
origin_xnumber · Standaard: —- Voorbeeldwaarde
0 - Voorbeeld Bubble-expressie
Crop Settings' x (or omit all rectangle inputs) - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
origin_ynumber · Standaard: —- Voorbeeldwaarde
0 - Voorbeeld Bubble-expressie
Crop Settings' y (or omit all rectangle inputs) - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
widthnumber · Standaard: —- Voorbeeldwaarde
512 - Voorbeeld Bubble-expressie
Resize Width Input's value:converted to number - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
heightnumber · Standaard: —- Voorbeeldwaarde
512 - Voorbeeld Bubble-expressie
Resize Height Input's value:converted to number - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
Cancel crop
Geen actieparameters
Rotate
degreesnumber · Standaard: —- Voorbeeldwaarde
90 - Voorbeeld Bubble-expressie
Rotation Dropdown's value - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
Flip
axistext · Standaard: —- Voorbeeldwaarde
horizontal - Voorbeeld Bubble-expressie
Flip Direction Dropdown's value - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
Resize
widthnumber · Standaard: —- Voorbeeldwaarde
512 - Voorbeeld Bubble-expressie
Resize Width Input's value:converted to number - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
heightnumber · Standaard: —- Voorbeeldwaarde
512 - Voorbeeld Bubble-expressie
Resize Height Input's value:converted to number - Gebruik de waarde van het huidige bedrijfsrecord; valideer deze tegen de onderstaande limieten.
Undo
Geen actieparameters
Redo
Geen actieparameters
Reset edits
Geen actieparameters
Export image
Geen actieparameters
Cancel operation
Geen actieparameters
Clear session
Geen actieparameters
Statussen en gebeurtenissen
Statussen
editor_status · textHuidig resultaat van deze actie. Gebruik het bijpassende voltooiings‑event vóór het opslaan van succes.
is_busy · yes_noHet werk is nog bezig. Wacht voordat u een andere actie start.
has_image · yes_noHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
has_changes · yes_noHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
can_undo · yes_noHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
can_redo · yes_noHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
image_width · numberHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
image_height · numberHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
output_uri · textBestandslocatie op dit apparaat. Sla het bestand apart op of upload het als het online bewaard moet blijven.
output_width · numberHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
output_height · numberHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
output_bytes · numberHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
output_mime · textHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
error_code · textFoutinformatie voor de laatste actie. Toon een nuttig bericht en bied de relevante herpoging aan.
crop_active · yes_noHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
crop_rect_json · textHuidige waarde voor het geselecteerde item. Lees deze na het gerelateerde event.
Evenementen
source_loadedWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
source_load_failedWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
edit_appliedWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
edit_undoneWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
edit_redoneWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
editor_resetWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
export_startedWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
export_completedWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
operation_cancelledWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
editor_errorWanneer dit evenement plaatsvindt, lees dan de gerelateerde toestanden van hetzelfde element.
Vragen die ontwikkelaars stellen
Is output_uri een Bubble‑bestand?
Nee. Het is een lokaal cache‑pad. Houd het vast via een bewezen lokale opslaafunctie of uploader voordat u een cloud‑bestandsreferentie opslaat.
Hoe werkt het abonnement?
For Audio Player, Video Player, Photo Editor, Audio Recorder, Files Kit and Haptics: free Bubble installation, a 7-day trial with a card, then US$1.50 per month per plugin and app project. Development and production are included, with no operation cap. File-size and feature limits still apply. Review billing and cancellation before confirming. Other plugins remain unavailable for purchase.
Gerelateerde handleidingen
Voor hulp, vertel ons welke plugin en welk apparaat u gebruikt, welke actie u probeerde en wat er gebeurde. Gebruik een voorbeeld zonder persoonlijke gegevens. Deel nooit uw sleutel of privé‑bestanden.