[Ammy.1] Primi passi con Ammy

Per chi mi legge, se benissimo che lavoro tantissimo nel mondo delle applicazioni desktop, quindi ho a che fare principalmente con lo XAML, sia per quanto riguarda WPF che UWP. Quando ho sentito parlare di Ammy, quindi, mi sono interessato, ma la domanda successiva è stata:

La risposta è tranquillizzante, perchè in un progetto WPF è possibile utilizzare XAML ed Ammy, senza alcun problema. In un progetto WPF, quindi, possiamo avere delle Window/Page create con XAML, ed altre con Ammy XAML ovviamente non lo butti via, semplicemente è possibile dare un’occhiata ad Ammy e vedere se fa al caso nostro. Questo mi ha tranquillizzato, perchè questo significa in parole povere che posso integrare Ammy nei miei progetti esistenti, e sfruttarne le caratteristiche peculiari che per certi versi lo rendono più potenti rispetto allo XAML.

Quali sono queste caratteristiche?

Scriverò un po’ di posto su Ammy, perciò se siete interessati seguitemi e non ve ne pentirete.

Primi passi con Visual Studio
La prima cosa da fare è scaricare dal Marketplace di Visual Studio l’extension per il supporto ad Ammy. Da questo link scaricate il file Ammy.VisualStudio.vsix, di circa 59Kb, che aggiungerà alcuni Item Template molto molto comodi per lavorare con Ammy. Ne parleremo fra poco.

La seconda cosa da fare è creare un progetto WPF. Ammy, ad oggi, si applica solo ed esclusivamente su questo tipo di progetti. Quindi apriamo Visual Studio 2015, creiamo un progetto WPF e poi utilizziamo NuGet per recuperare il pacchetto Ammy.Lo possiamo fare attraverso la Package Manager Console oppure tramite la voce Manage NuGet Packages del nodo References. Decidete voi qual è la strada che preferite.

Qui sopra vedete la Package Manager Console, mentre qui sotto NuGet.

Fatto questo, possiamo provare a scrivere la nostra prima Window con Ammy.

Aggiunta di una Window nel progetto
Andiamo nella solita dialog “Add new Item” di Visual Studio. L’extension per Visual Studio ci ha installato 4 Item Template, che si trovano nel nodo “Visual C#”; per trovarli più facilmente, vi suggerisco di impostare l’ordinamento “Name Ascending”, oppure di fare una ricerca con “Ammy” nella casella in alto a destra. Fatto questo…

…troverete quattro Item Template: Ammy Application, Ammy Mixins, Ammy User Control ed infine Ammy Window. Selezioniamo quest’ultimo, poi diamo un nome, per esempio “StartWindow.ammy”.

Fatto. Notare che, come dicevo prima, il nostro progetto ha la solita MainWindow.xaml (scritta in XAML) ed un altro file, StartWindow.ammy, che è un’altra Window, questa volta scritta in Ammy.

Se facciamo doppio-click su questo file apparirà un codice sorgente simile al JSON:

Window "StudyAmmy.StartWindow" {
}

Il codice qui sopra di fatto crea una Window di WPF. Il primo elemento root di Ammy deve avere un nome, che di fatto indica il nome della classe di code-behind. Un concetto importante di Ammy è che dietro le quinte viene sempre auto-generato del codice XAML; questa cosa è importante ed utile allo stesso tempo, perchè possiamo costantemenet verificare che il codice Ammy che abbiamo scritto produca il codice XAML che desideriamo. Mi spiego meglio: clicchiamo il pulsante Show All Files nel Solution Explorer di Visual Studio. Comparirà il file StartWindow.g.xaml, che possiamo tranquillamente aprire tramite doppio-click.

Facciamo un passettino ulteriore. Editiamo il file StartWindow.ammy in questo modo:

Window "StudyAmmy.StartWindow" {
    StackPanel { Orientation: Horizontal,
    Children: [
        TextBlock { Text: "I Love Ammy!!!" }
    ] }
}

Abbiamo creato uno StackPanel orizzontale, ed abbiamo aggiunto un unico controllo TextBlock. Notare la sintassi json-like. Notare che l’Intellisense è perfettamente funzionante. Se salviamo il file e diamo un’occhiata al file “StartWindow.g.xaml”, il codice è il seguente:

<Window x:Class="StudyAmmy.StartWindow"
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:ns0="clr-namespace:AmmySidekick;assembly=AmmySidekick"
  ns0:Ammy.Register="/StudyAmmy;component/StartWindow.g.xaml">
  <StackPanel Orientation="Horizontal">
    <StackPanel.Children>
      <TextBlock Text="I Love Ammy!!!"/>
    </StackPanel.Children>
  </StackPanel>
</Window>

Nota importante. NON modificate mai lo XAML direttamente. Questo XAML viene auto-generato dal file .ammy che abbiamo visto prima. Qui la lesson-learned è che Ammy non fa nient’altro che produrre XAML al posto nostro, quindi tutto ciò che era possibile con XAML lo è anche con Ammy.

Solo che Ammy ha delle feature in più, come alias e mixin che citavo prima, che semplificano e velocizzano tantissimo il nostro lavoro.

Per concludere…

Ok, diciamo che per questa prima puntata abbiamo fatto abbastanza.

Non perdete i miei prossimi post perchè ne vedremo delle belle.

Send to Kindle