Inhaltsverzeichnis
WvdS VSCode UI Meta
La UI Meta Extension gestisce il registro dei componenti e fornisce supporto IntelliSense per i file PXAML.
Funzione e scopo
La Meta Extension offre:
- Registro componenti - Database centrale di tutti i componenti UI
- IntelliSense - Auto-completamento per elementi e attributi PXAML
- Documentazione proprietà - Guida inline per le proprietà
- Informazioni sui tipi - Tipi, valori predefiniti, vincoli
Funzionalità IntelliSense
Completamento elementi
Iniziate con < e premete Ctrl+Space:
La lista mostra tutti i controlli disponibili con:
- Nome dell'elemento
- Breve descrizione
- Icona (se disponibile)
Completamento attributi
All'interno di un elemento, Ctrl+Space mostra gli attributi disponibili:
<Button | > <!-- Cursore qui, premere Ctrl+Space -->
Vengono mostrati:
- Tutte le proprietà del controllo
- Proprietà attached (Grid.Row, DockPanel.Dock, …)
- Eventi (Click, MouseEnter, …)
Completamento valori
Per attributi con valori definiti:
<TextBox TextAlignment="|"/> <!-- Cursore qui -->
Suggerimenti: Left, Center, Right, Justify
Quick Info
Comandi
| Comando | Descrizione |
|---|---|
WVDS: Refresh Component Registry | Ricarica i metadati dei componenti |
Categorie di componenti
Il registro organizza i componenti per categorie:
| Categoria | Controlli inclusi |
|---|---|
| Layout | Grid, StackPanel, DockPanel, WrapPanel, Canvas |
| Input | TextBox, PasswordBox, ComboBox, CheckBox, RadioButton |
| Display | Label, TextBlock, Image, Border, Separator |
| Action | Button, ToggleButton, RepeatButton, MenuButton |
| Lists | ListBox, ListView, TreeView, DataGrid |
| Navigation | TabControl, TabItem, Menu, Toolbar |
| Containers | GroupBox, Expander, ScrollViewer, Popup |
Tipi di proprietà
Il registro conosce vari tipi di proprietà:
| Tipo | Esempio | Comportamento IntelliSense |
|---|---|---|
| String | Text=„Hello“ | Input libero |
| Number | Width=„200“ | Input numerico |
| Boolean | IsEnabled=„True“ | Selezione True/False |
| Enum | Visibility=„Visible“ | Mostra valori enum |
| Brush | Background=„Red“ | Color picker o nomi brush |
| Thickness | Margin=„10,5,10,5“ | Quattro valori (L,T,R,B) |
Componenti personalizzati
I componenti personalizzati possono essere aggiunti al registro.
Registrazione tramite annotazione
Nel componente Pascal:
type {$M+} [ComponentInfo('MyButton', 'Custom button with icon', 'Controls')] TMyButton = class(TWvdSButton) published [PropertyInfo('Icon path', 'Images')] property IconPath: string read FIconPath write SetIconPath; end;
Registrazione tramite JSON
In alternativa tramite file di metadati:
{
"components": [
{
"name": "MyButton",
"description": "Custom button with icon",
"category": "Controls",
"properties": [
{
"name": "IconPath",
"type": "string",
"description": "Path to the icon image"
}
]
}
]
}
Impostazioni
La Meta Extension non ha impostazioni dirette. Utilizza la configurazione della Core Extension.
Gestione cache
I metadati dei componenti vengono memorizzati in cache per un accesso più rapido.
Aggiornare la cache
In caso di modifiche ai componenti:
- Eseguite
WVDS: Refresh Component Registry - Oppure: riavviate VS Code
Posizione della cache
- Windows:
%APPDATA%\Code\User\globalStorage\wvds.wvds-vscode-ui-meta - Linux:
~/.config/Code/User/globalStorage/wvds.wvds-vscode-ui-meta - macOS:
~/Library/Application Support/Code/User/globalStorage/wvds.wvds-vscode-ui-meta
Risoluzione dei problemi
IntelliSense non funziona
Causa: Registro non caricato o file non riconosciuto.
Soluzione:
- Assicuratevi che l'estensione del file sia .pxaml
- Eseguite
WVDS: Refresh Component Registry - Controllate l'Output Channel per errori
Componenti mancanti
Causa: Componente non registrato o cache obsoleta.
Soluzione:
- Aggiornate il registro
- Verificate che il componente sia correttamente annotato
- Assicuratevi che la unit venga compilata
Valori proprietà errati visualizzati
Causa: Metadati obsoleti o errati.
Soluzione:
- Aggiornate il registro
- Verificate l'annotazione della proprietà
- Segnalate componenti standard errati su GitHub
Dettagli tecnici
| Proprietà | Valore |
|---|---|
| Extension ID | wvds.wvds-vscode-ui-meta |
| Attivazione | onLanguage:pxaml, onLanguage:pascal |
| Dipendenze | wvds-vscode-core |
| Min. VS Code | 1.85.0 |

