Pendasi.Maui 0.4.0

Pendasi.Maui

Bibliothèque de composants .NET MAUI en français : Modal, PageDeBas (bottom sheet), Toast, Alertes, CarrouselAuto, Chargement (overlay), Chargement avec progression, ChargementScintillant (squelettes).

Installation

• Via NuGet (recommandé) : dotnet add package Pendasi.Maui
• Ou en référence de projet : ajoute Pendasi.Maui.csproj à ta solution et référence-le.

Dans XAML :

xmlns:pendasi="clr-namespace:Pendasi.Maui;assembly=Pendasi.Maui"



📘 README.md
Pendasi.Maui

📦 Pendasi.Maui est une bibliothèque de composants modernes pour .NET MAUI en C# pur, conçue pour simplifier le développement avec des contrôles prêts à l’emploi, adaptatifs et personnalisables.

Languages:

🇫🇷 Français

🇺🇸 English

Français
🚀 Installation

Ajoutez la dernière version du package NuGet dans votre projet :

dotnet add package Pendasi.Maui


Importez ensuite l’espace de noms :

using Pendasi.Maui;

📂 Composants inclus

Alerte → boîte de dialogue personnalisée

BadgeStatut → badge d’état (succès, erreur, info…)

CarrouselAuto → carrousel automatique

ChargementScintillant → skeleton shimmer (Facebook/YouTube)

ChargementView → overlay de chargement global

Modal → fenêtre modale personnalisée

PageDeBas → bottom sheet coulissant

Toast (MessageTemporaire) → notification éphémère

VoletDeCote → flyout/drawer latéral

🔔 Alerte

Fonctionnalités :

1, 2 ou 3 boutons (OK, Annuler, Plus tard)

Types : Information, Succès, Attention, Erreur

Thème sombre/clair

Exemple simple :

await Alerte.AfficherAsync("Enregistrement réussi !");


Exemple confirmation :

if (await Alerte.ConfirmerAsync("Voulez-vous continuer ?"))
    Console.WriteLine("OK");

🏷️ BadgeStatut

Fonctionnalités :

Variantes : Solide, Contour, Fantôme

Emoji/pictogramme optionnel

Couleur personnalisable

Exemple XAML :

<pendasi:BadgeStatut Texte="Succès" Couleur="Green" Variante="Solide" Emoji="✅"/>
<pendasi:BadgeStatut Texte="Erreur" Couleur="Red" Variante="Contour" Emoji="❌"/>

🎠 CarrouselAuto

Fonctionnalités :

Défilement automatique

Support de tout contenu (images, vues…)

Exemple :

<pendasi:CarrouselAuto IntervalleMs="3000" Hauteur="200">
    <Image Source="img1.png"/>
    <Image Source="img2.png"/>
    <Image Source="img3.png"/>
</pendasi:CarrouselAuto>

✨ ChargementScintillant

Fonctionnalités :

Effet shimmer animé

Mode bloc ou conteneur

Paramètres : couleur, vitesse, angle, rayon des coins

Exemple simple :

<pendasi:ChargementScintillant WidthRequest="200" HeightRequest="20" RayonCoins="6"/>


Exemple conteneur :

var conteneur = ChargementScintillant.CreerConteneur(
    new Label { Text = "Contenu réel" },
    type: TypeMiseEnPage.ImageTexte
);

⏳ ChargementView

Fonctionnalités :

Overlay plein écran

Message optionnel

Exemple :

await ChargementView.AfficherAsync("Chargement en cours…");
await ChargementView.FermerAsync();

🪟 Modal

Exemple :

await Modal.AfficherAsync(new Label { Text="Paramètres avancés" });
await Modal.FermerAsync();

📄 PageDeBas

Fonctionnalités :

Bottom sheet draggable

Fermeture par swipe ou overlay

Thème clair/sombre

Exemple :

await PageDeBas.AfficherAsync(
    new Label { Text="Options" },
    fermerAuTaperFond: true,
    glisserPourFermer: true,
    hauteurMaxEcran: 0.8
);

🍞 Toast (MessageTemporaire)

Exemple :

await MessageTemporaire.AfficherAsync("Sauvegarde réussie !");
await MessageTemporaire.AfficherAsync("Erreur réseau", position: PositionMessage.Haut, couleurFond: Colors.Red);

📑 VoletDeCote

Exemple :

await VoletDeCote.AfficherAsync(
    new Label { Text="Menu latéral" },
    cote: CoteGaucheOuDroit.Gauche
);

🌍 Thème adaptatif

Tous les composants respectent automatiquement le thème clair/sombre via AppThemeBinding.

💡 Bonnes pratiques

Initialisez vos services (PageDeBasService.Init()) dans MainPage.

Utilisez MVVM pour déclencher l’ouverture/fermeture des composants.

Créez vos DataTemplates pour réutiliser vos vues.

English
🚀 Installation

Add the latest NuGet package to your project:

dotnet add package Pendasi.Maui


Then import:

using Pendasi.Maui;

📂 Included Components

Alert → custom dialogs

StatusBadge → state badges

AutoCarousel → automatic carousel

ShimmerLoading → skeleton loader

LoadingView → global overlay with spinner

Modal → custom modal

BottomSheet → draggable sheet

Toast → ephemeral notification

SideDrawer → flyout/drawer

🔔 Alert
await Alert.ShowAsync("Saved successfully!");

if (await Alert.ConfirmAsync("Do you want to continue?"))
    Console.WriteLine("Confirmed");

var choice = await Alert.ChooseAsync("Pick an option");

🏷️ StatusBadge
<pendasi:StatusBadge Text="Success" Color="Green" Variant="Solid" Emoji="✅"/>
<pendasi:StatusBadge Text="Error" Color="Red" Variant="Outline" Emoji="❌"/>

🎠 AutoCarousel
<pendasi:AutoCarousel IntervalMs="3000" Height="200">
    <Image Source="img1.png"/>
    <Image Source="img2.png"/>
    <Image Source="img3.png"/>
</pendasi:AutoCarousel>

✨ ShimmerLoading
<pendasi:ShimmerLoading WidthRequest="200" HeightRequest="20" CornerRadius="6"/>


Or container:

var container = ShimmerLoading.CreateContainer(new Label { Text = "Real content" }, type: LayoutType.ImageText);

⏳ LoadingView
await LoadingView.ShowAsync("Loading…");
await LoadingView.HideAsync();

🪟 Modal
await Modal.ShowAsync(new Label { Text="Advanced settings" });
await Modal.HideAsync();

📄 BottomSheet
await BottomSheet.ShowAsync(new Label { Text="Options" }, dismissOnTapOutside: true, swipeToClose: true);

🍞 Toast
await Toast.ShowAsync("Saved!");
await Toast.ShowAsync("Network error", position: MessagePosition.Top, backgroundColor: Colors.Red);

📑 SideDrawer
await SideDrawer.ShowAsync(new Label { Text="Menu" }, side: DrawerSide.Left);

🎓 License

MIT © Pendasi