Buscar pacotes, repositórios e categorias de apps

ducafecatGuia do ecossistema Flutter
Capa de flutter_circular_text
Detalhes do pacotev0.3.1

flutter_circular_text

Pacote Flutter que coloca texto em um caminho circular curvado.

AndroidiOSWebmacOSWindowsLinux
pub.dev Documentação da API Código-fonte
Downloads em 30 dias
3,5 mil
Curtidas
177
Pontos Pub
160

Instalar pacote

flutter pub add flutter_circular_text

Visão geral do pacote

Orientação gerada a partir de informações públicas. Apenas para referência.

Um pacote Flutter que permite renderizar texto ao longo de um caminho circular curvo, oferecendo uma forma visualmente atraente de exibir texto em layouts circulares. Ideal para criar elementos de interface dinâmicos e artísticos, como indicadores de progresso circulares, selos ou arranjos decorativos de texto. O pacote suporta múltiplas plataformas, incluindo Android, iOS, Web, macOS, Windows e Linux, garantindo comportamento consistente entre dispositivos. Oferece integração simples por meio de um widget dedicado com opções personalizáveis de raio, ângulo e alinhamento.

Casos de uso

  • Criando insígnias de texto circulares
  • Designando rótulos circulares animados
  • Construindo elementos de interface decorativos
  • Implementando exibições de progresso circular
  • Melhorando visuais do painel

Principais recursos

  • Texto ao longo de um caminho circular curvo
  • Raio e ângulo personalizáveis
  • Suporte para múltiplas plataformas
  • Integração simples de widget
  • Controles de alinhamento e rotação

Indicado para

  • Designers de UI procurando layouts criativos de texto
  • Desenvolvedores construindo painéis interativos
  • Aplicativos que exigem efeitos visuais únicos
  • Projetos com temas de design circular ou radial
  • Prototipagem de interfaces artísticas

Considerações

  • Pode afetar o desempenho com grandes quantidades de texto
  • Limitado a caminhos circulares apenas
  • Requer alinhamento cuidadoso para legibilidade
  • Não é ideal para parágrafos longos
  • A direção do texto pode precisar de ajuste manual

README original

Snapshot do README original do repositório-fonte vinculado. Consulte o repositório para o conteúdo mais recente.

Circular Text Widget

pub package

Installation

Add dependency in pubspec.yaml:

dependencies:
  flutter_circular_text: "^0.3.1"

Import in your project:

import 'package:flutter_circular_text/circular_text.dart';

Basic usage

CircularText(
  children: [
    TextItem(
      text: Text(
        "Chuck Norris".toUpperCase(),
        style: TextStyle(
          fontSize: 28,
          color: Colors.blue,
          fontWeight: FontWeight.bold,
        ),
      ),
      space: 12,
      startAngle: -90,
      startAngleAlignment: StartAngleAlignment.center,
      direction: CircularTextDirection.clockwise,
    ),
    TextItem(
      text: Text(
        "top 100 Facts".toUpperCase(),
        style: TextStyle(
          fontSize: 20,
          color: Colors.amberAccent,
          fontWeight: FontWeight.bold,
        ),
      ),
      space: 10,
      startAngle: 90,
      startAngleAlignment: StartAngleAlignment.center,
      direction: CircularTextDirection.anticlockwise,
    ),
  ],
  radius: 125,
  position: CircularTextPosition.inside,
  backgroundPaint: Paint()..color = Colors.grey.shade200,
)

Examples

example project contains single and multi text demos

Demos
Single Text Demo

alt tag

Multi Text Demo

Changelog

Check Changelog for updates

Bugs/Requests

Reporting issues and requests for new features are always welcome.

Categorias

Decoração de Texto, Efeito e Animação

Repositório-fonte

Projetos que usam este pacote