Interface Audio Player com um título de exemplo.

Xodera Plugins · Bubble Native

Xodera Audio Player Native

Adicione um reprodutor de áudio claro a lições, mensagens de voz ou registros de produtos. Permita que as pessoas ouçam, alterem a velocidade e continuem a partir do ponto salvo.

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.

Crie o fluxo de trabalho ↓Configurações do plugin ↗Native Lab

Documentação revisada 6 novembro 2026

Exemplos práticos

Notas de voz dentro de uma conversa de suporte

Um link de arquivo simples afasta os usuários da conversa e dificulta a revisão de respostas longas.

`source_url = Selected Message’s audio URL`; `title = Selected Message’s sender label`; `subtitle = Selected Message’s timestamp`.

Coloque o player no detalhe da mensagem selecionada. Permita que o usuário Play/Pause, Seek até um ponto útil e Set speed. Vincule `is_active` à conversa aberta.

Use `is_playing`, `current_time` e `duration` para mostrar o progresso. Mantenha o ID Message no seu aplicativo para que um evento tardio não possa atualizar uma conversa diferente.

Em `player_error`, mostre `error_code` e ofereça Reload source; preserve a mensagem e nunca a marque como ouvida após um erro.

Somente reprodução. Seu aplicativo salva o progresso de escuta.

Retome uma lição de idioma na posição salva

Os alunos precisam reproduzir uma passagem difícil em vez de reiniciar toda a lição.

`source_url = Current Lesson’s audio URL`; `title = Current Lesson’s name`; a última posição pertence a esse aluno e lição no seu banco de dados.

Após `ready` para a lição atual, Seek para os segundos salvos e aguarde o usuário Play. Use Set speed para escuta mais lenta. Salve o progresso com o fluxo de trabalho do seu próprio aplicativo.

Leia `current_time` e `duration`. Em `playback_ended`, seu aplicativo pode registrar um marco de escuta para o Lesson atual.

Se a fonte mudou, descarte a posição antiga até que a lição seja carregada. Não trate a conclusão da escuta como prova de que o aluno compreendeu ou passou em um teste.

Somente reprodução. Seu aplicativo salva o progresso de escuta.

Revisar um anexo de áudio com comentários com marcação de tempo

Editores ou treinadores precisam pular de um comentário para o momento relevante em uma gravação.

`source_url = Selected Review’s recording URL`; cada Comentário de propriedade do aplicativo armazena seu próprio valor de segundos; `waveform_peaks_json` opcional contém picos reais para a mesma gravação.

Clique em um Comentário → Seek para seus segundos → Play. Ao mudar a fonte, substitua ou limpe os picos e vincule a Revisão selecionada novamente.

Exiba `current_time` ao lado do seu compositor de comentários. `waveform_available` informa à sua UI se os picos fornecidos reais estão disponíveis.

Limite ou rejeite timestamps obsoletos em relação à duração atual no seu aplicativo. Quando não houver picos reais, exiba o controle de progresso comum em vez de uma análise de áudio inventada.

Somente reprodução. Seu aplicativo salva o progresso de escuta.

O que funciona agora

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.

Crie o fluxo de trabalho

Use as ações beta disponíveis abaixo e teste o resultado em seus dispositivos-alvo.

Estes exemplos utilizam registros de aplicativo como Lesson, Message e Order. Substitua-os pelos seus próprios tipos de dados e nomes de elementos. Endereços de mídia de exemplo devem ser substituídos pelos seus próprios arquivos.

Adicione o elemento de áudio. Defina source_url = Selected Message's audio_url, title = Selected Message's sender_label e subtitle = Selected Message's date_label.
Se você tiver dados reais de forma de onda para esta gravação, passe-os em waveform_peaks_json. Caso contrário, deixe vazio.
Quando ocorrer ready, use Seek com o número de segundos salvo, se necessário. Permita que o usuário pressione Play. Use Pause, Seek e Set speed para os botões do player.
Exiba current_time e duration. Em playback_ended, salve o progresso de escuta para a mensagem ou lição selecionada. Defina is_active conforme se esta visualização está aberta.

Diagrama de fluxo de trabalho — não é uma captura de tela do aplicativo

Configure uma vez

Crie ou escolha seu projeto de aplicativo Bubble em BestPlugins → Dashboard → Plugins. Escolha Xodera Audio Player Native, copie sua chave, então abra Bubble → Plugins → Xodera Audio Player Native e cole-a em licensing_api_key. Salve uma vez; depois use as ações abaixo. Cada plugin em cada projeto tem sua própria chave.

Use um endereço direto de arquivo de áudio que o aplicativo possa abrir. Reproduzir áudio não requer acesso ao microfone ou à câmera.

Configure uma vez

Crie ou escolha seu projeto de aplicativo Bubble em BestPlugins → Dashboard → Plugins.
Escolha este plugin e copie sua chave de projeto.
Open Bubble → Plugins → this plugin. Paste its project key into licensing_api_key and save.
Adicione o elemento, escolha os dados do seu aplicativo e construa o fluxo de trabalho abaixo.
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.

Instalação e assinatura

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.

Salve o resultado no seu aplicativo

Exemplo ListeningProgress: owner = Current User, lesson = Selected Lesson, seconds = Audio Player's current_time, duration = Audio Player's duration. Salve quando o usuário pausar ou sair da lição, em vez de a cada atualização de tela.

Falha, cancelamento e recuperação

Em player_error, mostre error_code e ofereça Reload source. Mantenha o registro da mensagem ou lição. Quando uma gravação diferente for selecionada, carregue sua própria posição salva. Voltar à visualização não inicia a reprodução automaticamente.

Capacidades e limites

Velocidades de reprodução: 1, 1.5 e 2. Volume: 0–1. Dados de forma de onda: valores 2–2048 entre 0 e 1. Os formatos de áudio suportados dependem do dispositivo. O reprodutor não grava, transcreve nem salva permanentemente áudio para uso offline. A reprodução em segundo plano e na tela de bloqueio não são garantidas.

Configurações, ações e resultados

Use esses nomes em Bubble. Recursos planejados são marcados separadamente.

Configurações beta disponíveis

Configurações do elemento

source_url · textwaveform_peaks_json · texttitle · textsubtitle · textplayback_rate · numbervolume · numberloop · yes_nois_active · yes_nodisabled · yes_noui_text_json · textlanguage · text

Estados

player_status · textis_playing · yes_nois_loaded · yes_nois_buffering · yes_nocurrent_time · numberduration · numberprogress · numberplayback_rate · numbervolume · numberis_looping · yes_nowaveform_available · yes_nowaveform_status · texterror_code · text

Eventos

readyplayback_startedplayback_pausedplayback_endedseek_completedrate_changedplayer_error

Ações e suas entradas

PlayPauseToggleStopSeekSet speedSet volumeReload source

Configurações do elemento · 11

source_urltext · Padrão: "": Valor de exemplohttps://bestplugins.online/native-samples/lesson.mp3; Exemplo de expressão BubbleSelected Message's audio_url; Endereço do arquivo de áudio, vídeo ou imagem selecionado. Use um tipo de arquivo suportado por este plugin.

waveform_peaks_jsontext · Padrão: "": Valor de exemplo[0.1,0.4,0.2,0.7]; Exemplo de expressão BubbleSelected Message's waveform_peaks_json; Valores de amplitude normalizados reais para esta gravação; deixe vazio se indisponível.

titletext · Padrão: "": Valor de exemploLesson 4 — review; Exemplo de expressão BubbleSelected Lesson's name; Texto visível do aplicativo; vazio usa a cópia localizada incorporada onde suportado. Sem credenciais.

subtitletext · Padrão: "": Valor de exemploTeacher · today; Exemplo de expressão BubbleSelected Message's sender_label; Texto visível do aplicativo; vazio usa a cópia localizada incorporada onde suportado. Sem credenciais.

playback_ratenumber · Padrão: 1: Valor de exemplo1.5; Exemplo de expressão BubbleCurrent User's listening_speed; Use o valor do registro comercial atual; valide-o contra os limites abaixo.

volumenumber · Padrão: 1: Valor de exemplo0.8; Exemplo de expressão BubbleVolume Slider's value; Use o valor do registro comercial atual; valide-o contra os limites abaixo.

loopyes_no · Padrão: false: Valor de exemplono; Exemplo de expressão BubbleSelected Lesson's repeat_enabled; Use o valor do registro comercial atual; valide-o contra os limites abaixo.

is_activeyes_no · Padrão: true: Valor de exemployes; Exemplo de expressão BubbleGuideHost's view_is_active (your yes/no custom state); Defina sim enquanto esta visualização estiver aberta. Defina não ao sair, para que a reprodução ou o trabalho atual possam parar.

disabledyes_no · Padrão: false: Valor de exemplono; Exemplo de expressão BubbleGuideHost's is_busy (your yes/no custom state); Desative o elemento enquanto seu aplicativo estiver ocupado ou esta ação estiver indisponível.

ui_text_jsontext · Padrão: "": Valor de exemplo{}; Exemplo de expressão BubbleApp Settings' player_labels_json (supported keys only); JSON opcional com rótulos de botão suportados. Deixe vazio para usar o texto incorporado.

languagetext · Padrão: "auto": Valor de exemplouk; Exemplo de expressão BubbleCurrent User's preferred_language; Defina language=auto para seguir um idioma de dispositivo ou navegador suportado. Insira um código de idioma suportado para escolhê-lo explicitamente.

Ações e suas entradas · 8

Play

Sem parâmetros de ação

Pause

Sem parâmetros de ação

Toggle

Sem parâmetros de ação

Stop

Sem parâmetros de ação

Seek

secondsnumber · Padrão: —: Valor de exemplo12; Exemplo de expressão BubbleSelected Comment's seconds; Use o valor do registro comercial atual; valide-o contra os limites abaixo.

Set speed

ratenumber · Padrão: —: Valor de exemplo1.5; Exemplo de expressão BubbleSpeed Dropdown's value; Use o valor do registro comercial atual; valide-o contra os limites abaixo.

Set volume

volumenumber · Padrão: —: Valor de exemplo0.8; Exemplo de expressão BubbleVolume Slider's value; Use o valor do registro comercial atual; valide-o contra os limites abaixo.

Reload source

Sem parâmetros de ação

Estados e eventos