avalonia-layout-zafiro
ZafiroでクリーンなAvalonia UIレイアウトを構築
セマンティックコンテナと共有スタイルを使用して保守性の高いAvaloniaアプリケーションを作成します。Zafiro.AvaloniaコンポーネントとベストプラクティスでXAMLの冗長性を削減します。
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". アイコン、ラベル、値を持つウォレット残高表示を作成
Résultat attendu:
ウォレットアイコンにはEdgePanelのStartContent、ラベルにはContent、残高にはEndContentを使用します。一貫したアイコンスタイリングのためにIconOptions.SizeとIconOptions.Fillを適用します。
Utilisation de "avalonia-layout-zafiro". ボーダーとカラー設定を繰り返すことを避けるには？
Résultat attendu:
Containers.axamlでセレクター「HeaderedContainer.BlueSection」を持つStyleを定義し、CornerRadius、BorderThickness、BorderBrush、BackgroundをDynamicResourceで設定します。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
デスクトップアプリ開発者
セマンティックコンテナと共有スタイルを使用して、既存のAvaloniaビューをリファクタリングし、より清洁で保守性の高いXAMLにします。
UIアーキテクト
Zafiroコンポーネントとテーマ組織を使用して、大きなAvaloniaコードベースで一貫したUIパターンを確立します。
クロスプラットフォーム開発者
Windows、macOS、Linuxプラットフォーム間で動作するモダンなAvaloniaレイアウト技術を学びます。
Essayez ces prompts
ヘッダーとコンテンツを持つ設定セクションを作成する必要があります。どのZafiroコンテナを使用し、どうしますか？
IconExtensionを使用してボタンとヘッダーにFontAwesomeアイコンを追加し、一貫したスタイリングを行う方法を示してください。
複数のHeaderedContainer要素で繰り返されるプロパティ設定があります。Classesを使用して共有スタイルに抽出するのを助けてください。
コードビハインドを使用せずにTextBoxのフォーカス管理を実装する必要があります。Interaction.Behaviorsを使用してこれを実装する方法を示してください。
Bonnes pratiques
- テーマ切り替えをサポートするために色とブラシにDynamicResourceを使用
- ネストされたGridやStackPanelの構造の代わりにEdgePanelでレイアウトをフラット化
- 再利用性のために繰り返されるレイアウトを汎用UserControlコンポーネントに抽出
Éviter
- リソースの代わりにビューのXAMLに直接ハードコードされた色やサイズを使用
- 複数のGridとStackPanel層で深いネストを作成
- シンプルなロジックにViewModelに属するIValueConverterを使用