Creare applicazioni Web con VS e X#.

Dimensione: px

Iniziare la visualizzazioe della pagina:

Download "Creare applicazioni Web con VS e X#."

Mariangela Giulietta Serafini
5 anni fa
Visualizzazioni

1 Creare applicazioni Web con VS e X#. Una delle richieste che abbiamo avuto come Software House è stata quella di convertire applicazioni DeskTop Win32 e.net in applicazioni web. Vantaggi di questa scelta: semplifica la distribuzione del software, tutto è centralizzato su un unico server per accedere al programma basta avere un qualsiasi device con qualsiasi sistema operativo, che possegga una connessione internet e possa far funzionare un browser; pc, tablet, smartphone, per assurdo anche una smart TV. Abbiamo così iniziato il passaggio ad applicazione web del nostro prodotto di punta il TopTeam, una applicazione che noi sviluppiamo per conto della Bpa Controls Srl, applicazione che gestisce le presenze di una o più aziende e si articola su oltre 100 pagine web, centinaia di migliaia di righe di codice, 50 report di stampa. Credo quindi di poter dire che creare una applicazione web che abbia le stesse funzionalità di una applicazione desktop non solo è possibile, ma anche conveniente. Come si compone una applicazione web. Una applicazione web si basa su: pagine ASPX per l interfaccia utente, files DLL per il funzionamento della parte logica, JavaScript per l interazione dell attività dell utente, una base dati per archiviare le informazioni. Premesso ciò iniziamo a vedere di quali strumenti dobbiamo entrare in possesso: Useremo: Visual Studio per disegnare le pagine Web e per fa fase di debug. X# come linguaggio per la scrittura del codice della parte logica della nostra applicazione. Una qualsiasi base dati, personalmente uso Mysql, ma potrete usare il database che preferite; per il nostro esempio useremo files DBF via OleDB. Visual Studio o XIDE per la scrittura del codice logico contenuto nelle DLLs, io ho preferito usare XIDE, l ide fornito con X#, a mio giudizio e più produttivo e semplice da usare rispetto a VS, soprattutto per chi viene da Visual Objects; vedremo poi come trasferire il codice scritto all interno di Visual Studio per l esecuzione del debug.

2 Lezione 1. La struttura delle cartelle di una applicazione web. Per consuetudine una applicazione web si distribuisce su una struttura così articolata: Una cartella radice che nel nostro caso chiameremo webtest, in questa cartella troveranno posto le pagine ASPX, i files di configurazione tra cui web.config, il file che descrive al server web il nostra software, una cartella BIN nella quale andremo a mettere le DLLs che compongono la nostra applicazione, una cartella CSS che conterrà i fogli di stile, una cartella DATA nella quale porremo i nostri DBF, una cartella IMAGES che ospiterà le immagini che useremo nel programma. Creiamo quindi la nostra struttura. Quindi avviato Visual Studio diremo di aprire il nostro sito web: Selezionata la nostra cartella webtest si aprirà il progetto vuoto:

Ora per praticità, chiudete senza salvare il progetto, copiate sul Vostro PC il contenuto del file ZIP che

3 Cominciamo col disegnare la nostra pagina di avvio che chiameremo defaul.aspx Click col tasto destro del mouse sul nome del nostro programma quindi aggiungi web form. Ora per praticità, chiudete senza salvare il progetto, copiate sul Vostro PC il contenuto del file ZIP che potete scaricare dal link ed aprite il nuovamente il sito web. Quello che ci troviamo davanti ora è una situazione un po' diversa:

4 Cosa ci dice il codice che Visual Studio ha scritto quando ho disegnato la pagina default.aspx. La prima riga: Page Language="VB" Inherits="WebLogin" uiculture="it" culture="it-it"%> Possiamo ignorare l informazione Language="VB" questa direttiva si utilizza nel caso si voglia scrivere codice logico direttamente all interno della pagina, in questo caso l informazione dice che il codice è scritto in Visula Basic Net. Importante per noi è invece l informazione Inherits="WebLogin" che indica tutta la logica di questa pagina risiede in una delle DLLs contenute nella cartella BIN, nella fattispecie la DLL WebTest e si chiama CLASS WebLogin INHERIT Page. Altra cosa importante che ho aggiunto a mano è la direttiva: <link rel="stylesheet" href="css/stylesheet.css" type="text/css" /> che indica le caratteristiche standard che devono avere i controlli della nostra pagina sono allocate nel file StyleSheet.css posto nella cartella CSS. Ad esempio i textbox hanno per default il bordo rettangolare, per ottenere al runtime dei bordi arrotondati ho scritto nel foglio di stile:.txtbox { border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding-left: 10px; Height: 24px; Border-Color: #CCCCCC; Border-Style: Solid; Border-Width: 1px; } nella finestra delle proprietà dei controlli TextBox ho aggiunto:

ecco l effetto Altra cosa importante che dobbiamo leggere in questa pagina è il codice relativo al bottone OK <asp:button ID="Button1" runat="server" Text="Ok" Width="141px" CssClass="ButtonStyle"

avrebbe anche aggiunto nella sezione script della pagina <script runat="server"> Protected Sub Button1_Click(sender As Object, e As EventArgs) End Sub </script> costringendomi a scrivere codice VB,

5 ecco l effetto Altra cosa importante che dobbiamo leggere in questa pagina è il codice relativo al bottone OK <asp:button ID="Button1" runat="server" Text="Ok" Width="141px" CssClass="ButtonStyle" OnClick="Ok_click"/> Ho aggiunto a mano OnClick="Ok_click", l ho fatto manualmente perché Visual Studio avrebbe scritto la stessa cosa facendo semplicemente doppio click sul bottone stesso, ma avrebbe anche aggiunto nella sezione script della pagina <script runat="server"> Protected Sub Button1_Click(sender As Object, e As EventArgs) End Sub </script> costringendomi a scrivere codice VB, quindi attenzione a non fare doppio click su un controllo, per rimediare comunque sarà sufficiente eliminare le righe scritte da VS, in questo caso: Protected Sub Button1_Click(sender As Object, e As EventArgs) End Sub

Il metodo Button1_click lo scriviamo nella nostra classe CLASS WebLogin INHERIT Page METHOD Ok_click(Sender AS OBJECT, e AS EventArgs) AS VOID in questo metodo nella prossima lezione vedreno le

6 Il metodo Button1_click lo scriviamo nella nostra classe CLASS WebLogin INHERIT Page METHOD Ok_click(Sender AS OBJECT, e AS EventArgs) AS VOID in questo metodo nella prossima lezione vedreno le chiamate a: SELF:Response:Redirect(cUrl) e Variabile("utente_connesso",SELF:Utente:Text) Altra cosa su cui porre la nostra attenzione è sulla direttiva: <asp:imagebutton ID="ImageButton1" runat="server" ImageUrl="~/Images/logout.png" OnClick="ButtonLogout_click" OnClientClick="if(!confirm('Chiudo la sessione di lavoro?')) return false" BorderStyle="None"/> Qui oltre si dice alla pagina che alla pressione del bottone prima di chiamare il metodo ButtonLogout_Click il browser eseguirà il script JavaScript richiamato da OnClientClick: "if(!confirm('chiudo la sessione di lavoro?')) return false" Se rispondo OK alla domanda, solo allora verrà richiamato il metodo ButtonLogout_Click contenuto come il precedente in DLL.

Documenti analoghi

Installazione Plugin Agenzie delle Entrate - Spesometro - MyRent Installazione Locale

Installazione Plugin Agenzie delle Entrate - Spesometro - MyRent Installazione Locale Prima di realizzare l'installazione dobbiamo individuare che tipo installazione del MyRent abbiamo. Se sul nostro desktop