Lecture07 dreamwave BANG TRINHBAYTRANG

BẢNG – FORM- TRÌNH BÀY TRANG BẢNG  KẺ BẢNG Cách kẻ bảng: Insert/Table, click nút Table  Rows: số dòng cần chèn  Columns: số cột cần chèn  Width: chiều rộng bảng theo số điểm pixels phần trăm  Border: độ dầy đường viền bảng  Cell Padding: khỏang cách nội dung ô biên ô  Cell Spacing: khoảng cách ô BẢNG BẢNG HIỆU CHỈNH BẢNG a) Chèn thêm dòng, cột vào bảng:  Đặt dấu nháy vị trí cần chèn  Modifytable Insert row/Insert column  Cột mặc định chèn vào bên trái dấu nháy  Dòng mặc định chèn vào bên dấu nháy b) Xoá dòng, cột, bảng  Chọn dòng, cột, bảng cần xóa  Edit/Cut (Ctrl +X) nhấn delete BẢNG c) d) Nối ô bảng:  Chọn ô cần nối  ModifyTable Merge Cells Tách ô bảng:  Chọn ô cần tách  ModifyTable Splits Cell  Split Cell into Columns: tách ô thành nhiều ô theo cột  Split Cell into Rows: tách ô thành nhiều ô theo dòng  Number of columns, Rows: xác định số ô cần tách theo cột, dòng BẢNG THUỘC TÍNH CỦA BẢNG: Chọn table mở Properties inspector  Rows, Cols : số dòng, số cột  W, H : chiều rộng, chiều cao bảng  Cellpad : khoảng cách văn đến ô bảng  Cellspace : khoảng càch ô bảng  Align : canh lề bảng, phải, trái,  Border : độ dày nét đường viền bảng  Bg color : màu bảng  Bg image : ảnh bảng  Brdr color : màu đường viền bảng FORM TẠO FORM:  Chọn menu Insert/ Form   Đường khuôn viền không liền nét màu đỏ đại diện cho giới hạn form Mọi thành phần form phải nằm khuôn viên Trong form cần thiết phải có nút đặc biệt “SUBMIT” “RESET” FORM CÁC ĐỐI TƯỢNG TRÊN FORM Có cách để chèn đối tượng vào form  Cách 1:Chọn tab form Insert Panel  Cách 2:Chọn menu Insert FormChọn đối tượng a) TEXT FIELD:Hộp văn  Cách tạo: − Đặt trỏ đường viền form − Chọn thực đơn Insert Form Text field FORM  Thuộc tính củaTextfield : − Chart Width : Số ký tự cho chiều dài ô − Max Chars : Số ký tự nhiều nhận − Init Value : Nội dung khởi tạo ô nhập liệu − Single Line : Ô nhập liệu dòng − Multi line : Ô nhập liệu nhiều dòng − Password : Ô nhập loại mật mã, nhập liệu ký tự nhập thay dấu “ * ” FORM b) RADIO BUTTON : Trong nhóm nút chọn chọn tùy chọn Các nút radio thuộc nhóm phải có tên nhóm (Group), khác giá trị(value)  Cách tạo: − − Đặt dấu nháy vị trí muốn chèn Chọn insert Form radio Button Thuộc tính Radio button:  − − − − Checked value : Giá trị nút đơn nhóm Initial State : trạng thái ban đầu nút Checked: Nút đựơc chọn Unchecked: Nút chưa chọn BEHAVIORS – – Một đối tượng trang thường kèm với Behaviors, có trường hợp đối tượng có nhiều biến cố, tuỳ thuộc vào trình tự Behaviors mà chương trình kiểm tra biến cố Nếu đối tượng có nhiều Behaviors mà Behaviors lại có loại biến cố (nhưng khác hành động) biến cố xảy ra, hành động thực BEHAVIORS  Behaviors Panel Mở Behaviors Panel: – Chọn Window  Behaviors Xuất Behaviors Panel – Chọn đối tượng gắn Behaviors – Tuỳ thuộc vào việc chọn đối tượng khác mà Behaviors tự chọn loại biến cố phù hợp cho phép thực số hành động tương ứng đối tượng – Đối tượng chọn hiển thị Behaviors Panel dạng Actions, tên thẻ HTML kế bên từ Actions BEHAVIORS BEHAVIORS  Thêm, xoá Behaviors  Thêm Behaviors: − Click nút (+) chọn hành động danh sách − Một biến cố tương ứng xuất (có thể hiệu chỉnh lại)  Xoá Behaviors: − Chọn dòng Behaviors cần xoá danh sách − Click nút (-) BEHAVIORS  Thay đổi trình tự Behaviors  Tuỳ thuộc vào trình tự Behaviors mà hành động theo trình tự thực Có hành động ngang cấp không cần trình tự  Các Behaviors khác biến cố Ví dụ: ảnh có biến cố khác onMouseOut OnMouseOver, không cần quan tâm đến trình tự  Các Behaviors có biến cố: Trong trường hợp này, phải xếp trình tự có kết mong muốn Cách xếp: BEHAVIORS Chọn Behaviors cần xếp − Click nút để xếp Thay đổi biến cố: Khi hành động chọn biến cố tương ứng gán cho Behavior Khi biến cố khôngphù hợp, ta thay đổi biến cố khác cách: – Chọn dòng Behaviors chứa biến cố cần thay đổi, – Click chuột vào mũi tên dòng Behaviors −  BEHAVIORS  Tên ý nghĩa biến cố • • • • • • OnAbort: Khi ngưng tải ảnh OnAfterUpdate: Khi trang thực xong cập nhật nguồn liệu OnBeforeUpdate: trước trang thực cập nhật nguồn liệu OnBlur: đối tựơng chọn không trạng thái hành OnBounce: Khi nội dung Marquee đến biên Marquee OnChange: Khi có thay đổi Textfield hay List/menu form BEHAVIORS • • • • • • • • • • • Onclick: Khi Click chuột vào đối tượng OnDblClick: Khi Double Click vào đối tượng OnError: Khi xảy lỗi trang trình duyệt OnFinish: nội dung Marquee hết vòng OnFocus:Khi nhập nội dung vào TextField OnKeyDown: Khi nhấn phím xuống OnkeyUp: Khi thả phím OnKeyPress:Khi nhấn phím thả OnLoad:Khi hoàn tất việc tải trang OnMouseDown: Khi nhấn chuột xuống OnMouseMove: Khi di chuyển chuột BEHAVIORS • • • • • • • OnMouseOut:Khi di chuyển chuột nút OnMouseOver: Khi di chuyển ngang qua nút OnMouseUp: Khi thả chuột OnMove: cửa sổ khung di chuyển OnReadyStateChange: Trạng thái thành phần thay đổi, trạng thái gồm: Uninitialized, loading, complete Onreset: Khi Form trả giá trị mặc định OnResize: cửa sổ khung thay đổi kích thước BEHAVIORS • • • • • • • OnRowEnter: Khi nguồn liệu có thêm dòng OnRowExit: dòng liệu tồn OnScroll: Khi cuộn cuộn OnSelect: Khi chọn Text, MenuItem List/menu OnStart: Khi nội dung Marquee bắt đầu vòng OnSubmit: Khi gửi Form OnUnload: Khi rời khỏi trang BEHAVIORS  Hiệu chỉnh Behaviors  Cập nhật behavious: Một Behavior sau tạo xuất danh sách Behavior, ta cập nhật, thay đổi thông tin Behavior cách: – Chọn đối tượng có Behavior – Mở Behavior Panel – Double Click Behavior muốn cập nhật – Thực việc chỉnh sửa BEHAVIORS  Thay đổi thuộc tính behavious: Thay đổi thuộc tính đối tượng xem trang việc làm thú vị, thao tác đơn giản tạo hiệu ứng lạ ẩn chuyển động đối tượng BEHAVIORS Ví dụ: Nút tạo ẩn đối tượng Khi có số lớp ảnh xếp chồng lên nhau, bạn thay đổi thuộc tính ẩn chúng Cách tạo:  Tạo trang  Chèn Layer chứa ảnh thứ  Nhập Layer ID: Layer  Chèn Layer 2, hiệu chỉnh sau cho toạ độ với Layer BEHAVIORS  Tạo Behavior điều khiển: − Chọn nút điều khiển góc hình − Gán Behavior: chọn change properties − Xuất hộp thoại Change Properties: Trong danh sách Type of Object: chọn Layer − Name Object: nhập layer1 − Property: Chọn Select: style.Visibility − New Value: Hidden  OK đóng hộp thoại − Trong Behavior Panel chọn tên biến cố OnMouseOver BEHAVIORS  Tạo thêm Behavior cho nút này, hộp thoại Change Properties: − Nhập thông số tương tự, ô New value: nhập visible − Trong Behavior, thay tên biến cố onMouseOut