avalonia-layout-zafiro
Créez des mises en page d'interface utilisateur Avalonia propres avec Zafiro
Créez des applications Avalonia maintenables en utilisant des conteneurs sémantiques et des styles partagés. Réduisez la redondance XAML avec les composants Zafiro.Avalonia et les meilleures pratiques.
Télécharger le ZIP du skill
Importer dans Claude
Allez dans Paramètres → Capacités → Skills → Importer un skill
Activez et commencez à utiliser
Tester
Utilisation de "avalonia-layout-zafiro". Créer un affichage de solde de portefeuille avec icône, label et valeur
Résultat attendu:
Utilisez EdgePanel avec StartContent pour l'icône du portefeuille, Content pour le label, et EndContent pour la valeur du solde. Appliquez IconOptions.Size et IconOptions.Fill pour un style d'icône cohérent.
Utilisation de "avalonia-layout-zafiro". Comment éviter de répéter les paramètres de bordure et de couleur ?
Résultat attendu:
Définissez un Style dans Containers.axaml avec le sélecteur 'HeaderedContainer.BlueSection', définissez CornerRadius, BorderThickness, BorderBrush et Background en utilisant DynamicResource. Appliquez avec Classes='BlueSection'.
Audit de sécurité
SûrStatic analysis detected 100 pattern matches but all are false positives. The skill contains only Markdown documentation files with XAML examples for Avalonia UI development. Detected patterns like backticks are Markdown code fences, not shell execution. No executable code or security risks present.
Score de qualité
Ce que vous pouvez construire
Développeur d'applications de bureau
Refactorisez les vues Avalonia existantes pour utiliser des conteneurs sémantiques et des styles partagés afin d'obtenir un XAML plus propre et maintenable.
Architecte UI
Établissez des modèles UI cohérents dans une grande base de code Avalonia en utilisant les composants Zafiro et l'organisation des thèmes.
Développeur cross-platform
Apprenez les techniques modernes de mise en page Avalonia qui fonctionnent sur les plateformes Windows, macOS et Linux.
Essayez ces prompts
Je dois créer une section de paramètres avec un en-tête et du contenu. Quel conteneur Zafiro devrais-je utiliser et comment ?
Montrez-moi comment ajouter des icônes FontAwesome aux boutons et en-têtes en utilisant IconExtension avec un style cohérent.
J'ai des paramètres de propriétés répétées sur plusieurs éléments HeaderedContainer. Aidez-moi à les extraire dans un style partagé en utilisant Classes.
Je dois gérer la gestion du focus pour un TextBox sans utiliser de code-behind. Montrez-moi comment implémenter cela avec Interaction.Behaviors.
Bonnes pratiques
- Utilisez DynamicResource pour les couleurs et les brosses afin de prendre en charge le changement de thème
- Aplatissez les mises en page avec EdgePanel au lieu de structures Grid et StackPanel imbriquées
- Extrayez les mises en page répétées dans des composants UserControl génériques pour la réutilisabilité
Éviter
- Utiliser des couleurs ou tailles codées en dur directement dans le XAML de la vue au lieu des ressources
- Créer une imbrication profonde avec plusieurs couches Grid et StackPanel
- Utiliser IValueConverter pour une logique simple qui appartient au ViewModel