Comment utiliser Alphasow UI

Flutter UI Tutoriel Développement Mobile

Comment utiliser Alphasow UI

Alphasow-ui est une bibliothèque de composants Flutter qui offre une expérience utilisateur cohérente et adaptative pour vos applications mobiles. Dans ce guide, vous découvrirez comment l'installer et l'utiliser dans vos projets.

Qu'est-ce qu'Alphasow UI ?

Alphasow UI est une bibliothèque UI complète pour Flutter qui se distingue par ses fonctionnalités clés :

  • Adaptation multi-plateforme : Les composants s'adaptent automatiquement au style Material Design (Android) ou Cupertino (iOS) selon la plateforme
  • Systéme de thèmes intégré : Support natif du mode sombre/clair avec des schémas de couleurs personnalisables
  • Collection complète de composants : Boutons, formulaires, alertes, loaders, menus, navigation avec accessibilité intégrée

Prérequis

Avant de commencer, assurez-vous d'avoir :

  • Flutter SDK version 3.16.0 ou supérieure
  • Dart SDK version 3.5.3 ou supérieure

Installation

étape 1 : Ajouter la dépendance

Ajoutez Alphasow UI dans votre fichier pubspec.yaml :

dependencies:
  alphasow_ui: ^1.25.0

Puis exécutez :

flutter pub get

étape 2 : Initialiser votre application

Enveloppez votre application avec le widget AlphasowUiApp pour activer toutes les fonctionnalités :

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

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

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

  @override
  Widget build(BuildContext context) {
    return AlphasowUiApp(
      title: 'Mon Application',
      home: const HomePage(),
    );
  }
}

Utiliser les composants

Une fois installé, vous pouvez utiliser les composants Alphasow UI dans vos widgets. Voici un exemple avec un bouton et une banniére de succés :

AsButton(
  onPressed: () {
    context.showBanner(
      message: 'Bonjour depuis Alphasow UI !',
      type: AlertType.success,
    );
  },
  child: const Text('Afficher un message'),
),

Fonctionnalités principales

Adaptation automatique

Les composants s'adaptent automatiquement é la plateforme :

  • iOS/macOS : Style Cupertino
  • Android/Web : Style Material Design

Vous n'avez rien é configurer, l'adaptation se fait automatiquement !

Thémes sombre et clair

Le support du mode sombre est intégré nativement. Vos utilisateurs bénéficient automatiquement d'une expérience cohérente quel que soit leur théme systéme.

Composants accessibles

Tous les composants incluent le support de l'accessibilité dés le départ, garantissant que vos applications sont utilisables par tous.

Ressources utiles

Contribuer

Alphasow-ui est un projet open source qui accueille les contributions de la communauté. N'hésitez pas à consulter le dépot GitHub pour signaler des problèmes ou proposer des améliorations.

Conclusion

Alphasow UI simplifie le développement d'applications Flutter en offrant des composants prèts à l'emploi, adaptatifs et accessibles. Avec son système de thèmes intégré et son adaptation automatique aux plateformes, vous pouvez vous concentrer sur la logique métier de votre application tout en garantissant une expérience utilisateur de qualité.

Commencez dés maintenant en visitant docs-alphasow.web.app pour explorer tous les composants disponibles !