Zanichelli - Componenti Flutter

Logo Zanichelli

Questo pacchetto fornisce una serie di componenti Flutter personalizzati, sviluppati e mantenuti da Zanichelli per garantire un'esperienza utente coerente e di alta qualità nelle nostre applicazioni.

✨ Caratteristiche Principali

  • Componenti UI personalizzati – Un set di widget predefiniti per velocizzare lo sviluppo delle interfacce utente.
  • Stile coerente – Mantiene un aspetto uniforme in tutte le applicazioni Zanichelli.
  • Facile integrazione – Progettato per essere integrato rapidamente in qualsiasi progetto Flutter.

📦 Installazione

Aggiungi il pacchetto al tuo file pubspec.yaml:

dependencies:
  flutter_albe: ^0.0.4

Oppure utilizza il comando:

flutter pub add flutter_albe

Dopo aver aggiunto la dipendenza, esegui:

flutter pub get

per installare il pacchetto.

🎨 Configurazione del Tema

Per poter utilizzare i componenti presenti nel pacchetto, è importante configurare il tema correttamente.
Ecco un esempio di come applicare il tema di flutter_albe alla tua applicazione:

void main() {
  runApp(const MainApp());
}

class MainApp extends StatelessWidget {
  const MainApp({super.key});

  @override
  Widget build(BuildContext context) {
    final AppThemeData currentTheme = AppThemeData.light;

    return AppTheme(
      data: currentTheme,
      child: const MaterialApp(home: HomeScreen()),
    );
  }
}

Assicurati di applicare AppTheme all'intera applicazione.

🚀 Utilizzo

Per utilizzare i componenti, importa il pacchetto nel tuo file Dart:

import 'package:flutter_albe/flutter_albe.dart';

Ora puoi utilizzare i componenti direttamente nel tuo codice:

import 'package:flutter/material.dart';
import 'package:zanichelli_components/zanichelli_components.dart';

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ZButton(
          buttonText: 'Outlined Button',
          buttonType: ButtonType.outlined,
          onPressed: () {},
        ),
      ),
    );
  }
}

📖 Widgetbook

Widgetbook è un pacchetto Flutter ispirato a Storybook.js che semplifica la catalogazione dei widget per creare un design system personalizzato.
Permette inoltre di testare i widget in diverse configurazioni.

Widgetbook

🚀 Avvio di Widgetbook

Per avviare Widgetbook nel progetto, segui questi passaggi:

1️⃣ Spostati nella cartella widgetbook:

cd widgetbook

2️⃣ Installa le dipendenze:

flutter pub get

3️⃣ Avvia Widgetbook su Chrome:

flutter run -d chrome

🔄 Aggiornamento dei Componenti

Se crei nuovi componenti nelle varie cartelle, esegui il seguente comando per rigenerare il file main.directories.g.dart:

dart run build_runner build -d

Questo assicura che i nuovi widget vengano inclusi correttamente nel sistema. 🚀

🔄 Sviluppo Locale

Se vuoi sviluppare e testare il pacchetto flutter_albe in locale, segui questi passaggi:

1️⃣ Organizza le cartelle

Crea una struttura simile a questa:

/progetti
  /flutter_albe
  /mio_progetto

2️⃣ Configura le dipendenze

Nel file pubspec.yaml del tuo progetto (mio_progetto), modifica la dipendenza:

dependencies:
  flutter_albe:
    path: ../flutter_albe

3️⃣ Aggiorna le dipendenze

Esegui il comando:

flutter pub get

4️⃣ Testa le modifiche

Ogni volta che apporti modifiche a flutter_albe, puoi vederle immediatamente nel tuo progetto eseguendo:

flutter pub get && flutter run

5️⃣ Lanciare i test

Esegui il comando:

flutter test test

📦 Pubblicazione del Pacchetto

Per pubblicare il pacchetto su pub.flutter-io.cn, segui questi passaggi:

Modifica il CHANGELOG.md

Modifica pubspec.yaml

Entra nel widgetbook e lancia un pub get

cd widgetbook
flutter pub get

Ricordati di uscire dal widgetbook prima di procedere con la pubblicazione

cd ..

1️⃣ Verifica il pacchetto prima della pubblicazione

Prima di pubblicare, è consigliato eseguire un dry-run per verificare eventuali problemi:

flutter pub publish --dry-run

Questo comando esegue un controllo senza pubblicare effettivamente il pacchetto, mostrando eventuali errori o avvisi.

2️⃣ Autenticazione su pub.flutter-io.cn

Se non hai ancora effettuato l'accesso, esegui:

dart pub login

Segui le istruzioni per autenticarti con il tuo account Google associato a pub.flutter-io.cn.

3️⃣ Pubblica il pacchetto

Se il dry-run non ha segnalato problemi, puoi procedere con la pubblicazione:

flutter pub publish

4️⃣ Verifica la pubblicazione

Dopo qualche minuto, il pacchetto sarà disponibile su pub.flutter-io.cn. Puoi verificare la pubblicazione visitando:

https://pub.flutter-io.cn/packages/flutter_albe

Libraries

flutter_albe