bài 2 web part và các trang sharepoint

Mục tiêu bài họcTìm hiểu Web Part trên SharePoint Tìm hiểu các cách phát triển Web Part trên SharePoint Tìm hiểu các loại trang trên SharePoint Giới thiệu về SharePoint Designer 2010 để

Bài 2:

Web Part và các trang SharePoint

Nội dung bài cũ

Giới thiệu SharePoint 2010

Môi trường thực thi và môi trường phát triển SharePoint

Mô hình đối tượng trên SharePoint 2010

Solutions và Features trên SharePoint 2010

Mục tiêu bài học

Tìm hiểu Web Part trên SharePoint

Tìm hiểu các cách phát triển Web Part trên SharePoint

Tìm hiểu các loại trang trên SharePoint

Giới thiệu về SharePoint Designer 2010 để tùy biến, thiết

kế và xây dựng giải pháp SharePoint mà không cần viếtcode

Tìm hiểu Web Part trên SharePoint

Tìm hiểu các cách phát triển Web Part trên SharePoint

Tìm hiểu các loại trang trên SharePoint

Giới thiệu về SharePoint Designer 2010 để tùy biến, thiết

kế và xây dựng giải pháp SharePoint mà không cần viếtcode

SharePoint Web Part là gì?

SharePoint Web Part: là thành phần giao diện chính trêncác trang SharePoint

Web Part: cho phép người dùng thay đổi nội dung, vị trí,cách hiển thị và tác động tới các trang web, trực tiếp

trên trình duyệt

Web Part: hỗ trợ khả năng tùy biến (Customization) và

cá nhân hóa (Personalization)

SharePoint Web Part: là thành phần giao diện chính trêncác trang SharePoint

Web Part: cho phép người dùng thay đổi nội dung, vị trí,cách hiển thị và tác động tới các trang web, trực tiếp

trên trình duyệt

Web Part: hỗ trợ khả năng tùy biến (Customization) và

cá nhân hóa (Personalization)

DEMO Web Part có sẵn trên

SharePoint 2010

DEMO một số Web Part có sẵn trên SharePoint

Content Editor Web Part

Image Web Part

Site Users Web Part

Content Query Web Part

User Tasks Web Part

…

DEMO một số Web Part có sẵn trên SharePoint

Content Editor Web Part

Image Web Part

Site Users Web Part

Content Query Web Part

User Tasks Web Part

…

Lịch sử của Web Part

Windows SharePoint Services 3.0

• Tương thích ngược

với các nền tảng Web Part trước đó

Windows SharePoint Services 2.0

• Được thiết kế với

nền tảng Web Part đầu tiên sử dụng cho WSS 2.0

Microsoft® ASP.NET 2.0

• Được thiết kế với nền

tảng Web Part thống nhất

• Mềm dẻo và dễ mở

rộng hơn nền tảng cho WSS trước đó

• Không hỗ hỗ trợ và

tương thích với nền tảng Web Part WSS 2.0

Windows SharePoint Services 3.0

• Tương thích ngược

với các nền tảng Web Part trước đó

Cấu trúc một trang Web Part

Trang Web Part được thiết kế với…

Một thực thể của lớp WebPartManager

Một hoặc nhiều Web Part Zones

Có thể có Editor Zone và/hoặc Catalog Zone

Các loại Web Part trong

SharePoint 2010

WSS Web Parts

SharePoint Foundation Runtime ASP.NET 2.0 Runtime

ASP Web Parts

ASP Web Parts

Hybrid Web Parts

WSS v2 Runtime

Hybrid Web Parts

WSS Web Parts WSS Web Parts

Các loại Web Part trong

Nên sử dụng ASP.NET Web Parts

Có hai loại Web Part được hỗ trợ trên SharePoint

Nên sử dụng ASP.NET Web Parts

SharePoint Web Part với VS 2010

SharePoint Web Part với VS 2010

Web Part: Web part chuẩn

Là cách phát triển Web part truyền thống

Không có khả năng kéo thả các control để thiết kế

Visual Web Part: Web part trực quan

Là các phát triển Web Part mở rộng trong SharePoint 2010

Có khả năng kéo thả các control để thiết kế

Web Part: Web part chuẩn

Là cách phát triển Web part truyền thống

Không có khả năng kéo thả các control để thiết kế

Visual Web Part: Web part trực quan

Là các phát triển Web Part mở rộng trong SharePoint 2010

Có khả năng kéo thả các control để thiết kế

Khả năng tùy biến và cá nhân hóa

của Web Part

Khả năng tùy biến (Customizable) và khả năng cá nhânhóa (Personalizable) của Web Part cho phép các Web

Part được sử dụng cho nhiều mục đích khác nhau

Khả năng tùy biến được hiểu là bất cứ thay đổi nào đốivới Web Part đều tác động đến toàn bộ người dùng đang

Part được sử dụng cho nhiều mục đích khác nhau

Khả năng tùy biến được hiểu là bất cứ thay đổi nào đốivới Web Part đều tác động đến toàn bộ người dùng đang

Khả năng cá nhân hóa của Web Part

Khả năng cá nhân hóa được hiểu là một sự thay đổi nào

đó đối với Web Part sẽ chỉ có tác động với người thực

hiện sự thay đổi đó mà không ảnh hưởng tới những

người dùng khác

VD: người dùng có thể thay đổi địa chỉ Feed để mỗi khi

vào trang chủ thay vì hiển thị Feed do quản trị chỉ định,

web site sẽ hiển thị Feed do chính người dùng chỉ định mà không ảnh hưởng tới người dùng khác

Khả năng cá nhân hóa được hiểu là một sự thay đổi nào

đó đối với Web Part sẽ chỉ có tác động với người thực

hiện sự thay đổi đó mà không ảnh hưởng tới những

người dùng khác

VD: người dùng có thể thay đổi địa chỉ Feed để mỗi khi

vào trang chủ thay vì hiển thị Feed do quản trị chỉ định,

web site sẽ hiển thị Feed do chính người dùng chỉ định mà không ảnh hưởng tới người dùng khác

Demo:

Tùy biến WebPart trên SharePoint 2010

Cá nhân hóa WebPart trên SharePoint 2010

Demo: Kết nối giữa hai Web Part

Web Part: Element.xml

Web Part: *.cs

*.cs: Định nghĩa Web Part control

Thực thi các đoạn mã logic cho Web Part.

Web Part: Là một Web control được kế thừa từ lớp

WebPart trong namespace:

System.Web.UI.WebControls.WebParts

*.cs: Định nghĩa Web Part control

Thực thi các đoạn mã logic cho Web Part.

Web Part: Là một Web control được kế thừa từ lớp

WebPart trong namespace:

System.Web.UI.WebControls.WebParts

public class HelloWebPart : WebPart

Web Part: *.webpart

*.webpart: File mô tả cách hiển thị Web Part

Type: chỉ ra thư viện thực thi code logic cho Web Part;

Properties: các thuộc tính của Web part như: Title,

Description

Web Part: *.webpart

<property name="Title" type="string">VisualWebPart1</property>

<property name="Description" type="string">Visual WebPart</property>

<property name="Title" type="string">VisualWebPart1</property>

<property name="Description" type="string">Visual WebPart</property>

</properties>

</data>

</webPart>

</webParts>

Cá nhân hóa trên SharePoint

Cá nhân hóa được thực hiện thông qua trình đơn phía

góc phải trên cùng của trang SharePoint

Một Web Part hỗ trợ cá nhân hóa được khai báo thông

qua attribute Personalizable cho một Property nào đó

[Personalizable (PersonalizationScope.Shared),

WebBrowsable(false)]

public string XmlUrl {

get { return xmlUrl; }

set { xmlUrl = value; }}

[Personalizable (PersonalizationScope.Shared),

WebBrowsable(false)]

public string XmlUrl {

get { return xmlUrl; }

set { xmlUrl = value; }}

Web Part Properties

Web Part sử dụng các Properties để khởi tạo giá trị đầuvào cho Web Part

Người dùng có thể thay đổi các giá trị này trực tiếp trêntrình duyệt

Web Part sử dụng các Properties để khởi tạo giá trị đầuvào cho Web Part

Người dùng có thể thay đổi các giá trị này trực tiếp trêntrình duyệt

[Personalizable (PersonalizationScope.Shared),

WebBrowsable (false)]

public string XmlUrl {get; set; }

Web Part Properties

Người dùng không có khả năng cá nhân hóa Property này.

Tool Pane

GetEditorParts

The image cannot be displayed Your computer may not have enough memory to open the image, or the image may have been corrupted Restart your computer, and then open the file again If the red x still appears, you may have to delete the image and then insert it again.

WEB PART

EDITOR PART

EDITOR PART

COMMON PROPS

COMMON PROPS

GetEditorParts

ApplyChanges

SyncChanges

Thể hiện Properties thông qua

EditorPart

EditorPart

Là các control ASP.NET được hiển thị trên Tool Pane khi

người dùng chọn chức năng sửa đổi Web Part

Cho phép sửa đổi, xác thực các Property để truyền vào

cho Web Part.

Tạo EditorPart:

Tạo một lớp, kế thừa từ lớp EditorPart được định nghĩa

trong namespace System.Web.UI.WebControls.WebParts

EditorPart

Là các control ASP.NET được hiển thị trên Tool Pane khi

người dùng chọn chức năng sửa đổi Web Part

Cho phép sửa đổi, xác thực các Property để truyền vào

cho Web Part.

Tạo EditorPart:

Tạo một lớp, kế thừa từ lớp EditorPart được định nghĩa

trong namespace System.Web.UI.WebControls.WebParts

public class OPMLEditor : EditorPart

Tạo EditorPart

Tạo EditorPart:

Override phương thức CreateEditorParts bên trong lớp

Web Part để tải Editor Part do bạn tự định nghĩa

EditorPartCollection IWebEditable CreateEditorParts() {

List<EditorPart> editors = new List<EditorPart> (); editors.Add( new OPMLEditor());

return new EditorPartCollection(editors);

}

Demo:

Viết Web Part trực quan sử dụng Visual Studio 2010

Các trang SharePoint và UI

Các trang (pages) là thành phần cơ bản tạo nên giao

diện người dùng UI trên SharePoint

Có hai loại trang (chính) trên SharePoint

Application page

Site page

Cả hai loại trang trên SharePoint đều kế thừa bố cục

(layout) từ Master Page

Các trang (pages) là thành phần cơ bản tạo nên giao

diện người dùng UI trên SharePoint

Có hai loại trang (chính) trên SharePoint

Application page

Site page

Cả hai loại trang trên SharePoint đều kế thừa bố cục

(layout) từ Master Page

Các trang SharePoint và UI

Ngoài các trang, SharePoint cũng bao gồm các thành

phần khác tạo nên giao diện người dùng

Ngoài các trang, SharePoint cũng bao gồm các thành

phần khác tạo nên giao diện người dùng

Tham khảo: http://msdn.microsoft.com/en-us/library/ee539040.aspx

Application page

Application page dùng để thực thi một số chức năng

được dùng chung trên SharePoint

Application page là các file vật lý được lưu trên thư mụcgốc của SharePoint:

C:\Program Files\Common Files\Microsoft Shared\Web

Server Extensions\14\TEMPLATE\LAYOUTS

Application page dùng để thực thi một số chức năng

được dùng chung trên SharePoint

Application page là các file vật lý được lưu trên thư mụcgốc của SharePoint:

C:\Program Files\Common Files\Microsoft Shared\Web

Server Extensions\14\TEMPLATE\LAYOUTS

Application page

Application page được gắn trong Master page theo thứ

tự để tạo ra sự thống nhất về mặt giao diện trên

SharePoint

Application page không có khả năng sửa đổi sử dụng

SharePoint Designer

Ví dụ về Application page : Settings.aspx

Application page được gắn trong Master page theo thứ

tự để tạo ra sự thống nhất về mặt giao diện trên

SharePoint

Application page không có khả năng sửa đổi sử dụng

SharePoint Designer

Ví dụ về Application page : Settings.aspx

Tham khảo: http://msdn.microsoft.com/en-us/library/ee539040.aspx

Site page

Site page là các file được lưu ở trong cơ sở dữ liệu của

SharePoint

Ví dụ Site page : Default.aspx, NewForm.aspx

Site page có thể được tạo, chỉnh sửa và tùy biến bởi

người dùng

Có thể chỉnh sửa Site page sử dụng trình duyệt Web

hoặc SharePoint Designer

Site page bao gồm hai loại

Trang chuẩn: chứa text, ảnh, Web part và các thành phần khác

Trang Web Parts: chỉ chứa Web part trong các Web Part

Zone

Site page là các file được lưu ở trong cơ sở dữ liệu của

SharePoint

Ví dụ Site page : Default.aspx, NewForm.aspx

Site page có thể được tạo, chỉnh sửa và tùy biến bởi

người dùng

Có thể chỉnh sửa Site page sử dụng trình duyệt Web

hoặc SharePoint Designer

Site page bao gồm hai loại

Trang chuẩn: chứa text, ảnh, Web part và các thành phần khác

Trang Web Parts: chỉ chứa Web part trong các Web Part

Zone

Master Page

Master page định nghĩa một cấu trúc chung cho các

trang trên SharePoint

Master page đem đến sự thống nhất về mặt giao diện

Master page định nghĩa một cấu trúc chung cho các

trang trên SharePoint

Master page đem đến sự thống nhất về mặt giao diện

SharePoint Designer 2010

Tạo định dạng các trang web

Xây dựng giải pháp tự động hóa quy trình

Thiết kế cách hiển thị web site…

Microsoft SharePoint Designer 2010 là công cụ thiết kếweb và ứng dụng được sử dụng để tùy biến SharePoint

và các ứng dụng

Sử dụng SharePoint Designer chúng ta có thể:

Tạo định dạng các trang web

Xây dựng giải pháp tự động hóa quy trình

Thiết kế cách hiển thị web site…

Giao diện SharePoint Designer 2010

Giao diện SharePoint Designer 2010

Demo:

Sử dụng SharePoint Designer 2010 để định dạng lại dữ

liệu hiển thị trên Web Part

Web Part chuẩn

Web Part trực quan

Chúng ta có thể viết Web Part để hỗ trợ các khả năng

Web Part chuẩn

Web Part trực quan

Chúng ta có thể viết Web Part để hỗ trợ các khả năng

SharePoint Designer 2010 được sử dụng như là một

công cụ thiết kế và xây dựng giải pháp không cần codetrên SharePoint

SharePoint có hai lại trang triển khai và sử dụng với cácmục đích khác nhau

Application Page

Site Page

SharePoint Designer 2010 được sử dụng như là một

công cụ thiết kế và xây dựng giải pháp không cần codetrên SharePoint

Danh sách tham khảo