Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial
  • Lezione 13 di 40
  • livello principiante
Indice lezioni

Finalmente in Ultradev: come compiere le operazioni più comuni

Creare e salvare un nuovo file. Formattare il testo e creare link. Inserire immagini. Lavorare con i form. Lavorare con le tabelle. Selezionare gli elementi
Creare e salvare un nuovo file. Formattare il testo e creare link. Inserire immagini. Lavorare con i form. Lavorare con le tabelle. Selezionare gli elementi
Link copiato negli appunti

Creare un nuovo file e salvarlo

Per creare un nuovo file la procedura è assolutamente simile a quella
di tutti gli altri software: dal menu File, scelgo New. Per salvarlo
basta selezionare il classico Save as. Vi suggeriamo un altro metodo
che risulta di assoluta importanza e utilità quando si lavora nell'ambito
di un sito.

Quando create la struttura del sito in Ultradev (vedi lezione
14), potete accedere ad una finestra di gestione del sito stesso premendo
il tasto F8. Nella sezione a destra viene visualizzata la struttura locale,
ovvero quella definita sul vostro disco. Per creare un nuovo file all'interno
del sito, cliccate con il tasto destro del mouse in una zona vuota. Dal menu
selezionate quindi New File (fig. 1):

Figura

Verra creato di default un file chiamato "untitled.asp", rinominatelo
come volete e apritelo con il classico doppio click. Questa procedura consente
una maggiore rapidità, e soprattutto può evitare errori (per esempio
salvare il file fuori dalla directory del sito).

Formattare il testo e creare link

Il testo che inserite nelle vostre pagine può essere facilmente formattato
e modificato a partire dal menu Text della barra. Più comodo può
risultare effettuare queste operazioni a partire dalla finestra Properties
(Ctrl + F2). Quando non sono selezionati altri elementi della pagina essa
mostra infatti di default le varie opzioni per la formattazione di testo e paragrafi
(formato, font, stili del testo, allineamento, definizione di liste). Sempre
da questa finestra si impostano i link. Si procede in questo modo:

  1. Si seleziona il testo
  2. Nella finestra Properties si digita l'URL del file da linkare nel campo
    Link oppure si clicca sulla cartellina gialla per scegliere il file
    tra quelli salvati su disco(fig. 2).
  3. Per settare la finestra o il frame in cui aprire il file si configura il
    parametro Target (per forzare l'apertura della pagina in una nuova
    finestra selezionate l'opzione _blank, le altre opzioni gestiscono
    il caricamento delle pagine all'interno di frameset).

    Figura 2

Inserire immagini

Per inserire immagini si possono seguire due strade. Dal menu Insert si
seleziona Image e si sceglie l'immagine da inserire. Oppure dalla palette
Objects/Common si clicca sul pulsante

Figura 3

.

Lavorare con i form

Soprattutto quando si realizzano pagine e siti dinamici, un elemento fondamentale,
per creare interattività e per raccogliere informazioni provenienti dall'utente,
è rappresentato dai form (moduli). Il modo più semplice per lavorare
con questi oggetti è quello di aprire la sezione Forms nella palette
Objects (fig. 4):

Figura 4

L'inserimento di forms nella pagina prevede due passi:

  1. Si inserisce il form cliccando sul pulsante
    Figura 5

    .
    Con l'oggetto Form si definisce il tag e si configurano le modalità
    di invio dei dati.

  2. Si inseriscono gli elementi costitutivi del form. Ultradev consente
    di inserire questi elementi (nell'ordine in cui compaiono nel pannello
    a sinistra):
  • Caselle di testo (Text Field)
  • Pulsanti per inviare e/o reimpostare i form (Button)
  • Caselle di controllo (Checkbox)
  • Pulsanti di opzione (Radio Button)
  • Menu a discesa (List/Menu)
  • Campi file (File Field)
  • Immagine (Image Field): utile se si vuole inserire un'immagine
    al posto del classico pulsante di invio
  • Campi nascosti (Hidden Field)
  • Menu a discesa per navigazione (Jump Menu)

Le proprietà e i principali parametri di tutti gli elementi citati
possono essere modificati dalla finestra Properties

Lavorare con le tabelle

Utilissime per l'inserimento ordinato dei dati, le tabelle sono anche un validissimo
strumento per organizzare il layout della pagina. In Ultradev si inseriscono
partendo dal solito menu Insert, scegliendo la voce table o tramite
il pulsante Figura 6
nella palette Objects/Common. Nella prima finestra di configurazione
si settano i parametri fondamentali (fig. 7):

Figura 7

Rows è il numero di righe; Columns di colonne. La larghezza
(width) può essere espressa in percentuale o in pixel. Gli altri
parametri sono il bordo, il cell padding e il cell spacing.

Una volta inserita, la tabella può essere modificata nei suoi elementi
costitutivi dalla finestra Properties. In particolare si può agire sul
colore di sfondo, sul bordo, sull'allineamento del testo in senso verticale
e orizzontale. Particolare attenzione va posta nell'operazione di selezione.
Se si vuole modificare una singola cella basterà portarsi con il cursore
all'interno di essa e cambiare i parametri nella finestra Properties. Volendo
invece selezionare una colonna, accostatevi con il cursore sulla colonna stessa,
fin quando esso non assumerà l'aspetto di una freccetta nera: a quel
punto cliccate per selezionare (fig. 8):

Figura 8

Lo stesso procedimento va usato per selezionare una riga, ma questa volta vi
posizionerete con il cursore alla sinistra della riga (a destra non funziona!).

Per selezionare una tabella intera avvicinatevi col cursore al bordo superiore
o inferiore e quando avrà assunto la forma delle quattro freccette orientate
(Sposta) cliccate per selezionare (fig. 9):

Figura 9

Selezione degli elementi

Un ultimo accenno va fatto alle modalità di selezione degli elementi
presenti sulla pagina. Se il metodo più semplice è quello di selezionarli
cliccando con il mouse su di essi, è opportuno ricordare un altro sistema.
Nella barra inferiore di Ultradev, a seconda della zona in cui vi trovate con
il cursore, potete osservare un elenco di tag html. Cliccando su uno di essi
potrete selezionarli. Il metodo è particolarmente indicato per le tabelle
(specie se nidificate) e i form (fig. 10):

Figura 10

Nell'esempio visualizzato, posizionandomi col cursore all'interno della tabella,
ho visualizzato nella barra inferiore i tag relativi a tale elemento. Volendo
selezionare la riga superiore mi basterà cliccare su <tr>. Se avessi
voluto selezionare tutta la tabella, avrei ovviamente cliccato su <table>.

Ti consigliamo anche