Xodera Plugins · Bubble Native
Xodera Photo Editor Native
Przekształć wybrane zdjęcie w spójny awatar, obraz produktu lub załącznik raportu. Przytnij, obróć i zmień jego rozmiar, a następnie zapisz wyeksportowaną kopię w aplikacji.
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.
Dokumentacja przeglądnięta 6 listopad 2026
Praktyczne przykłady
Spójne awatary profilu przed przesłaniem
Użytkownicy powinni wybrać, która część ich zdjęcia pojawi się w kwadratowym obrazie profilu, zamiast akceptować dowolne przycięcie.
`source_url = selected profile image`; `crop_aspect = "1:1"`; `document_context = the account’s stable reference`.
Poczekaj na `source_loaded`; Begin crop → Apply crop, z Rotate lub Undo w razie potrzeby. Po wyraźnym zapisaniu, Export image.
Tylko na `export_completed` użyj `output_uri`, `output_width`, `output_height` i `output_mime` jako wejść do swojego przepływu przesyłania plików. Następnie zapisz jego trwałe odwołanie w Profilu.
Jeśli użytkownik anuluje lub `editor_error` zostanie wywołany, zachowaj stary awatar. Wyczyść sesję przy zmianie konta, aby inny użytkownik nie mógł zobaczyć wersji roboczej.
Edycja tworzy lokalną kopię. Twoja aplikacja decyduje, jak ją zapisać lub przesłać.
Przygotuj spójne zdjęcia do marketplace lub katalogu
Różne kadrowanie i zbyt duże obrazy powodują nierówną strukturę katalogu i zwiększają rozmiar przesyłanego pliku.
`source_url = selected item photo`; `crop_aspect = the app’s chosen ratio`; `export_max_dimension`, `export_format` i `export_quality` pochodzą z Twojej polityki przesyłania.
Przytnij odpowiedni obszar, opcjonalnie Resize, a następnie Export image po potwierdzeniu przez użytkownika. Zachowaj oryginalny plik/odwołanie osobno.
Sprawdź `output_width`, `output_height`, `output_bytes` i `output_mime` przed zapisaniem wyniku przez Twój proces przesyłania. Przechowaj odniesienie do powstałego obrazu w elemencie Item.
Jeśli eksport się nie powiedzie lub wynik narusza Twoją politykę przesyłania, pokaż `error_code` i pozwól użytkownikowi go poprawić. Nie nadpisuj poprzedniego obrazu elementu Item przed potwierdzeniem przesyłania.
Edycja tworzy lokalną kopię. Twoja aplikacja decyduje, jak ją zapisać lub przesłać.
Utwórz wykadrowaną kopię obrazu do raportu terenowego
Technik może potrzebować zbliżenia jednego uszkodzonego elementu, zachowując jednocześnie oryginalny obraz raportu.
`source_url = Current Report Photo’s source`; `document_context = the report/account reference`; współczynnik przycięcia może pozostać nieograniczony.
Begin crop → Apply crop, a następnie użyj Undo/Redo do porównania edycji. Export image tworzy edytowaną kopię; aplikacja pyta, czy dołączyć tę kopię do Raportu.
Użyj `has_changes`, `can_undo`, `can_redo` i `output_uri`. Przechowaj oryginalne i edytowane odwołania w oddzielnych polach aplikacji po pomyślnym przesłaniu.
Cancel crop lub Reset edits przywraca ścieżkę edycji; anulowanie musi pozostawić oryginalny załącznik Raportu niezmieniony.
Edycja tworzy lokalną kopię. Twoja aplikacja decyduje, jak ją zapisać lub przesłać.
Co działa teraz
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.
Zbuduj przepływ pracy
Użyj dostępnych poniżej akcji beta i przetestuj wynik na docelowych urządzeniach.
Te przykłady używają rekordów aplikacji, takich jak Lesson, Message i Order. Zastąp je własnymi typami danych i nazwami elementów. Przykładowe adresy mediów należy zastąpić własnymi plikami.
Ustaw source_url na wybrany obraz. Użyj document_context do identyfikacji konta i edytowanego rekordu, więc zmiana rekordu usuwa poprzednie zdjęcie.
Po source_loaded uruchom Begin crop. Wybierz 1:1 jako awatar, dostosuj przycięcie i użyj Apply crop. Cancel crop pozostawia obraz niezmieniony.
Użyj Rotate, Flip lub Resize w razie potrzeby. Undo i Redo przechodzą przez zakończone edycje; Reset edits przywraca oryginalny obraz.
Uruchom Export image. Na export_completed odczytaj output_uri, output_width, output_height i output_mime. Zapisz lub prześlij tę kopię przy użyciu wybranego przez Ciebie przepływu zapisu plików, a następnie przechowaj zapisany plik w rekordzie.
Skonfiguruj raz
Aktywacja klucza jest planowana dla tej wtyczki. Utwórz lub wybierz swój projekt aplikacji Bubble w BestPlugins → Dashboard → Plugins. Wybierz Xodera Photo Editor Native, skopiuj jego klucz, a następnie otwórz Bubble → Plugins → Xodera Photo Editor Native i wklej go do licensing_api_key. Zapisz raz; potem użyj poniższych działań. Każda wtyczka w każdym projekcie ma własny klucz.
Najpierw wybierz lub zrób zdjęcie w swojej aplikacji. Podaj edytorowi uzyskany adres czytelnego obrazu. Uprawnienia do kamery i biblioteki zdjęć należą do używanego selektora.
Skonfiguruj raz
- Utwórz lub wybierz swój projekt aplikacji Bubble w BestPlugins → Dashboard → Plugins.
- Wybierz tę wtyczkę i skopiuj jej klucz projektu.
- Open Bubble → Plugins → this plugin. Paste its project key into licensing_api_key and save.
- Dodaj element, wybierz dane aplikacji i zbuduj poniższy przepływ pracy.
- 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.
Instalacja i subskrypcja
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.
Zapisz wynik w swojej aplikacji
Zapisz przesłany lub trwale zapisany obraz w Profile.image lub w swoim polu załącznika. output_uri jest plikiem tymczasowym na urządzeniu, więc najpierw zapisz ten plik wybranym przez siebie przepływem pracy. Następnie przechowaj output_width, output_height i output_mime jako metadane. Zachowaj oryginalny obraz, jeśli potrzebujesz obu wersji.
Błąd, anulowanie i odzyskiwanie
Na source_load_failed lub editor_error wyświetl error_code i zaoferuj Load source. Cancel operation przestaje akceptować nieukończony wynik; poczekaj aż is_busy=no przed rozpoczęciem kolejnej edycji. Clear session czyści edytor, a nie obraz już zapisany w innym miejscu.
Możliwości i ograniczenia
Eksport JPEG i PNG; jakość 0–1; maksymalny wymiar wyjściowy 1–4096 pikseli. Wejście: do 15 MiB i 20 megapikseli. Do 20 zakończonych edycji. Opcje przycinania: dowolne, 1:1, 4:3, 3:4 oraz 16:9. Brak wbudowanej kamery, filtrów, nakładek tekstowych, korekcji perspektywy, eksportu WebP ani automatycznego przesyłania.
Ustawienia, akcje i wyniki
Użyj tych nazw w Bubble. Planowane funkcje są oznaczone osobno.
Dostępne ustawienia beta
Ustawienia elementu
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 · textStany
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 · textZdarzenia
source_loadedsource_load_failededit_appliededit_undoneedit_redoneeditor_resetexport_startedexport_completedoperation_cancellededitor_errorAkcje i ich wejścia
Load sourceBegin cropApply cropCancel cropRotateFlipResizeUndoRedoReset editsExport imageCancel operationClear sessionUstawienia elementu · 12
source_urltext · Domyślne: ""- Przykładowa wartość
https://bestplugins.online/native-samples/avatar.jpg - Przykładowe wyrażenie Bubble
Selected Profile's image_url - Adres wybranego pliku audio, wideo lub obrazu. Użyj typu pliku obsługiwanego przez tę wtyczkę.
document_contexttext · Domyślne: ""- Przykładowa wartość
<current-user-id> - Przykładowe wyrażenie Bubble
Current User's unique id - Stała wartość dla tego konta lub rekordu. Użyj tej samej wartości przy przywracaniu zapisanych plików lub wersji roboczych.
is_activeyes_no · Domyślne: true- Przykładowa wartość
yes - Przykładowe wyrażenie Bubble
GuideHost's view_is_active (your yes/no custom state) - Ustaw tak, gdy ten widok jest otwarty. Ustaw nie przy zamykaniu, aby odtwarzanie lub bieżąca praca mogły się zatrzymać.
disabledyes_no · Domyślne: false- Przykładowa wartość
no - Przykładowe wyrażenie Bubble
GuideHost's is_busy (your yes/no custom state) - Wyłącz element, gdy aplikacja jest zajęta lub akcja jest niedostępna.
show_controlsyes_no · Domyślne: true- Przykładowa wartość
yes - Przykładowe wyrażenie Bubble
App Settings' show_editor_controls - Pokaż lub ukryj wbudowane kontrolki.
crop_aspecttext · Domyślne: "free"- Przykładowa wartość
1:1 - Przykładowe wyrażenie Bubble
Avatar Settings' crop_ratio - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
export_formattext · Domyślne: "jpeg"- Przykładowa wartość
jpeg - Przykładowe wyrażenie Bubble
Format Dropdown's value - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
export_qualitynumber · Domyślne: 0.85- Przykładowa wartość
0.85 - Przykładowe wyrażenie Bubble
Image Settings' quality - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
export_max_dimensionnumber · Domyślne: 2048- Przykładowa wartość
2048 - Przykładowe wyrażenie Bubble
Image Settings' max_side - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
allow_upscaleyes_no · Domyślne: false- Przykładowa wartość
no - Przykładowe wyrażenie Bubble
Allow upscale Checkbox is checked - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
ui_text_jsontext · Domyślne: ""- Przykładowa wartość
{} - Przykładowe wyrażenie Bubble
App Settings' player_labels_json (supported keys only) - Opcjonalny JSON z obsługiwanymi etykietami przycisków. Pozostaw puste, aby użyć wbudowanego tekstu.
languagetext · Domyślne: "auto"- Przykładowa wartość
uk - Przykładowe wyrażenie Bubble
Current User's preferred_language - Ustaw language=auto, aby podążał za obsługiwanym językiem urządzenia lub przeglądarki. Wprowadź obsługiwany kod języka, aby wybrać go explicite.
Akcje i ich wejścia · 13
Load source
Brak parametrów akcji
Begin crop
Brak parametrów akcji
Apply crop
origin_xnumber · Domyślne: —- Przykładowa wartość
0 - Przykładowe wyrażenie Bubble
Crop Settings' x (or omit all rectangle inputs) - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
origin_ynumber · Domyślne: —- Przykładowa wartość
0 - Przykładowe wyrażenie Bubble
Crop Settings' y (or omit all rectangle inputs) - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
widthnumber · Domyślne: —- Przykładowa wartość
512 - Przykładowe wyrażenie Bubble
Resize Width Input's value:converted to number - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
heightnumber · Domyślne: —- Przykładowa wartość
512 - Przykładowe wyrażenie Bubble
Resize Height Input's value:converted to number - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
Cancel crop
Brak parametrów akcji
Rotate
degreesnumber · Domyślne: —- Przykładowa wartość
90 - Przykładowe wyrażenie Bubble
Rotation Dropdown's value - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
Flip
axistext · Domyślne: —- Przykładowa wartość
horizontal - Przykładowe wyrażenie Bubble
Flip Direction Dropdown's value - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
Resize
widthnumber · Domyślne: —- Przykładowa wartość
512 - Przykładowe wyrażenie Bubble
Resize Width Input's value:converted to number - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
heightnumber · Domyślne: —- Przykładowa wartość
512 - Przykładowe wyrażenie Bubble
Resize Height Input's value:converted to number - Użyj wartości bieżącego rekordu biznesowego; zweryfikuj ją względem poniższych limitów.
Undo
Brak parametrów akcji
Redo
Brak parametrów akcji
Reset edits
Brak parametrów akcji
Export image
Brak parametrów akcji
Cancel operation
Brak parametrów akcji
Clear session
Brak parametrów akcji
Stany i zdarzenia
Stany
editor_status · textAktualny wynik tej akcji. Użyj pasującego zdarzenia zakończenia przed zapisaniem sukcesu.
is_busy · yes_noPraca wciąż trwa. Poczekaj przed rozpoczęciem kolejnej akcji.
has_image · yes_noAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
has_changes · yes_noAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
can_undo · yes_noAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
can_redo · yes_noAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
image_width · numberAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
image_height · numberAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
output_uri · textLokalizacja pliku na tym urządzeniu. Zapisz lub prześlij plik osobno, jeśli musi być przechowywany online.
output_width · numberAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
output_height · numberAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
output_bytes · numberAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
output_mime · textAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
error_code · textInformacje o błędzie ostatniej akcji. Wyświetl pomocną wiadomość i zaoferuj odpowiednią ponowną próbę.
crop_active · yes_noAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
crop_rect_json · textAktualna wartość wybranego elementu. Odczytaj ją po powiązanym zdarzeniu.
Zdarzenia
source_loadedGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
source_load_failedGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
edit_appliedGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
edit_undoneGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
edit_redoneGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
editor_resetGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
export_startedGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
export_completedGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
operation_cancelledGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
editor_errorGdy to zdarzenie wystąpi, odczytaj powiązane stany z tego samego elementu.
Pytania, które zadają programiści
Czy output_uri jest plikiem Bubble ?
Nie. To jest lokalna ścieżka pamięci podręcznej. Zachowaj ją przy użyciu sprawdzonego lokalnego zapisywacza lub przesyłacza przed zapisaniem odwołania do pliku w chmurze.
Jak działa subskrypcja?
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.
Powiązane przewodniki
Aby uzyskać pomoc, podaj, której wtyczki i urządzenia używasz, jaką akcję podjąłeś i co się stało. Użyj przykładu bez danych osobowych. Nigdy nie udostępniaj swojego klucza ani prywatnych plików.