37. Tudo sobre formulários PT. 1
Nesta aula eu ensino como montar formulários completos no Framer: onde encontrar o componente Form, como cada Label agrupa um Input ou Select, e como configurar tipos de campo (text, email, number, url, date/time), placeholder, value e required. Mostro também como organizar opções de Select, definir valores (value) que chegam ao e‑mail, e como testar o envio usando a opção Send To. Explico diferenças entre Checkbox (multi-seleção) e Radio (seleção única) e a importância de nomear cada campo para identificar corretamente as respostas no e‑mail. Também mostro como personalizar visualmente os campos (font, cor, radius, padding, border, focus), ativar/desativar autofill, limitar caracteres (max/min length), criar formulários com etapas (step) e usar o botão Submit com estados (default, loading, disabled, success, error). Demonstro o processo de unlink para editar o botão, adicionar ícones, e vincular estados usando variáveis do Form. Ao final eu preparo exemplos práticos e testes para garantir que o formulário envie corretamente e que os dados cheguem organizados por Name, Subject e Body. Glossário (termos técnicos explicados): - Input: campo onde o usuário digita ou insere dados. - Select / Select Box: campo que abre uma lista de opções para escolher. - Form: componente que envolve todas as Labels e envia os dados. - Label: grupo que conecta um Texto (rótulo) a um Input/Select. - Placeholder: texto guia exibido antes do usuário digitar (suma ao digitar). - Value: valor efetivo do campo que será enviado (pode ser pré-definido). - Required: campo obrigatório para enviar o formulário. - Date Picker: seletor visual de data (campo date). - Autofill: sugestão automática de dados pelo navegador. - Checkbox / Radio: checkbox permite múltiplas escolhas; radio permite só uma. - Unlink: ação que separa um componente padrão do Framer para editar manualmente. - Estados do botão: visuais distintos do Submit (default, loading, disabled, success, error). - Send To: configuração que define para onde/como os dados serão enviados (ex.: e‑mail).
Comentários
Nesta aula eu ensino como montar formulários completos no Framer: onde encontrar o componente Form, como cada Label agrupa um Input ou Select, e como configurar tipos de campo (text, email, number, url, date/time), placeholder, value e required. Mostro também como organizar opções de Select, definir valores (value) que chegam ao e‑mail, e como testar o envio usando a opção Send To. Explico diferenças entre Checkbox (multi-seleção) e Radio (seleção única) e a importância de nomear cada campo para identificar corretamente as respostas no e‑mail. Também mostro como personalizar visualmente os campos (font, cor, radius, padding, border, focus), ativar/desativar autofill, limitar caracteres (max/min length), criar formulários com etapas (step) e usar o botão Submit com estados (default, loading, disabled, success, error). Demonstro o processo de unlink para editar o botão, adicionar ícones, e vincular estados usando variáveis do Form. Ao final eu preparo exemplos práticos e testes para garantir que o formulário envie corretamente e que os dados cheguem organizados por Name, Subject e Body. Glossário (termos técnicos explicados): - Input: campo onde o usuário digita ou insere dados. - Select / Select Box: campo que abre uma lista de opções para escolher. - Form: componente que envolve todas as Labels e envia os dados. - Label: grupo que conecta um Texto (rótulo) a um Input/Select. - Placeholder: texto guia exibido antes do usuário digitar (suma ao digitar). - Value: valor efetivo do campo que será enviado (pode ser pré-definido). - Required: campo obrigatório para enviar o formulário. - Date Picker: seletor visual de data (campo date). - Autofill: sugestão automática de dados pelo navegador. - Checkbox / Radio: checkbox permite múltiplas escolhas; radio permite só uma. - Unlink: ação que separa um componente padrão do Framer para editar manualmente. - Estados do botão: visuais distintos do Submit (default, loading, disabled, success, error). - Send To: configuração que define para onde/como os dados serão enviados (ex.: e‑mail).
Comentários
Nesta aula eu ensino como montar formulários completos no Framer: onde encontrar o componente Form, como cada Label agrupa um Input ou Select, e como configurar tipos de campo (text, email, number, url, date/time), placeholder, value e required. Mostro também como organizar opções de Select, definir valores (value) que chegam ao e‑mail, e como testar o envio usando a opção Send To. Explico diferenças entre Checkbox (multi-seleção) e Radio (seleção única) e a importância de nomear cada campo para identificar corretamente as respostas no e‑mail. Também mostro como personalizar visualmente os campos (font, cor, radius, padding, border, focus), ativar/desativar autofill, limitar caracteres (max/min length), criar formulários com etapas (step) e usar o botão Submit com estados (default, loading, disabled, success, error). Demonstro o processo de unlink para editar o botão, adicionar ícones, e vincular estados usando variáveis do Form. Ao final eu preparo exemplos práticos e testes para garantir que o formulário envie corretamente e que os dados cheguem organizados por Name, Subject e Body. Glossário (termos técnicos explicados): - Input: campo onde o usuário digita ou insere dados. - Select / Select Box: campo que abre uma lista de opções para escolher. - Form: componente que envolve todas as Labels e envia os dados. - Label: grupo que conecta um Texto (rótulo) a um Input/Select. - Placeholder: texto guia exibido antes do usuário digitar (suma ao digitar). - Value: valor efetivo do campo que será enviado (pode ser pré-definido). - Required: campo obrigatório para enviar o formulário. - Date Picker: seletor visual de data (campo date). - Autofill: sugestão automática de dados pelo navegador. - Checkbox / Radio: checkbox permite múltiplas escolhas; radio permite só uma. - Unlink: ação que separa um componente padrão do Framer para editar manualmente. - Estados do botão: visuais distintos do Submit (default, loading, disabled, success, error). - Send To: configuração que define para onde/como os dados serão enviados (ex.: e‑mail).
Comentários
Physis
Destravando Framer
Mão na massa
Physis
Destravando Framer
Mão na massa
Physis
Destravando Framer
Mão na massa

Especialista

Olá 👋,
aluno(a)
Aqui é o Will, em que posso ajudar?
Sugestões & Feedbacks
