XAML - Configurazione dell'ambiente

Microsoft fornisce due strumenti importanti per XAML:

• Visual Studio
• Miscela di espressioni

Attualmente, entrambi gli strumenti possono creare XAML, ma il fatto è che Visual Studio è usato maggiormente dagli sviluppatori mentre Expression Blend è ancora usato più spesso dai progettisti.

Microsoft fornisce una versione gratuita di Visual Studio che può essere scaricata da https://www.visualstudio.com/en-us/downloads/download-visual-studio-vs.aspx

Note- Per questo tutorial, utilizzeremo principalmente progetti WPF e l'app di Windows Store. Ma la versione gratuita di Visual Studio non supporta l'app di Windows Store. Quindi, a tale scopo, avrai bisogno di una versione con licenza di Visual Studio.

Installazione

Segui i passaggi indicati di seguito per installare Visual Studio sul tuo sistema -

• Dopo aver scaricato i file, esegui il programma di installazione. Verrà visualizzata la seguente finestra di dialogo.

• Fare clic sul pulsante Installa e inizierà il processo di installazione.

• Una volta completato con successo il processo di installazione, vedrai la seguente schermata.

• Chiudi questa finestra di dialogo e riavvia il computer se necessario.

• Ora apri Visual Studio dal menu Start che mostrerà la seguente finestra di dialogo. Ci vorrà del tempo per la prima volta, solo per la preparazione.

Una volta fatto tutto, vedrai la finestra principale di Visual Studio.

Primo passo verso l'implementazione

Cominciamo con una semplice implementazione. Segui i passaggi indicati di seguito:

• Fare clic su File → Nuovo → opzione di menu Progetto.

• Verrà visualizzata la seguente finestra di dialogo:

• In modelli, seleziona Visual C # e seleziona Applicazione WPF. Assegna un nome al progetto e fai clic sul pulsante OK.

• Nel file mainwindow.xaml, i seguenti tag XAML vengono scritti per impostazione predefinita. Capirai tutti questi tag più avanti in questo tutorial.

<Window x:Class = "FirstStepDemo.MainWindow"
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008"
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" 
   xmlns:local = "clr-namespace:FirstStepDemo" 
   mc:Ignorable = "d" Title = "MainWindow" Height = "350" Width = "604"> 
	
   <Grid> 
         
   </Grid> 
</Window>

Per impostazione predefinita, una griglia è impostata come primo elemento dopo la pagina.

Aggiungiamo un pulsante e un blocco di testo sotto l'elemento Grid. Questo è chiamatoobject element syntax, una parentesi angolare sinistra seguita dal nome di ciò che vogliamo istanziare, ad esempio un pulsante, quindi definire una proprietà di contenuto. La stringa assegnata al Contenuto verrà visualizzata sul pulsante. Ora imposta l'altezza e la larghezza del pulsante rispettivamente su 30 e 50. Allo stesso modo inizializza le proprietà del blocco di testo.

Ora guarda la finestra di progettazione. Vedrai un pulsante. Ora premi F5 per eseguire questo codice XAML.

<Window x:Class = "FirstStepDemo.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" 
   xmlns:local = "clr-namespace:FirstStepDemo" 
   mc:Ignorable = "d" Title = "MainWindow" Height = "350" Width = "604"> 
	
   <Grid> 
      <Button Content = "First Button" Height = "30" Width = "80"/> 
      <TextBlock Text = "Congratulations you have successfully build your first app" 
         Height = "30" Margin = "162,180,122,109"/> 
   </Grid> 
	
</Window>

Quando compili ed esegui il codice sopra, vedrai la seguente finestra.

Congratulazioni! Hai progettato il tuo primo pulsante.