Walkthrough 1

Pentru a finaliza acest ghid, veți avea nevoie de următoarele componente:

Visual Studio sau Microsoft Visual Web Developer, Express Edition.

În plus, jpg, gif sau alt fișier grafic care poate fi folosit ca emblemă pe pagina principală. Se recomandă ca emblema să nu depășească 48 de puncte. Cu toate acestea, afișarea unei embleme este opțională, iar mărimea exactă a desenului nu este critică în acest ghid.

În cazul în care un site web a fost creat în Visual Web Developer (de exemplu, urmând pașii din Walkthrough. Crearea unei pagini web de bază în Visual Web Developer), puteți utiliza site-ul Web și de a trece la secțiunea următoare, Crearea unei pagini de start. În caz contrar, creați un nou site Web și o pagină urmând acești pași.

Crearea unui site web bazat pe sistemul de fișiere

Deschideți Visual Web Developer.

În meniul Fișier, faceți clic pe Site nou Web.

Va apărea caseta de dialog New Web Site.

Sub șabloane instalate Visual Studio, selectați site-ul Web ASP.NET.

În caseta Locație, tastați numele folderului în care doriți să stocați paginile site-ului Web.

De exemplu, tastați numele folderului C: \ WebSites.

În lista Limbă, selectați limba de programare preferată.

Faceți clic pe OK.

Visual Web Developer creează un dosar și o pagină nouă numită Default.aspx.

Selectați toate celulele din tabel și setați parametrul BgColor la o culoare diferită de culoarea de fundal.

Adăugarea conținutului static la pagina principală

În caseta de instrumente, glisați comanda Meniu din grupul Tranziții în celula de sus.

Creați un meniu utilizând următorii pași:

Setați proprietatea de orientare a comenzii de meniu la orizontală.

În grupul Caracteristici, faceți dublu clic pe Adăugați nodul rădăcină. pentru a adăuga două elemente de meniu:

Faceți clic pe primul nod și setați parametrul Text pe Home. și pentru parametrul NavigateUrl, valoarea Home.aspx.

Faceți clic pe al doilea nod și setați parametrul Text la Despre. iar pentru parametrul NavigateUrl valoarea lui About.aspx.

Dacă există un fișier imagine pe care îl puteți utiliza ca emblemă, urmați acești pași pentru al plasa pe pagina principală:

În Solution Explorer, faceți clic cu butonul din dreapta pe numele site-ului Web, apoi faceți clic pe Adăugare element existent.

Navigați la fișierul imagine, selectați-l și apoi faceți clic pe Adăugare.

În caseta de instrumente, trageți din grupul de control al imaginii standard în coloana din stânga din mijloc a tabelului.

Setați proprietatea ImageUrl a butonului Image (Imagine) la numele fișierului imagine.

Acum puteți pune prototipul conținutului pentru a specifica locul în care conținutul de pe pagina principală va fi tăiat în timpul execuției.

Adăugarea unui prototip de conținut

Trageți controlul ContentPlaceHolder în celula din dreapta din dreapta.

Proprietatea ID a controlului este ContentPlaceholder1. Puteți lăsa acest nume sau îl puteți schimba. Amintiți-vă noul nume, așa cum va fi necesar mai târziu.

Pagina conține, de asemenea, un control al conținutului. cu care utilizatorul va continua să lucreze.

Pagina cu conținut nu conține elementele obișnuite care formează o pagină ASP.NET, cum ar fi html. corp sau formă. În schimb, se adaugă numai conținutul care ar trebui afișat pe pagina principală în zonele create ale prototipului de conținut.

Adăugarea conținutului la pagina principală

Treceți la vizualizarea Design.

Controalele ContentPlaceHolder de pe pagina principală sunt afișate sub formă de controale de conținut pe noua pagină de conținut. Restul conținutului paginii principale este afișat astfel încât să puteți vedea marcajul. Cu toate acestea, acesta este afișat în modul inaccesibil, deci nu poate fi modificat în timp ce pagina de conținut este modificată.

În lista derulantă din fereastra Proprietăți, dați clic pe DOCUMENT și setați valoarea Header în pagina principală Contoso.

Antetul poate fi setat pentru fiecare pagină independent, astfel încât titlul corect să fie afișat în browser atunci când conținutul este fuzionat cu pagina principală. Informațiile antetului sunt stocate în direcția @ Page a paginii de conținut.

În controlul conținutului. care corespunde cu obiectul ContentPlaceHolder1 de pe pagina principală, introduceți Bun venit pe site-ul Contoso.

Selectați textul și apoi formatați-l ca titlu, selectând rubrica 1 din lista derulantă Block Format de deasupra barei de elemente.

Apăsați Enter pentru a crea o nouă linie necompletată în controlul conținutului. și apoi introduceți Vă mulțumim că vizitați site-ul nostru.

Testul nu este important, puteți scrie orice text care vă va ajuta să recunoașteți această pagină ca pagină principală.

Pagina Despre poate fi creată în același mod ca pagina principală.

Crearea paginii Despre

Utilizați aceiași pași ca și pentru pagina principală pentru a adăuga o nouă pagină de conținut numită About.aspx.

Asigurați-vă că noua pagină este atașată la pagina Master1.master, așa cum sa făcut cu pagina principală.

Modificați titlul paginii la pagina Contoso.

În zona de conținut, tipul Despre Contoso, apoi formatați textul ca rubrica 1. selectarea textului și sensul poziției 1 din caseta listă verticală de pe panoul Format.

Apăsați Enter pentru a crea o linie nouă, apoi tastați Începând cu 1982 Contoso oferă produse software de înaltă calitate.

Proprietatea Master a conținutului paginii returnează un link către pagina principală, așa cum este definită în directiva @ MasterType. adăugați la pasul 3.

Testarea link-ului către proprietatea paginii principale

Accesați pagina Home.aspx sau deschideți-o și apăsați CTRL + F5.

Pagina se va deschide în browser cu textul Bun venit pe site-ul Contoso

Accesați pagina de cod Master1.master sau deschideți-o.

Schimbați procedura de tratare a paginilor. pentru a atribui proprietății un alt nume de companie, ca în exemplul următor.

În unele cazuri, poate fi necesar să modificați dinamic paginile principale, adică să utilizați codul pentru a seta pagina de pornire pentru pagina de conținut. De exemplu, trebuie să permiteți utilizatorilor să selecteze din mai multe planuri și să stabilească pagina de pornire în funcție de preferințele lor.

În această parte a walkthrough-ului, va fi adăugată o altă pagină principală pe site-ul Web, iar apoi vor fi create butoanele care permit utilizatorilor să comute între prima și a doua pagină principală. Deoarece cele două pagini principale vor fi foarte asemănătoare, copiați prima pagină principală și schimbați-o pentru a acționa ca a doua pagină principală.

Creați o copie a paginii principale

În Solution Explorer, faceți clic dreapta pe Master1.master, apoi faceți clic pe Copy (Copiere).

Faceți clic cu butonul din dreapta pe numele site-ului Web, apoi faceți clic pe Paste.

Pagina principală va fi adăugată pe site-ul web numit Copy master1.master.

Faceți clic dreapta pe numele Copy master1.master. selectați Redenumire și apoi specificați numele noii pagini master Master2.master.

Deschideți Master2.master și modificați atributul Master1 la Master2 în direcția @ Master.

Directiva completă a paginii va fi similară cu cea din codul din exemplul următor.

Următorul pas este adăugarea unui buton la fiecare pagină principală, care va permite utilizatorilor să selecteze o pagină de pornire alternativă.

Adăugarea butoanelor pentru a selecta o pagină de pornire alternativă

Accesați pagina Master2.master sau deschideți-o.

În caseta de instrumente, trageți un nod de control standard, LinkButton pe pagină și puneți-l în meniul din partea de sus a celulei de masă.

Setați proprietatea text a butonului Colorat.

Faceți dublu clic pe buton pentru a crea funcția Handler pentru evenimentul Click. și apoi adăugați următorul cod evidențiat:

Codul specifică valoarea valorii curente pagina MasterPageFile într-o variabilă sesiune când deține. Acest cod trebuie executat în modulul handler Page_PreInit; nu se poate face în handler, care începe un pic mai târziu decât handler Page_PreInit (de exemplu, în handler Page_Init), deoarece pagina principală ar trebui să fie stabilite astfel încât pagina poate crea o copie a acestuia la toate următoarea inițializare.

Acum puteți testa paginile master dinamice.

Testarea paginilor master dinamice

În pagina About.aspx, apăsați CTRL + F5 pentru a porni pagina.

Pagina se deschide în browser, combinată cu pagina principală implicită Master1.master.

Faceți clic pe linkul Câmpie.

Pagina va fi afișată din nou, acum îmbinată cu pagina Master2.master, care nu conține o culoare de fundal.

Faceți clic pe linkul Colorful.

Pagina va fi afișată din nou folosind Master1.master.

Note privind utilizarea paginilor principale

Există câteva probleme despre care trebuie să știți atunci când lucrați cu pagina principală.

Într-o aplicație reală, este posibil ca informațiile cum ar fi numele companiei să fie stocate în fișierul de configurare și să fie citite direct pe paginile de conținut. Cu toate acestea, scenariul prezentat aici este o simplă ilustrare a modului în care se face trimitere la membrii paginii principale din paginile de conținut.

Membrii de pe pagina principală pot fi accesați chiar și fără includerea directivei @ MasterType. Cu toate acestea, trebuie să aduceți proprietatea Pagină pentru a face acest lucru. Treceți la tipul corespunzător al paginii principale (proprietatea Master este nulă dacă pagina nu conține pagina principală). Pentru mai multe informații, consultați Programarea activă a paginilor principale ASP.NET.

Puteți consulta comenzile de pe pagina principală utilizând metoda Master.FindControls. Pentru mai multe informații, consultați Programarea activă a paginilor principale ASP.NET.

Există mai multe probleme pe care ar trebui să le cunoașteți atunci când lucrați cu pagini master dinamice:

Scriptul pentru schimbarea paginilor principale este simplificat, astfel încât în ghidul pas cu pas să acordați atenție paginilor principale. Într-o aplicație reală, va trebui cel mai probabil să afișați selecția layout-urilor și apoi să salvați preferințele utilizatorilor utilizând profilurile. Pentru mai multe informații, consultați Înțelegerea proprietăților profilului ASP.NET.

Puteți configura site-ul Web astfel încât toate paginile să utilizeze aceeași pagină principală. Ați putea avea mai multe pagini care ar putea utiliza o pagină de pornire alternativă pe care o puteți personaliza în cod, în același mod în care se arată în această secțiune a ghidului. Pentru mai multe informații, consultați secțiunea "Definirea principalei pagini" din paginile principale ASP.NET.

Trebuie să adăugați cod din pagina Home.aspx la fiecare pagină în care doriți să înlocuiți pagina de pornire implicită.

Acest ghid pas-cu-pas arată funcționalitatea de bază a paginilor principale. Este posibil să trebuiască să experimentați caracteristicile suplimentare ale acestora. Iată câteva opțiuni:

Creați pagini principale care au mai multe prototipuri de conținut. Apoi puteți completa unul sau mai multe prototipuri cu conținutul fiecărei pagini afișate.

Determinați prototipurile de conținut utilizând conținutul implicit. Dacă pagina ASP.NET nu acceptă conținutul prototipului, pagina principală afișează conținutul implicit.

Aflați cum puteți pune paginile principale în interiorul paginilor principale pentru a crea componentele. Pentru mai multe informații, consultați paginile principale ASP.NET.

Articole similare

Pagina anterioară

Pagina următoare