Bài giảng ASP.Net - Chương 6: Thiết kế Layout

Giới thiệu

 Themes là tập hợp các khai báo thuộc tính về hình

thức hiển thị(màu sắc, nét chữ, . . .) của điều khiển

 Dùng áp dụng chung cho tất cả các trong trong một

ứng dụng hoặc tất cả các ứng dụng trên webserver

 Themes được tạo từ các thành phần: skin, css,

images . . . Tối thiểu phải có skin. Các thành phần này

đặt trong thư mục App_Themes

 Skin là một tập tin có phần mở rộng là .skin, chứa các

tag tạo ra các server control kèm theo các khai báo

thuộc tính.1212

 Có 2 loại skin:

Default skin: Không khai báo thuộc tính skinID, mặc

định ứng dụng sẽ áp dụng skin này cho tất cả các

điều khiểnco1 cùng kiểu khai báo.

Named skin: có khai báo thuộc tính skinID, muốn

sử dụng thì phải khai báo tường minh trên điều khiển

cụ thể.

 Tạo file skin:

Thêm mới 1 item1313

 Tạo file skin:

Thêm mới 1 itemchọn skin fileđặt tên file .ski

 

pdf25 trang | Chia sẻ: trungkhoi17 | Lượt xem: 459 | Lượt tải: 0download
Bạn đang xem trước 20 trang tài liệu Bài giảng ASP.Net - Chương 6: Thiết kế Layout, để xem tài liệu hoàn chỉnh bạn click vào nút DOWNLOAD ở trên
1Chương 06 THIẾT KẾ LAYOUT 1.Web User controls 2.Master Pages 3.Themes Và Skin 4.Site Navigation Controls by: Dương Thành Phết 21. Web User controls 1.1 Giới thiệu Khi kết hợp các control ñể tạo thành một control mới gọi là Web user control (UC)  Sử dụng UC cũng giống như sử dụng thủ tục, hàm  khả năng tái sử dụng UC trên các trang web  Phần mở rộng của US là: .ascx by: Dương Thành Phết 31.2 Tạo và sử dụng User control Tạo mới User control:  Tạo mới 1 Web user control  Thiết kế giống như thiết kế 1 trang aspx by: Dương Thành Phết Chọn: Web User Control ðặt tên: *.ascx 4Sử dụng User control:  Kéo và thả UC vào trang aspx, lúc ñó trang aspx sẽ xuất hiện tag by: Dương Thành Phết 52. Master Pages 2.1 Giới thiệu  Master pages cho phép tạo 1 bố cục nhất quán trên các trang web trong cùng 1 website (tương tự template)  Nội dung thể hiển trên trình duyệt là sự kết hợp giữa trang .master -master page và trang .aspx (hoặc .ascx) - content page by: Dương Thành Phết  Master page là tập tin có phần mở rộng .master  Thao tác thiết kế: Giống như trang aspx, nhưng phải bổ sung ít nhất một ñiều khiển ContentPlaceHolder 6 by: Dương Thành Phết Master page Content page Trang kết quả 72.2 Tạo trang Master  Bước 1: Tạo mới Item  chọn icon Master Page và ñặt tên trang: *.master by: Dương Thành Phết 8 Bước 2: Thiết kế bố cục chung (có thể sử dụng User control) và bổ sung ContentplaceHolder vào trang master by: Dương Thành Phết 92.3 Sử dụng trang Master  Bước 1: Tạo mới trang web (.aspx) khai báo sử dụng trang master by: Dương Thành Phết 10  Bước 2: Thiết kế bổ sung nội dụng trên trang *.aspx (có thể kéo các User control vào) by: Dương Thành Phết 11 3. Themes Và Skin by: Dương Thành Phết 3.1 Giới thiệu  Themes là tập hợp các khai báo thuộc tính về hình thức hiển thị(màu sắc, nét chữ, . . .) của ñiều khiển  Dùng áp dụng chung cho tất cả các trong trong một ứng dụng hoặc tất cả các ứng dụng trên webserver  Themes ñược tạo từ các thành phần: skin, css, images . . . Tối thiểu phải có skin. Các thành phần này ñặt trong thư mục App_Themes  Skin là một tập tin có phần mở rộng là .skin, chứa các tag tạo ra các server control kèm theo các khai báo thuộc tính. 12 by: Dương Thành Phết  Có 2 loại skin:  Default skin: Không khai báo thuộc tính skinID, mặc ñịnh ứng dụng sẽ áp dụng skin này cho tất cả các ñiều khiểnco1 cùng kiểu khai báo.  Named skin: có khai báo thuộc tính skinID, muốn sử dụng thì phải khai báo tường minh trên ñiều khiển cụ thể.  Tạo file skin:  Thêm mới 1 item 13 by: Dương Thành Phết  Tạo file skin:  Thêm mới 1 itemchọn skin fileñặt tên file .skin 14 by: Dương Thành Phết  Tạo Theme:  Click phải ProjectAdd ASP.NET FolderTheme 15 4. Site Navigation Controls by: Dương Thành Phết Giới thiệu  Dùng ñể chuyển ñến một trang web khác và thể hiện cấu trúc logic của website (sitemap). Gồm các ñiều khiển: Menu, TreeView, SiteMapPath kết hợp với SiteMapDataSource  Các ñiều khiển này thường sử dụng trong trang Master 16 4.1 ðiều khiển Menu by: Dương Thành Phết Dùng thể hiện menu và cho phép người dùng chuyển ñến một trang web khác khi chọn một chức năng Thao tác tạo: Tạo ñiều khiển Menu vào trang web Chọn mẫu ñịnh dạng Thiết kế Menu 17 by: Dương Thành Phết Auto Format: Chọn mẫu ñịnh dạng 18 by: Dương Thành Phết  Edit Menu Items: Thiết kế Menu 19 4.2 ðiều khiển TreeView by: Dương Thành Phết Dùng thể hiện menu ở dạng cây và cho phép người dùng chuyển ñến một trang web khác khi chọn node Thao tác tạo: Tạo ñiều khiển TreeView vào trang web Chọn mẫu ñịnh dạng Thiết kế các node 20 by: Dương Thành Phết Auto Format: Chọn mẫu ñịnh dạng 21 by: Dương Thành Phết  Edit Node: Thiết kế các node 22 4.3 ðiều khiển SiteMapPath by: Dương Thành Phết Dùng thể hiện cấu trúc logic của website và cho phép người dùng chuyển ñến một trang web khác Nội dung cấu trúc của Website mặc ñịnh ñược chứa trong tập tin Web.sitemap Thao tác tạo: Tạo tập tin Web.sitemap 23 by: Dương Thành Phết Nút gốc Tạo ñiều khiển SitemapPath vào các trang Nút con Nút cháu 24 by: Dương Thành Phết Kết quả 25 4.4 ðiều khiển SiteMapDataSource by: Dương Thành Phết Dùng ñể chứa nguồn dữ liệu lưu trữ trong tập tin Web.sitemap  Thường sử dụng kết hợp với các ñiều khiển Menu, TreeView  ðể liên kết với TreeView, Menu chỉ ñịnh thuộc tính DataSourceID của 2 ñiều khiển này là: Tên SiteMapDataSource

Các file đính kèm theo tài liệu này:

  • pdfbai_giang_asp_net_chuong_6_thiet_ke_layout.pdf
Tài liệu liên quan