Manual de SharePoint 2010

Tutoriales para programadores

Este documento se proporciona "tal cual". Es posible que la información y las vistas mencionadas en este documento, incluidas la dirección URL y otras referencias de sitio web de Internet, cambien si previo aviso.

El usuario asume el riesgo de su uso.

Algunos ejemplos descritos en este documento se proporcionan únicamente con fines ilustrativos y son ficticios. No se pretende indicar ni debe deducirse ninguna asociación ni conexión real.

Este documento no proporciona derecho legal alguno sobre cualquier propiedad intelectual de un producto de Microsoft. Este documento puede copiarse y usarse para fines internos y de referencia. © 2010 Microsoft. Reservados todos los derechos.

Microsoft, SharePoint, Visual Studio, InfoPath y Visio son marcas comerciales del grupo de compañías de Microsoft. Todas las demás marcas comerciales pertenecen a sus respectivos propietarios.

Página 1

Tutoriales para programadores de SharePoint 2010

Contenido Ejercicio 1: tutorial sobre elementos web y LINQ .................................................................................................. 4 Tarea 1: creación de un nuevo proyecto de SharePoint ................................................................................... 4 Tarea 2: generación de la clase de proxy LINQ-to-SharePoint para obtener acceso a datos de listas ............ 7 Tarea 3: acceso a datos de listas de SharePoint en el elemento web visual ................................................... 9 Tarea 4: creación e implementación del elemento web visual ........................................................................ 11 Ejercicio 2: creación de un tipo de contenido externo de BCS ............................................................................ 16 Tarea 1: creación de un proyecto de modelo de conectividad a datos empresariales ................................... 16 Tarea 2: actualización del esquema de la clase de entidad ............................................................................ 18 Tarea 3: actualización del código del servicio ................................................................................................. 28 Tarea 4: creación e implementación ................................................................................................................ 30 Ejercicio 3: creación de una aplicación de Silverlight para el modelo de objetos de cliente de SharePoint ....... 34 Tarea 1: creación de un proyecto de aplicación de Silverlight ........................................................................ 34 Tarea 2: escritura de código para obtener acceso a datos de listas de SharePoint y representarlos ............ 36 Tarea 3: implementación y prueba mediante el elemento web de Silverlight de SharePoint ......................... 40 Ejercicio 4: creación de un gráfico mediante el modelo de objetos de SharePoint y los controles de gráficos de Silverlight .............................................................................................................................................................. 42 Tarea 1: creación de un proyecto de aplicación de Silverlight ........................................................................ 42 Tarea 2: escritura de código para obtener acceso a datos de la lista Employee de SharePoint y mostrarlos en un control de gráficos de Silverlight ............................................................................................................ 46 Tarea 3: implementación y prueba mediante el elemento web de Silverlight de SharePoint ......................... 49 Ejercicio 5: creación de un elemento web para una solución de espacio aislado ............................................... 53 Tarea 1: creación de un proyecto de solución de espacio aislado con un elemento web .............................. 53 Tarea 2: adición de código para proporcionar la funcionalidad de consulta y presentación ........................... 55 Tarea 3: generación e implementación de la solución de espacio aislado ..................................................... 58 Ejercicio 6: creación de una actividad para su uso en un flujo de trabajo de SharePoint Designer.................... 63 Tarea 1: creación y preparación del proyecto ................................................................................................. 63 Tarea 2: creación de una actividad de flujo de trabajo para su uso por el flujo de trabajo reutilizable ........... 64 Tarea 3: adición de código para crear una biblioteca de documentos basada en los parámetros pasados a la actividad ........................................................................................................................................................... 66 Tarea 4: configuración de la actividad para la implementación....................................................................... 69 Tarea 5: adición de la actividad SPDActivityDemo para su implementación con SPCHOL305Ex1. .............. 73 Tarea 6: configuración de una característica mediante el diseñador de características ................................ 75 Tarea 7: adición y codificación de un receptor de características ................................................................... 75 Tarea 8: creación de un flujo de trabajo reutilizable mediante SharePoint Designer...................................... 76 Tarea 9: importación del flujo de trabajo reutilizable a Visual Studio .............................................................. 84 Tarea 10: asociación del flujo de trabajo con una lista en SharePoint ............................................................ 91 Resumen del tutorial ............................................................................................................................................ 93

Página 2

Tutoriales para programadores de SharePoint 2010

A continuación se incluyen seis tutoriales de C# sobre escenarios exclusivos que los programadores profesionales pueden llevar a cabo en SharePoint 2010 con Visual Studio 2010.

Observará que en estos tutoriales se proporcionan las instantáneas suficientes para leer el documento sin que sea necesario el acceso al software. Estos tutoriales para programadores también se encuentran disponibles como laboratorios prácticos como parte de este curso de eLearning en línea: http://msdn.microsoft.com/es-es/sharepoint/ee513147.aspx. También se ofrecen laboratorios adicionales, vídeos, entornos de laboratorio virtuales en línea y ejemplos de código, y los laboratorios prácticos se encuentran disponibles en C# y VB.NET. Para proporcionar comentarios sobre esta guía, envíe un mensaje de correo electrónico a sp2010fb@Microsoft.com.

Página 3

Tutoriales para programadores de SharePoint 2010

Ejercicio 1: tutorial sobre elementos web y LINQ Tiempo estimado para completar este ejercicio: 10 minutos En este ejercicio, desarrollará e implementará un elemento web visual que leerá los datos de una lista y los mostrará en una cuadrícula de datos. En este ejercicio: 1. Creará un elemento web visual.

2. Generará código proxy de LINQ. 3. Usará un proveedor LINQ para leer datos de una lista de SharePoint.

4. Representará los datos mediante el control web SPDataGrid.

Tarea 1: creación de un nuevo proyecto de SharePoint En esta tarea, se creará una solución y un proyecto. Se incluirá el resto del trabajo de desarrollo del Ejercicio 1 de esta práctica.

1. Abra Visual Studio 2010; para ello, vaya a Menú Inicio | Todos los programas | Microsoft Visual Studio 2010 | Microsoft Visual Studio 2010.

2. En el menú, seleccione Archivo | Nuevo | Proyecto.

3. En el cuadro de diálogo Nuevo proyecto, elija Visual C# | SharePoint | 2010 en Plantillas instaladas.

4. Seleccione Elemento web visual en los elementos del proyecto.

Figura 1 - Proyecto de elemento web visual de SharePoint 2010

5. Escriba SPCHOL200-Ex1 en el cuadro de texto Nombre.

Página 4

Tutoriales para programadores de SharePoint 2010

6. Escriba C:\SPHOLS\SPCHOL200\CS\Ex1 en el cuadro de texto Ubicación.

7. Desactive Crear directorio para la solución.

8. Haga clic en Aceptar.

9. En el Asistente para personalizar SharePoint: 

Escriba http://intranet.contoso.com/ para el sitio local.



Establezca el nivel de confianza en Implementar como solución de granja de servidores.



Haga clic en el botón Finalizar.

Figura 2 - Asistente para personalizar SharePoint

10. Visual Studio creará el nuevo proyecto SPCHOL200-Ex1 y agregará los archivos necesarios.

Página 5

Tutoriales para programadores de SharePoint 2010

Figura 3 - Proyecto SPCHOL200-Ex1

11. Observe que Visual Studio también creará un elemento web denominado VisualWebPart1. En el Explorador de soluciones, expanda VisualWebPart1 y abra VisualWebPart1.webpart.

Figura 4 - Elemento web visual

12. Cambie el valor del elemento de propiedad con el valor de atributo de nombre Title por SPLinqDemoTitle y el valor del elemento de propiedad con el valor de atributo de nombre Description por SPLinqDemoPart Description. Se cambiarán las propiedades Title y Description del elemento web visual una vez implementado. Guarde el archivo. <properties> <property name="Title" type="string">SPLinqDemoTitle</property> <property name="Description" type="string">SPLinqDemoPart Description</property> </properties>

Página 6

Tutoriales para programadores de SharePoint 2010

Tarea 2: generación de la clase de proxy LINQ-to-SharePoint para obtener acceso a datos de listas En esta tarea, usará la nueva utilidad de generación de código spmetal.exe y generará el código proxy de LINQ-to-SharePoint.

1. En el Explorador de soluciones, haga clic con el botón secundario en SPCHOL200-Ex1 y seleccione Abrir carpeta en el Explorador de Windows.

2. Mantenga presionada la tecla Mayúsculas y haga clic con el botón secundario en cualquier lugar de la ventana del Explorador y seleccione Abrir ventana de comandos aquí para abrir la ventana del símbolo del sistema en el directorio del proyecto actual:

Figura 5 - Abrir ventana de comandos aquí

3. Escriba el siguiente comando en el símbolo del sistema y presione ENTRAR para establecer la ruta de acceso a la carpeta de SharePoint 2010: set path=%path%;c:\archivos de programa\common files\microsoft shared\web server extensions\14\bin 4. Escriba el siguiente comando en el símbolo del sistema y presione ENTRAR para generar el código proxy de LINQ-to-SharePoint. spmetal.exe /web:http://intranet.contoso.com /namespace:SPCHOL200_Ex1.VisualWebPart1 /code:SPLinq.cs

Nota: es posible que reciba advertencias sobre tipos de contenido de plantillas de formulario de listas. Puede pasar por alto esta advertencia sin ningún riesgo y continuar.

5. Cierre la ventana Comandos y vuelva a Visual Studio.

6. En Visual Studio, haga clic con el botón secundario en el proyecto SPCHOL200-Ex1 y seleccione Agregar | Elemento existente.

Página 7

Tutoriales para programadores de SharePoint 2010

Figura 6 - Agregar elemento existente

7. Seleccione SPLinq.cs en la ventana de di谩logo Agregar elemento existente y haga clic en Agregar:

Figura 7 - Adici贸n del archivo SPLinq.cs

8. En el Explorador de soluciones, haga clic con el bot贸n secundario en References y seleccione Agregar referencia.

9. Cambie a la ficha Examinar y escriba C:\Archivos de programa\Common Files\Microsoft Shared\Web Server Extensions\14\ISAPI en el cuadro de texto Nombre. Presione ENTRAR P谩gina 8

Tutoriales para programadores de SharePoint 2010

para cambiar el directorio. La ventana Agregar referencia debería mostrarse ahora como la figura 8.

10. Seleccione Microsoft.SharePoint.Linq.dll.

Figura 8 - Adición de referencia

11. Haga clic en Aceptar para agregar la referencia al proyecto.

Tarea 3: acceso a datos de listas de SharePoint en el elemento web visual En esta tarea, agregará código a la solución que permitirá al elemento web visual recuperar datos de listas de SharePoint.

1. En el Explorador de soluciones, expanda VisualWebPart1 y haga doble clic en VisualWebPart1UserControl.ascx.

2. Visual Studio abrirá el control de usuario del elemento web visual.

3. Agregue el siguiente código al control de usuario para crear la vista de cuadrícula.

Página 9

Tutoriales para programadores de SharePoint 2010

<%@ Import Namespace="Microsoft.SharePoint.WebControls" %> <SharePoint:SPGridView id="spGridView" runat="server" AutoGenerateColumns="false"> <HeaderStyle HorizontalAlign="Left" ForeColor="Navy" Font-Bold="true" /> <Columns> <SharePoint:SPBoundField DataField="Title" HeaderText="Title"></SharePoint:SPBoundField> <SharePoint:SPBoundField DataField="JobTitle" HeaderText="JobTitle"></SharePoint:SPBoundField> <SharePoint:SPBoundField DataField="ProjectTitle" HeaderText="ProjectTitle"></SharePoint:SPBoundField> <SharePoint:SPBoundField DataField="DueDate" HeaderText="DueDate"></SharePoint:SPBoundField> </Columns> </SharePoint:SPGridView>

Fragmentos de código: ASP.NET | spchol200_ex1_spgridview 4. El control de usuario del elemento web visual debería verse así una vez agregado el código anterior:

Figura 9 - Control de usuario del elemento web visual

5. En el Explorador de soluciones, haga clic con el botón secundario en VisualWebPart1UserControl.ascx y seleccione Ver código.

6. Agregue las siguientes instrucciones using al código subyacente: using Microsoft.SharePoint.Linq; using Microsoft.SharePoint; using System.Linq;

Fragmento de código: Mis fragmentos de código | spchol200_ex1_namespaces 7. Inserte el siguiente código en el método Page_Load: var dc = new SPLinqDataContext(SPContext.Current.Web.Url); var Employees = dc.GetList<EmployeesItem>("Employees");

Página 10

Tutoriales para programadores de SharePoint 2010

var empQuery = from emp in Employees where emp.Project.DueDate < DateTime.Now.AddMonths(6) select new { emp.Title, emp.JobTitle, ProjectTitle = emp.Project.Title, DueDate = emp.Project.DueDate.Value.ToShortDateString() }; spGridView.DataSource = empQuery; spGridView.DataBind();

Fragmento de código: Mis fragmentos de código | spchol200_ex1_pageload Tarea 4: creación e implementación del elemento web visual 1. En el Explorador de soluciones, haga clic con el botón secundario en SPCHOL200-Ex1 y seleccione Implementar. Se creará e implementará el elemento web visual en el sitio local de SharePoint: http://intranet.contoso.com

Figura 10 - Implementación del elemento web visual

2. Abra Internet Explorer y busque el siguiente sitio: http://intranet.contoso.com 3. Si se le pide autenticación, escriba los siguientes detalles.

Nombre de usuario: Administrator Contraseña: pass@word1 4. Haga clic en el icono Editar del menú principal para abrir la cinta de SharePoint para las herramientas de edición.

Página 11

Tutoriales para programadores de SharePoint 2010

Figura 11 – Icono Editar en SharePoint

Figura 12 - Cinta de SharePoint - Página Editar

5. Cambie a la ficha Insertar de la cinta de opciones y haga clic en Elemento web para insertar un elemento web en la página.

Página 12

Tutoriales para programadores de SharePoint 2010

Figura 13 - Cinta de SharePoint - Insertar Elemento web

6. En Categorías, seleccione Personalizado.

7. En Elementos web, seleccione el elemento web SPLinqDemoTitle.

Figura 14 - Selección del elemento web SPlinqDemoTitle

Coloque el cursor en el área de la página donde desea que aparezca el elemento web. Esta debe ser una zona que acepte elementos web. En este caso, coloque el cursor en la zona situada

Página 13

Tutoriales para programadores de SharePoint 2010

debajo del control Documentos compartidos.

Figura 15 - Zonas de diseño

8. Haga clic en Agregar para agregar el elemento web a la página. Se agregará el elemento web SPLinqDemoTitle a la zona de diseño seleccionada.

Página 14

Tutoriales para programadores de SharePoint 2010

Figura 16 - Elemento web SPLinqDemoTitle agregado a la zona de diseño

9. Haga clic en Página, haga clic en la flecha abajo del botón "Guardar y cerrar" y seleccione Detener la edición para guardar la página y detener la edición. Haga clic en Sí cuando se le pregunte si desea guardar los cambios realizados.

Figura 17 - Cinta de SharePoint - Detener la edición

10. Cierre Internet Explorer.

11. Cierre Visual Studio 2010.

En el ejercicio anterior, creó e implementó un elemento web visual que usa LINQ to SharePoint para recuperar datos de una lista de SharePoint.

Página 15

Tutoriales para programadores de SharePoint 2010

Ejercicio 2: creación de un tipo de contenido externo de BCS Este ejercicio le guiará en la creación de un tipo de contenido externo mediante la plantilla de proyecto del modelo BDC de Visual Studio 2010 y en la extensión del tipo de contenido externo.

Tarea 1: creación de un proyecto de modelo de conectividad a datos empresariales 1. Abra Visual Studio 2010; para ello, vaya a Menú Inicio | Todos los programas | Microsoft Visual Studio 2010 | Microsoft Visual Studio 2010 y, en el menú, seleccione Archivo | Nuevo | Proyecto.

2. Seleccione la plantilla de proyecto Modelo de conectividad a datos profesionales de Visual C# | SharePoint | 2010.

3. Escriba BDCEx1 en el cuadro de texto Nombre.

Figura 18 - Cuadro de diálogo Nuevo proyecto

4. Escriba C:\SPHOLS\SPCHOL304\CS\Ex1 en el cuadro de texto Ubicación.

5. Haga clic en Aceptar.

Página 16

Tutoriales para programadores de SharePoint 2010

6. Cambie la direcci贸n URL a http://intranet.contoso.com.

7. Seleccione el bot贸n de radio Implementar como soluci贸n de granja de servidores.

Figura 19 - Asistente para personalizar SharePoint

8. Haga clic en Finalizar.

P谩gina 17

Tutoriales para programadores de SharePoint 2010

Tarea 2: actualización del esquema de la clase de entidad 1. En el menú principal, seleccione Ver | Explorador de soluciones. En el Explorador de soluciones, cambie el nombre de Entity1.cs por Customer.cs y Entity1Service.cs por CustomerService.cs. Haga clic en Sí cuando se le pida mediante el siguiente aviso:

Figura 20 - Aviso de cambio de nombre del archivo de Visual Studio

2. Si todavía no se abrió, haga doble clic en Customer.cs en el Explorador de soluciones.

Reemplace el código del cuerpo de la clase Customer por el siguiente código. Se agregarán dos propiedades adicionales y se cambiará el tipo de una tercera propiedad como una asignación para los descriptores de tipo agregados y modificados en la definición de BDC. Tenga en cuenta que al cambiar Identifier1 por CustomerId, puede usar el glifo que aparece en el editor para cambiar el nombre de todas las referencias a Identifier1 del campo. Esto no lo ayudará en este caso, pero es una buena práctica.

public public public public

Int32 CustomerId { get; set; } string Message { get; set; } string FirstName { get; set; } string LastName { get; set; }

Fragmento de código: Mis fragmentos de código | spchol304_ex1_customer

Figura 21 - Clase Customer después de los cambios en el cuerpo

Página 18

Tutoriales para programadores de SharePoint 2010

Tarea 3: extensión de los metadatos de BCS para el tipo de contenido externo 1. En el Explorador de soluciones, abra BdcModel1.bdcm si todavía no se abrió el Diseñador de BDC.

Figura 22 - Explorador de soluciones mostrando BDCModel1.bdcm en el Diseñador de BDC

2. En el diseñador, seleccione la entidad Entity1; para ello, haga clic en el título.

Figura 23 - Entidad Entity1

3. Cambie el nombre de Entity1 por Customer; para ello, haga clic en el nombre Entity1 en el diseñador y presione F2 (como alternativa, puede cambiar el nombre en la cuadrícula Propiedades).

4. Resalte Identifier1 en el diseñador de entidades y presione F4 para abrir la cuadrícula de propiedades. Use la cuadrícula Propiedades para cambiar el nombre Identifier1 por CustomerId y cambiar su nombre de tipo por System.Int32.

Página 19

Tutoriales para programadores de SharePoint 2010

Figura 24 - Panel Propiedades después de cambiar el nombre de tipo

5. En el Explorador de BDC en Visual Studio, expanda Modelo | BdcModel1 | BdcModel1 | Customer | ReadList | returnParameter. Haga clic en Entity1List para abrir su cuadrícula de propiedades.

Figura 25 - Explorador de BDC resaltando Entity1List

6.

Mediante la cuadrícula Propiedades, cambie el nombre de Entity1List por CustomerList.

Página 20

Tutoriales para programadores de SharePoint 2010

7. En el Explorador de BDC, expanda CustomerList.

Figura 26 - Explorador de BDC resaltando Entity1

8. Mediante la cuadrícula Propiedades, cambie el nombre de Entity1 a Customer.

En el Explorador de BDC, expanda Customer y, mediante la cuadrícula Propiedades, cambie el nombre de Identifier1 a CustomerId y establezca el nombre de tipo en System.Int32.

Figura 27 - Cuadrícula Propiedades después de los cambios en Identifier1

Página 21

Tutoriales para programadores de SharePoint 2010

9. En el Explorador de BDC, haga clic con el botón secundario en Customer y seleccione Agregar descriptor de tipo.

Figura 28 - Menú contextual de la entidad Customer

10. Seleccione TypeDescriptor y, mediante la cuadrícula Propiedades, cambie Nombre a FirstName.

11. En el Explorador de BDC, haga clic con el botón secundario en Customer y seleccione Agregar descriptor de tipo.

12. Seleccione TypeDescriptor y, mediante la cuadrícula Propiedades, cambie Nombre a LastName.

Figura 29 - Entidad Customer en el Explorador de BDC después de la adición de los descriptores de tipo FirstName y LastName

13. En el Explorador de BDC, haga clic con el botón secundario en Customer y seleccione Copiar.

Figura 30 - Menú contextual de la entidad Customer

14. En el Explorador de BDC, expanda el método ReadItem , haga clic con el botón secundario en returnParameter y seleccione Pegar.

Página 22

Tutoriales para programadores de SharePoint 2010

Figura 31 – Menú contextual de returnParameter

15. Haga clic en Sí.

Figura 32 - Aviso de reemplazo del descriptor de tipo

16. Expanda returnParameter | Customer y confirme que los descriptores de tipo FirstName y LastName se copiaron correctamente.

Página 23

Tutoriales para programadores de SharePoint 2010

Figura 33 - Explorador de BDC despuĂŠs de los cambios realizados en los pasos 1 a 18 de la Tarea 1

PĂĄgina 24

Tutoriales para programadores de SharePoint 2010

17. En el Explorador de BDC, expanda ReadItem | id y seleccione Identifier1.

18. Mediante la cuadrícula Propiedades, cambie el nombre Identifier1 a CustomerId y establezca el nombre de tipo en System.Int32.

Figura 34 - Cuadrícula Propiedades después de los cambios en Identifier1

19. Mediante el panel Detalles de métodos de BDC, agregue un método Update

Figura 35 - Detalles de métodos de BDC agregando el método Update

Página 25

Tutoriales para programadores de SharePoint 2010

20. Agregue un parámetro y denomínelo id

.

Figura 36 - Adición del parámetro id al método Update

Página 26

Tutoriales para programadores de SharePoint 2010

21. Abra el nuevo método Update en la ventana Explorador de BDC. 22. Copie el descriptor de tipo de la descripción de tipo CustomerId del parámetro @id del método ReadItem al parámetro @id del método Update.

23. Cambie la propiedad Campo Pre-Updater del parámetro id para que sea True.

Figura 37 - Actualización del campo Pre-Updater a True

Página 27

Tutoriales para programadores de SharePoint 2010

Tarea 3: actualización del código del servicio 1. En el Explorador de soluciones, abra CustomerService.cs.

2. Reemplace el cuerpo de la clase CustomerService por el siguiente código. Se devolverá un cliente en función de un identificador determinado, y una matriz de clientes si se le solicita.

public static Dictionary<Int32, Customer> d = null; public static Customer ReadItem(Int32 id) { // take a copy for SharePoint Customer c = new Customer(); Customer e = d[id]; c.CustomerId = e.CustomerId; c.FirstName = e.FirstName; c.LastName = e.LastName; c.Message = e.Message; return c; } public static IEnumerable<Customer> ReadList() { // this is usually the first method called so check for null if (d == null) { d = new Dictionary<Int32, Customer>(); for (int i = 0; i < 10; i++) { Customer e = new Customer(); e.CustomerId = i; e.Message = i + " Item Data"; e.FirstName = i + " First Name"; e.LastName = i + " Last Name"; d.Add(i, e); } } return d.Values; } public static void Update(Customer customer, Int32 id) { d[id].FirstName = customer.FirstName; d[id].LastName = customer.LastName; d[id].Message = customer.Message; }

Fragmento de código: Mis fragmentos de código | spchol304_ex1_customerservice

Página 28

Tutoriales para programadores de SharePoint 2010

Figura 38 - Clase CustomerService después de los cambios

3. En el Explorador de soluciones, expanda la carpeta Features y haga doble clic en el nodo Feature1.feature. Se abrirá el diseñador de características.

4. Haga clic en la pestaña Manifiesto en la parte inferior del diseñador de características.

5. Haga clic en el glifo + situado junto a Editar opciones para abrir el editor de plantillas.

6. Agregue una nueva propiedad para la dirección URL del sitio. <Property Key="SiteUrl" Value="http://intranet.contoso.com" />

Página 29

Tutoriales para programadores de SharePoint 2010

El diseñador de características ahora debería verse como la Figura 39.

Figura 39 – Diseñador de características con la propiedad SiteUrl agregada

Tarea 4: creación e implementación 1. En el menú, seleccione Generar | Implementar BDCEx1.

2. Abra http://intranet.contoso.com en una sesión del explorador.

3.

Haga clic en Listas en la navegación izquierda .

Figura 40 - Vínculo Listas

4. Haga clic en Crear.

Figura 41 - Vínculo Crear

Página 30

Tutoriales para programadores de SharePoint 2010

En el cuadro de diálogo Crear, seleccione Lista externa y, a continuación, seleccione Crear.

Figura 42 – Cuadro de diálogo de creación de una lista externa

5. Escriba Mis contactos en el cuadro de texto Nombre.

6. Haga clic en el segundo botón a la derecha del cuadro de texto Tipo de contenido externo (el botón en cuya información sobre herramientas se lee "Seleccionar tipo de contenido externo").

Figura 43 – Página de creación de nueva lista externa

Página 31

Tutoriales para programadores de SharePoint 2010

7. Seleccione BDCModel1 y haga clic en Aceptar.

Figura 44 - Selector de tipo de datos profesionales -- Cuadro de diรกlogo Pรกgina web

Figura 45 - Pรกgina de la nueva lista externa

Pรกgina 32

Tutoriales para programadores de SharePoint 2010

8. Haga clic en Crear.

9. Ya ha creado un tipo de contenido externo y una lista para hospedar el tipo de contenido.

Figura 46 - Tipo de contenido externo (modelo BDC) mostrado en la lista

Pรกgina 33

Tutoriales para programadores de SharePoint 2010

Ejercicio 3: creación de una aplicación de Silverlight para el modelo de objetos de cliente de SharePoint En este ejercicio, crearemos una aplicación de Silverlight básica que muestre una lista de SharePoint dentro de una cuadrícula de datos. Los datos de la lista se recuperan desde el servidor para que estén disponibles en Silverlight mediante el modelo de objetos de cliente de SharePoint. Usaremos una solución de Visual Studio 2010 y la implementaremos en el servidor local de SharePoint.

Tarea 1: creación de un proyecto de aplicación de Silverlight Comenzaremos con la creación de un proyecto de aplicación de Silverlight estándar.

1. Abra Visual Studio 2010 desde Inicio | Todos los programas | Microsoft Visual Studio 2010 | Microsoft Visual Studio 2010.

2. En el menú, seleccione Archivo | Nuevo | Proyecto.

3. En el cuadro de diálogo Nuevo proyecto, expanda el menú izquierdo Plantillas instaladas para mostrar Otros tipos de proyectos | Soluciones de Visual Studio | Solución en blanco.

4. Seleccione .NET Framework 3.5.

5. Denomine a la solución Begin.

6. Escriba C:\SPHOLS\SPCHOL306\CS\Ex1\ en el cuadro de texto Ubicación.

Figura 47 - Cuadro de diálogo Nuevo proyecto

7. Haga clic en Aceptar para continuar.

8. En el menú, seleccione Archivo | Agregar | Nuevo proyecto.

Página 34

Tutoriales para programadores de SharePoint 2010

9. En el cuadro de diálogo Nuevo proyecto, expanda el menú izquierdo Plantillas instaladas para mostrar Visual C# | Silverlight y elija el tipo de proyecto Aplicación de Silverlight en la lista de tipos de proyecto que aparece en la parte central de la pantalla.

10. Seleccione .NET Framework 3.5.

11. Denomine al proyecto SPSilverlightExample.

12. No cambie la ubicación.

Figura 48 - Cuadro de diálogo Agregar nuevo proyecto

13. Haga clic en Aceptar para continuar.

Figura 49 - Cuadro de diálogo de adición de una aplicación de Silverlight

14. Haga clic en Aceptar para crear el proyecto.

Página 35

Tutoriales para programadores de SharePoint 2010

15. En el proyecto SPSilverlightExample, agregaremos los ensamblados de referencia al modelo de objetos de cliente de Silverlight de SharePoint. Haga clic con el botón secundario en References en el proyecto SPSilverlightExample y seleccione Agregar referencia.

16. Busque la carpeta “C:\Archivos de programa\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin”.

17. Seleccione Microsoft.SharePoint.ClientSilverlight.dll y Microsoft.SharePoint.Client.Silverlight.Runtime.dll (mantenga presionado CTRL para seleccionar varios archivos).

18. Haga clic en Aceptar para agregar las referencias dll seleccionadas.

Figura 50 - Agregar referencias

Tarea 2: escritura de código para obtener acceso a datos de listas de SharePoint y representarlos 1. En Visual Studio, abra el Cuadro de herramientas y expanda Controles de Silverlight comunes.

2. Arrastre un control DataGrid a la cuadrícula existente en el diseñador de Silverlight de Page.xaml.

Página 36

Tutoriales para programadores de SharePoint 2010

Figura 51 - Cuadro de herramientas de controles de Silverlight

3. Expanda la cuadrícula de datos para que ocupe toda la página; para ello, vaya a la cuadrícula de propiedades y establezca las propiedades Width y Height en Auto, las propiedades HorizontalAlignment y VerticalAlignment en Stretch y Margin en 0.

Figura 52 - Propiedades de la cuadrícula de datos

Página 37

Tutoriales para programadores de SharePoint 2010

4. También asegúrese de activar AutoGenerateColumns (o de establecer su valor en true en el XAML).

Figura 53 - Propiedad AutoGenerateColumns

5. Abra App.xaml.cs y agregue las siguientes instrucciones using al principio del archivo: using Microsoft.SharePoint.Client; using System.Threading;

Fragmento de código: Mis fragmentos de código | spchol306_ex1_app_namespaces 6. Agregue el siguiente código al principio del método Application_Startup.

ApplicationContext.Init(e.InitParams, SynchronizationContext.Current);

Fragmento de código: Mis fragmentos de código | spchol306_ex1_ application_startup 7. Abra MainPage.xaml.cs y agregue la siguiente instrucción using al principio del archivo: using Microsoft.SharePoint.Client;

Fragmento de código: Mis fragmentos de código | spchol306_ex1_page_namespaces 8. Agregue la siguiente clase antes de la clase MainPage: public class Project { public string Title { get; set; } public DateTime DueDate { get; set; } public string Description { get; set; } }

Fragmento de código: Mis fragmentos de código | spchol306_ex1_ classes 9. Agregue la siguiente variable a la clase MainPage: private ListItemCollection _projects;

Fragmento de código: Mis fragmentos de código | spchol306_ex1_ property 10. Agregue el siguiente código al constructor Page antes de la llamada a InitializeComponent:

Página 38

Tutoriales para programadores de SharePoint 2010

ClientContext context = new ClientContext(ApplicationContext.Current.Url); context.Load(context.Web); List Projects = context.Web.Lists.GetByTitle("Projects"); context.Load(Projects); CamlQuery query = new Microsoft.SharePoint.Client.CamlQuery(); string camlQueryXml = "<View><Query><Where><Gt>" + "<FieldRef Name='Due_x0020_Date' />" + "<Value Type='DateTime'>2008-01-1T00:00:00Z</Value>" + "</Gt></Where></Query><ViewFields>" + "<FieldRef Name=\"Title\" /><FieldRef Name=\"Description\" />" + "<FieldRef Name=\"Due_x0020_Date\" />" + "</ViewFields></View>"; query.ViewXml = camlQueryXml; _projects = Projects.GetItems(query); context.Load(_projects); context.ExecuteQueryAsync(new ClientRequestSucceededEventHandler(OnRequestSucceeded), null);

Fragmento de código: Mis fragmentos de código | spchol306_ex1_initializecomponent 11. Agregue el siguiente código después del constructor: private void OnRequestSucceeded(Object sender, ClientRequestSucceededEventArgs args) { // this is not called on the UI thread Dispatcher.BeginInvoke(BindData); } private void BindData() { List<Project> projects = new List<Project>(); foreach (ListItem li in _projects) { projects.Add(new Project() { Title = li["Title"].ToString(), DueDate = Convert.ToDateTime(li["Due_x0020_Date"].ToString()), Description = li["Description"].ToString() }); } dataGrid1.ItemsSource = projects; // must be on UI thread }

Fragmento de código: Mis fragmentos de código | spchol306_ex1_methods El código inicializa el contexto del modelo de objetos de cliente de Silverlight de SharePoint (ClientContext). Posteriormente, obtiene una referencia a la lista de proyectos y ejecuta una consulta CAML simple en la lista para extraer todos los proyectos que tengan una fecha de vencimiento posterior a 1/1/2008. Los resultados se convierten en una lista de proyectos y se enlazan con el control DataGrid de Silverlight.

Página 39

Tutoriales para programadores de SharePoint 2010

Tarea 3: implementación y prueba mediante el elemento web de Silverlight de SharePoint Para implementar la solución en SharePoint, es necesario que el archivo .xap resultante creado por el proyecto de Silverlight se encuentre en la carpeta C:\Archivos de programa\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin. 1. Haga clic con el botón secundario en el proyecto SPSilverlightExample, seleccione las propiedades y, a continuación, la pestaña Generar.

2. Cambie la ruta de acceso de los resultados a C:\Archivos de programa\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin.

Figura 54 - Propiedades del proyecto

3. Genere la solución. El archivo .xap se ha copiado al directorio de SharePoint apropiado y el usuario ya está preparado para agregar el elemento web de Silverlight al sitio web de SharePoint.

4. Abra Internet Explorer y busque http://intranet.contoso.com.

5. Seleccione el icono Editar en la parte superior de la página.

6. Seleccione la pestaña Insertar y, a continuación, haga clic en Elemento web.

7. En la lista de categorías, seleccione Medios y contenido, elija el Elemento web de Silverlight en la lista de elementos web y haga clic en Agregar.

8. En el cuadro de diálogo Elemento web de Silverlight que aparecerá, escriba /_layouts/ClientBin/SPSilverlightExample.xap como la dirección URL.

Página 40

Tutoriales para programadores de SharePoint 2010

Figura 55 - Cuadro de diálogo de la dirección URL del elemento web de Silverlight

9. Haga clic en Aceptar para guardar el elemento web de Silverlight.

10. Salga del modo de edición.

11. El elemento web final se verá así en la página de SharePoint:

Figura 56 - Elemento web de Silverlight finalizado

En este ejercicio, ha creado una aplicación de Silverlight básica que muestra una lista de SharePoint dentro de una cuadrícula de datos. Los datos de la lista se recuperan desde el servidor para que estén disponibles en Silverlight mediante el modelo de objetos de cliente de SharePoint.

Página 41

Tutoriales para programadores de SharePoint 2010

Ejercicio 4: creación de un gráfico mediante el modelo de objetos de SharePoint y los controles de gráficos de Silverlight En este ejercicio, volveremos a usar el modelo de objetos de SharePoint para obtener acceso a datos de listas de SharePoint, pero esta vez usaremos LINQ y los controles de gráficos de Silverlight para mostrar los datos en un gráfico.

Tarea 1: creación de un proyecto de aplicación de Silverlight 1. Abra Visual Studio 2010 desde Inicio | Todos los programas | Microsoft Visual Studio 2010 | Microsoft Visual Studio 2010.

2. En el menú, seleccione Archivo | Nuevo | Proyecto.

3. En el cuadro de diálogo Nuevo proyecto, expanda el menú izquierdo Plantillas instaladas para mostrar Otros tipos de proyectos | Soluciones de Visual Studio | Solución en blanco.

4. Denomine a la solución Begin.

5. Cambie la ubicación a C:\SPHOLS\SPCHOL306\CS\Ex2\.

Figura 57 - Cuadro de diálogo Nuevo proyecto

6. Haga clic en Aceptar para continuar.

Página 42

Tutoriales para programadores de SharePoint 2010

7. En el menú, seleccione Archivo | Agregar | Nuevo proyecto.

8. En el cuadro de diálogo Nuevo proyecto, expanda el menú izquierdo Plantillas instaladas para mostrar Visual C# | Silverlight y elija el tipo de proyecto Aplicación de Silverlight en la lista de tipos de proyecto que aparece en la parte central de la pantalla.

9. Denomine al proyecto SilverlightEmployeeContributionsGraph.

10. No cambie la ubicación.

Figura 58 - Cuadro de diálogo Agregar nuevo proyecto

Página 43

Tutoriales para programadores de SharePoint 2010

11. Haga clic en Aceptar.

Figura 59 - Cuadro de diรกlogo de adiciรณn de una aplicaciรณn de Silverlight

12. Haga clic en Aceptar para crear el proyecto.

13. En el proyecto SilverlightEmployeeContributionsGraph, agregaremos los ensamblados de referencia al modelo de objetos de cliente de Silverlight de SharePoint. Haga clic con el botรณn secundario en References en el proyecto SilverlightEmployeeContributionsGraph y seleccione Agregar referencia.

14. Busque la carpeta C:\Archivos de programa\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin. 15. Seleccione Microsoft.SharePoint.ClientSilverlight.dll y Microsoft.SharePoint.Client.Silverlight.Runtime.dll (mantenga presionado CTRL para seleccionar varios archivos).

16. Haga clic en Aceptar para agregar las referencias dll seleccionadas.

Pรกgina 44

Tutoriales para programadores de SharePoint 2010

Figura 60 - Agregar referencias

12. Agregue una referencia al ensamblado Controles de grรกficos de Silverlight. Se encuentra disponible en la ficha .NET y se denomina System.Windows.Controls.DataVisualization.Toolkit.

Figura 61 - Agregar referencia DataVisualization

Pรกgina 45

Tutoriales para programadores de SharePoint 2010

Tarea 2: escritura de código para obtener acceso a datos de la lista Employee de SharePoint y mostrarlos en un control de gráficos de Silverlight 1. En el Explorador de soluciones, haga clic con el botón secundario en el archivo App.xaml y seleccione Ver código. Abra App.xaml.cs y agregue las siguientes instrucciones using al principio del archivo: using Microsoft.SharePoint.Client; using System.Threading;

Fragmento de código: Mis fragmentos de código | spchol306_ex2_app_namespaces 2. Agregue el siguiente código al principio del método Application_Startup.

ApplicationContext.Init(e.InitParams, SynchronizationContext.Current);

Fragmento de código: Mis fragmentos de código | spchol306_ex2_application_startup 3. En la vista XAML del archivo MainPage.xaml, agregue el siguiente espacio de nombres XML al elemento UserControl: xmlns:chartingToolkit="clrnamespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Wind ows.Controls.DataVisualization.Toolkit"

4. Agregue el siguiente control de gráficos de Silverlight al elemento Grid: <chartingToolkit:Chart x:Name="chart" Width="350" Height="250" Title="Team Contributions"> <chartingToolkit:Chart.Series> <chartingToolkit:ColumnSeries ItemsSource="{Binding}" DependentValuePath="Contributions" IndependentValuePath="Name" AnimationSequence="FirstToLast" Title="Contributions" IsSelectionEnabled="True" /> </chartingToolkit:Chart.Series> </chartingToolkit:Chart>

Página 46

Tutoriales para programadores de SharePoint 2010

Figura 62 - XAML del gráfico de Silverlight

5. Abra MainPage.xaml.cs y agregue la siguiente instrucción using al principio del archivo: using Microsoft.SharePoint.Client;

Fragmento de código: Mis fragmentos de código | spchol306_ex2_page_namespaces 6. Agregue las siguientes clases antes de la clase MainPage: public class EmployeeContributions { public string Name { get; set; } public string TeamName { get; set; } public decimal Contributions { get; set; } } public class TeamContributions { public string Name { get; set; } public decimal Contributions { get; set; } }

Fragmento de código: Mis fragmentos de código | spchol306_ex2_classes 7. Agregue la siguiente variable a la clase MainPage: private ListItemCollection _employees;

Fragmento de código: Mis fragmentos de código | spchol306_ex2_property 8. Agregue el siguiente código al constructor Page antes de la llamada a InitializeComponent:

Página 47

Tutoriales para programadores de SharePoint 2010

ClientContext context = new ClientContext(ApplicationContext.Current.Url); context.Load(context.Web); List employees = context.Web.Lists.GetByTitle("Employees"); context.Load(employees); CamlQuery query = new CamlQuery(); string camlQueryXml = null; query.ViewXml = camlQueryXml; _employees = employees.GetItems(query); context.Load(_employees); context.ExecuteQueryAsync(new ClientRequestSucceededEventHandler(OnRequestSucceeded), null);

Fragmento de código: Mis fragmentos de código | spchol306_ex2_initializecomponent 9. Agregue el siguiente código después del constructor: private void OnRequestSucceeded(Object sender, ClientRequestSucceededEventArgs args) { // this is not called on the UI thread Dispatcher.BeginInvoke(BindData); } private void BindData() { List<EmployeeContributions> employees = new List<EmployeeContributions>(); // get list item values into a strongly typed class foreach (ListItem li in _employees) { employees.Add(new EmployeeContributions { Name = li["Title"].ToString(), TeamName = li["Team"].ToString(), Contributions = Convert.ToDecimal(li["Contribution_x0020__x0028_in_x00"]) }); } // use linq to group employees on team name and then total team contributions List<TeamContributions> teams = employees .GroupBy(e => e.TeamName) .Select(t => new TeamContributions { Name = t.Key, Contributions = t.Sum(e => e.Contributions) }).ToList(); chart.DataContext = teams; // must be on UI thread }

Fragmento de código: Mis fragmentos de código | spchol306_ex2_methods Página 48

Tutoriales para programadores de SharePoint 2010

10. Como en el caso del ejercicio anterior, el modelo de objetos de cliente de Silverlight de SharePoint se usa para recuperar datos de una lista de SharePoint. Después de rellenar los elementos de las contribuciones de los empleados en una lista, se usa LINQ para agrupar los empleados y sumar sus contribuciones. Posteriormente, las contribuciones de los grupos se establecen como el origen de datos del gráfico.

Tarea 3: implementación y prueba mediante el elemento web de Silverlight de SharePoint Para implementar la solución en SharePoint, es necesario que el archivo .xap resultante creado por el proyecto de Silverlight se encuentre en la carpeta C:\Archivos de programa\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin. 1. Haga clic con el botón secundario en el proyecto SilverlightEmployeeContributionsGraph, seleccione las propiedades y, a continuación, seleccione la pestaña Generar.

2. Cambie la ruta de acceso de los resultados a C:\Archivos de programa\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin.

Figura 63 - Propiedades del proyecto de Silverlight

3. Genere la solución. El archivo .xap se ha copiado al directorio de SharePoint apropiado y el usuario ya está preparado para agregar el elemento web de Silverlight al sitio web de SharePoint.

4. Abra Internet Explorer y busque http://intranet.contoso.com.

Página 49

Tutoriales para programadores de SharePoint 2010

5. Actualizaremos el elemento web de Silverlight agregado en el ejercicio anterior para que apunte al nuevo control de gráficos de Silverlight recién creado. Haga clic en el icono desplegable situado en la esquina superior derecha del elemento web de Silverlight y seleccione Editar elemento web.

Figura 64 - Propiedades del elemento web de Silverlight

6. Haga clic en el botón Configurar (es posible que tenga que desplazar la ventana hacia la derecha para verlo) y, a continuación, escriba /_layouts/ClientBin/SilverlightEmployeeContributionsGraph.xap en el cuadro de diálogo Elemento web de Silverlight.

Página 50

Tutoriales para programadores de SharePoint 2010

Figura 65 - Direcci贸n URL del elemento web de Silverlight

7. Haga clic en Aceptar.

8. Haga clic en Aceptar en la parte inferior de la barra lateral del elemento web de Silverlight.

P谩gina 51

Tutoriales para programadores de SharePoint 2010

9. El elemento web final se verá así:

Figura 66 - Elemento web gráfico de Silverlight finalizado

Página 52

Tutoriales para programadores de SharePoint 2010

Ejercicio 5: creación de un elemento web para una solución de espacio aislado En este ejercicio, crearemos un elemento web que represente y actualice datos de listas implementados como una solución de espacio aislado.

Tarea 1: creación de un proyecto de solución de espacio aislado con un elemento web Comenzaremos con la creación de un proyecto de aplicación de Silverlight estándar.

1. Abra Visual Studio 2010 desde Inicio | Todos los programas | Microsoft Visual Studio 2010 | Microsoft Visual Studio 2010.

2. En el menú, seleccione Archivo | Nuevo | Proyecto.

3. En el cuadro de diálogo Nuevo proyecto, expanda el menú izquierdo Plantillas instaladas para mostrar Visual C# | SharePoint | 2010 | Proyecto de SharePoint vacío.

4. Denomine al proyecto SPSolutionDemo.

5. Cambie la ubicación a C:\SPHOLS\SPCHOL307\CS\Ex1\.

Figura 67 - Cuadro de diálogo Nuevo proyecto

Página 53

Tutoriales para programadores de SharePoint 2010

6. Haga clic en Aceptar para continuar.

7. En el Asistente para personalizar SharePoint, cambie el sitio local que se va a usar para la depuración a http://intranet.contoso.com/.

8. Deje el nivel de confianza para la solución de SharePoint en Implementar como solución de espacio aislado.

Figura 68 - Paso 1 del Asistente para personalizar SharePoint

9. Haga clic en Finalizar para continuar. Visual Studio creará el nuevo proyecto y agregará los archivos necesarios.

10. Haga clic con el botón secundario en el proyecto SPSolutionDemo en el Explorador de soluciones y seleccione Agregar | Nuevo elemento.

11. Asegúrese de que Visual C# | SharePoint | 2010 | esté seleccionado en el panel Plantillas instaladas.

12. En el cuadro de diálogo Agregar nuevo elemento, seleccione la opción para agregar un nuevo Elemento web y denomínelo SBWebPart.

Página 54

Tutoriales para programadores de SharePoint 2010

Figura 69 - Cuadro de diálogo Agregar nuevo elemento

13. Haga clic en Agregar para agregar el elemento web al proyecto.

Tarea 2: adición de código para proporcionar la funcionalidad de consulta y presentación 1. Abra SBWebPart.cs y agregue la siguiente instrucción using después de las demás instrucciones using: using System.Web.UI.HtmlControls;

Fragmento de código: Mis fragmentos de código | spchol307_ex1_webpart_namespaces 2. Agregue las siguientes variables a la clase SBWebPart: DropDownList _ddlProjects = new DropDownList(); TextBox _tbDescription = new TextBox(); TextBox _tbDueDate = new TextBox();

Fragmento de código: Mis fragmentos de código | spchol307_ex1_webpart_variables 3. Agregue los siguientes métodos nuevos a la clase SBWebPart:

Página 55

Tutoriales para programadores de SharePoint 2010

protected override void OnLoad(EventArgs e) { base.OnLoad(e); if (!Page.IsPostBack) GetProjectDetails(); } /* Populate the text boxes with the selected project details */ private void GetProjectDetails() { EnsureChildControls(); if (_ddlProjects.SelectedValue != "-- Select a Project --") { SPList pList = SPContext.Current.Web.Lists["Projects"]; int nProjectID = Convert.ToInt32(_ddlProjects.SelectedValue); SPListItem spliProject = pList.GetItemById(nProjectID); _tbDescription.Text = spliProject["Description"].ToString(); DateTime dueDate = Convert.ToDateTime(spliProject["Due_x0020_Date"]); _tbDueDate.Text = dueDate.ToShortDateString(); } else { _tbDescription.Text = String.Empty; _tbDueDate.Text = String.Empty; } }

Fragmento de c贸digo: Mis fragmentos de c贸digo | spchol307_ex1_webpart_getprojectdetails

P谩gina 56

Tutoriales para programadores de SharePoint 2010

4. Reemplace el método CreateChildControls existente por el siguiente código: protected override void CreateChildControls() { base.CreateChildControls(); Panel parent = new Panel(); parent.Style.Add("border", "solid 1px Navy"); parent.Style.Add("background-color", "#EEEEEE"); parent.Style.Add("width", "250px"); _ddlProjects.ID = "ddlProjects"; _ddlProjects.AutoPostBack = true; _ddlProjects.SelectedIndexChanged += new EventHandler(ddlProjects_SelectedIndexChanged); PopulateProjects(); parent.Controls.Add(_ddlProjects); Panel panel = new Panel(); Label label = new Label(); label.Text = "Description"; panel.Controls.Add(label); parent.Controls.Add(panel); panel = new Panel(); panel.Controls.Add(_tbDescription); parent.Controls.Add(panel); label = new Label(); label.Text = "Due Date"; panel = new Panel(); panel.Controls.Add(label); parent.Controls.Add(panel); panel = new Panel(); panel.Controls.Add(_tbDueDate); parent.Controls.Add(panel); panel = new Panel(); Button bUpdateProject = new Button(); bUpdateProject.Text = "Update Project"; bUpdateProject.Click += new EventHandler(bUpdateProject_Click); panel.Controls.Add(bUpdateProject); parent.Controls.Add(panel); Controls.Add(parent); }

Fragmento de código: Mis fragmentos de código | spchol307_ex1_webpart_createchildcontrols

Página 57

Tutoriales para programadores de SharePoint 2010

5. Agregue los siguientes métodos debajo de CreateChildControls: private void PopulateProjects() { SPList splProjects = SPContext.Current.Web.Lists["Projects"]; _ddlProjects.Items.Add("-- Select a Project --"); foreach (SPListItem spli in splProjects.Items) { _ddlProjects.Items.Add(new ListItem(spli.Title, spli.ID.ToString())); } } void ddlProjects_SelectedIndexChanged(object sender, EventArgs e) { GetProjectDetails(); } /* Update the current project */ void bUpdateProject_Click(object sender, EventArgs e) { EnsureChildControls(); int nProjectID = Convert.ToInt32(_ddlProjects.SelectedValue); SPListItem spliProject = SPContext.Current.Web.Lists["Projects"].GetItemById(nProjectID); spliProject["Description"] = _tbDescription.Text; spliProject["Due_x0020_Date"] = _tbDueDate.Text; spliProject.Update(); }

Fragmento de código: Mis fragmentos de código | spchol307_ex1_webpart_populateprojects

Tarea 3: generación e implementación de la solución de espacio aislado Las soluciones de espacio aislado se implementan mediante el sitio web de SharePoint.

1. Haga clic con el botón secundario en el proyecto SBSolutionDemo y seleccione el Paquete para crear un archivo .wsp.

2. Abra Internet Explorer y busque http://intranet.contoso.com.

3. Haga clic en el menú Acciones del sitio y seleccione Configuración del sitio.

4. En la sección Galerías, seleccione Soluciones.

Página 58

Tutoriales para programadores de SharePoint 2010

Figura 70 - Galería de soluciones

5. Seleccione la pestaña Soluciones.

6. En la ficha Soluciones, seleccione Cargar solución.

7.

En el cuadro de diálogo Cargar solución que aparecerá, busque el archivo .wsp en C:\SPHOLs\SPCHOL307\CS\Ex1\SPSolutionDemo\SPSolutionDemo\bin\Debug\SPSolution Demo.wsp.

8. Haga clic en Aceptar para cargar SPSolutionDemo.wsp en SharePoint. Deje el cuadro Sobrescribir los archivos existentes activado.

9. Haga clic en Activar en el cuadro de diálogo Activar solución de la Galería de soluciones. El elemento web de solución de espacio aislado ya está listo para usarse.

10. Haga clic en el menú Acciones del sitio y seleccione Más opciones.

11. En la sección Página del cuadro de diálogo Crear, seleccione Página de elementos web. Haga clic en Crear.

12. Denomine a la nueva página de elementos web SBSolutionDemoPage y establezca el Diseño como Página completa, vertical. Establezca la Ubicación en la que desea guardar como Documentos compartidos.

Página 59

Tutoriales para programadores de SharePoint 2010

Figura 71 - Nueva página de elementos web

13. Haga clic en Crear para crear la nueva página de elementos web.

14. Seleccione el área central de la nueva página de elementos web y haga clic en la nueva pestaña Insertar que aparecerá en la barra de herramientas superior.

15. Seleccione Elemento web y, a continuación, seleccione Personalizado en las categorías y elija SBWebPart en los elementos web.

16. Haga clic en Agregar para agregar el elemento web de solución de espacio aislado a la página.

17. En la cinta de opciones, haga clic en Página. A continuación, haga clic en Detener la edición en la barra de herramientas

.

Figura 72 - SBWebPart

Página 60

Tutoriales para programadores de SharePoint 2010

18. Seleccione Cuenta del sistema en la barra de herramientas en la esquina superior derecha de la página y elija Iniciar sesión como usuario diferente.

19. Escriba andyj como nombre de usuario y pass@word1 como contraseña.

Figura 73 - Cuadro de diálogo de inicio de sesión de Windows

20. Haga clic en Aceptar.

21. El elemento web de solución de espacio aislado ya está listo para usarse. Seleccione lo que desee ver en la lista desplegable. Cuando finalice, cierre Internet Explorer.

Página 61

Tutoriales para programadores de SharePoint 2010

Figura 74 - Elemento web de soluci贸n de espacio aislado

P谩gina 62

Tutoriales para programadores de SharePoint 2010

Ejercicio 6: creación de una actividad para su uso en un flujo de trabajo de SharePoint Designer En este ejercicio se muestra cómo crear una actividad personalizada de flujos de trabajo que usa un flujo de trabajo reutilizable de SharePoint Designer y cómo implementarlos juntos como un único *.WSP. También se muestra cómo importar ese flujo de trabajo a Visual Studio 2010.

Tarea 1: creación y preparación del proyecto En esta tarea, creará una solución de proyecto vacío y usará los controles de usuario de SharePoint.

1. Abra Visual Studio 2010; para ello, vaya a Inicio | Todos los programas | Microsoft Visual Studio 2010 | Microsoft Visual Studio 2010.

2. En Visual Studio 2010, cree un proyecto nuevo; para ello, vaya a Archivo | Nuevo | Proyecto.

3. Seleccione la plantilla de proyecto Proyecto de SharePoint vacío de Visual C# | SharePoint | 2010.

4. Escriba SPCHOL305Ex1 en el cuadro de texto Nombre y C:\SPHOLS\SPCHOL305\CS\Ex1 en el cuadro de texto Ubicación.

Figura 75 - Cuadro de diálogo Nuevo proyecto

5. Haga clic en Aceptar.

Página 63

Tutoriales para programadores de SharePoint 2010

6. En el Asistente para personalizar SharePoint, cambie la dirección URL a http://intranet.contoso.com y seleccione Implementar como solución de granja de servidores. A continuación, haga clic en Finalizar.

Figura 76 - Asistente para personalizar SharePoint

7. Visual Studio creará el nuevo proyecto SPCHOL305Ex1 y agregará los archivos necesarios.

Tarea 2: creación de una actividad de flujo de trabajo para su uso por el flujo de trabajo reutilizable 1. En Visual Studio 2010, agregue un proyecto nuevo; para ello, vaya a Archivo | Agregar | Nuevo proyecto.

2. Cambie .NET Framework por .NET Framework 3.5

.

Figura 77 - Establecimiento de la versión de .NET Framework

Página 64

Tutoriales para programadores de SharePoint 2010

3. Seleccione la plantilla de proyecto Visual C# | Workflow | Biblioteca de actividades de flujo de trabajo.

4. Escriba SPDActivityDemo en el cuadro de texto Nombre y haga clic en Aceptar.

Figura 78 - Cuadro de di谩logo Nuevo proyecto

5. En el Explorador de soluciones, haga clic con el bot贸n secundario en el proyecto SPDActivityDemo y seleccione Agregar referencia.

6. Cambie a la ficha Examinar. Escriba C:\Archivos de programa\Common Files\Microsoft Shared\Web Server Extensions\14\ISAPI en el cuadro de texto Nombre de archivo y presione ENTRAR. 7. Seleccione Microsoft.SharePoint.dll y Microsoft.SharePoint.WorkflowActions.dll y, a continuaci贸n, haga clic en Aceptar.

P谩gina 65

Tutoriales para programadores de SharePoint 2010

Figura 79 - Cuadro de diálogo Agregar referencia

8. Haga clic con el botón secundario en Activity1.cs en el Explorador de soluciones y seleccione Cambiar nombre.

9. Cambie el nombre de Activity1.cs por CreateDocumentLibrary.cs.

Tarea 3: adición de código para crear una biblioteca de documentos basada en los parámetros pasados a la actividad 1. Haga clic con el botón secundario en el archivo CreateDocumentLibrary.cs del Explorador de soluciones y seleccione Ver código.

2. Cambie la clase base de CreateDocumentLibrary de SequenceActivity a Activity, como se muestra a continuación. public partial class CreateDocumentLibrary : Activity

3. Agregue las siguientes instrucciones using al principio del archivo debajo de las instrucciones using existentes: Página 66

Tutoriales para programadores de SharePoint 2010

using Microsoft.SharePoint; using Microsoft.SharePoint.Workflow; using Microsoft.SharePoint.WorkflowActions;

Fragmento de código: Mis fragmentos de código | spchol305_ex1_createdoclib_namespace

4. Agregue una nueva propiedad de dependencia denominada UrlProperty a la clase CreateDocumentLibrary.  Esta será la ubicación donde se creará la biblioteca de documentos. public static DependencyProperty UrlProperty = DependencyProperty.Register("Url", typeof(string), typeof(CreateDocumentLibrary), new PropertyMetadata("")); [DescriptionAttribute("Url of base site")] [BrowsableAttribute(true)] [DesignerSerializationVisibilityAttribute(DesignerSerializationVisibility.Visible )] [ValidationOption(ValidationOption.Optional)] public string Url { get { return ((string)(base.GetValue(CreateDocumentLibrary.UrlProperty))); } set { base.SetValue(CreateDocumentLibrary.UrlProperty, value); } }

Fragmento de código: Mis fragmentos de código | spchol305_ex1_createdoclib_urlproperty 5. Agregue una nueva propiedad de dependencia a la clase CreateDocumentLibrary denominada DocLibNameProperty.  Este será el nombre de la biblioteca de documentos creada por la actividad.

Página 67

Tutoriales para programadores de SharePoint 2010

public static DependencyProperty DocLibNameProperty = DependencyProperty.Register("DocLibName", typeof(string), typeof(CreateDocumentLibrary), new PropertyMetadata("")); [DescriptionAttribute("Used as doc lib name")] [BrowsableAttribute(true)] [DesignerSerializationVisibilityAttribute(DesignerSerializationVisibility.Visible )] [ValidationOption(ValidationOption.Optional)] public string DocLibName { get { return ((string)(base.GetValue(CreateDocumentLibrary.DocLibNameProperty))); } set { base.SetValue(CreateDocumentLibrary.DocLibNameProperty, value); } }

Fragmento de código: Mis fragmentos de código | spchol305_ex1_createdoclib_doclibproperty 6. Agregue el siguiente código debajo del constructor CreateDocumentLibrary: protected override ActivityExecutionStatus Execute(ActivityExecutionContext executionContext) { CreateDocLib(); return ActivityExecutionStatus.Closed; } private void CreateDocLib() { using (SPSite sps = new SPSite(Url)) { using (SPWeb spw = sps.RootWeb) { Guid ID = spw.Lists.Add(DocLibName, DocLibName + " Document Library", SPListTemplateType.DocumentLibrary); SPList spdl = spw.Lists[ID]; spdl.OnQuickLaunch = true; spdl.Update(); } } }

Fragmento de código: Mis fragmentos de código | spchol305_ex1_createdoclib_execute

Página 68

Tutoriales para programadores de SharePoint 2010

Tarea 4: configuración de la actividad para la implementación 1. Configure la actividad para un nombre seguro. Agregue SPDActivityDemo.snk de la carpeta Resources (ubicación al principio de este manual) al proyecto SPDActivityDemo.

Figura 80 - Agregar elemento existente

2. Haga clic con el botón secundario en el proyecto SPDActivityDemo en el Explorador de soluciones y seleccione Propiedades.

3. Haga clic en la pestaña Firma, active Firmar el ensamblado y, a continuación, seleccione SPDActivityDemo.snk.

Figura 81 - Firma

4. Genere el proyecto (CTRL-MAYÚS-B) y solucione los errores.

5. Haga clic con el botón secundario en el proyecto SPCHOL305Ex1 y, a continuación, en Agregar, Carpeta asignada de SharePoint Página 69

Tutoriales para programadores de SharePoint 2010

.

Figura 82 - Carpeta asignada de SharePoint

6. Seleccione Template\3082\Workflow en el cuadro de diรกlogo Agregar carpeta asignada de SharePoint y seleccione Aceptar.

Pรกgina 70

Tutoriales para programadores de SharePoint 2010

Figura 83 - Cuadro de diรกlogo Agregar carpeta asignada de SharePoint

7. En el Explorador de soluciones, expanda la carpeta Workflow agregada recientemente.

8. Haga clic con el botรณn secundario en la carpeta SPCHOL305Ex1 (si existe) y seleccione Eliminar.

9. Haga clic con el botรณn secundario en la carpeta Workflow y seleccione Agregar | Nuevo elemento.

10. Seleccione la plantilla Archivo XML, denomine al archivo SPDActivityDemo.ACTIONS y, a continuaciรณn, haga clic en Agregar.

Pรกgina 71

Tutoriales para programadores de SharePoint 2010

Figura 84 - Cuadro de diรกlogo Agregar nuevo elemento

Pรกgina 72

Tutoriales para programadores de SharePoint 2010

7. Reemplace el contenido de SPDActivityDemo.ACTIONS por lo siguiente: <?xml version="1.0" encoding="utf-8"?> <WorkflowInfo> <Actions Sequential="then" Parallel="and"> <Action Name="Create Document Library" ClassName="SPDActivityDemo.CreateDocumentLibrary" Assembly="SPDActivityDemo, Version=1.0.0.0, Culture=neutral, PublicKeyToken=a66e91d2ee2fa8f8" AppliesTo="all" Category="Labs"> <RuleDesigner Sentence="Document Library Name %1 to site %2."> <FieldBind Field="DocLibName" Text="Document Library Name" DesignerType="TextArea" Id="1"/> <FieldBind Field="Url" Text="Url of base site" Id="2" DesignerType="TextArea"/> </RuleDesigner> <Parameters> <Parameter Name="DocLibName" Type="System.String, mscorlib" Direction="In" /> <Parameter Name="Url" Type="System.String, mscorlib" Direction="In" /> </Parameters> </Action> </Actions> </WorkflowInfo>

Fragmento de código: Mis fragmentos de código | spchol305_ex1_workflowactions_xml 8. Genere el proyecto SPDActivityDemo.

Tarea 5: adición de la actividad SPDActivityDemo para su implementación con SPCHOL305Ex1.

1. En el Explorador de soluciones, expanda la carpeta Package en el proyecto SPCHOL305Ex1.

2. Haga doble clic en el archivo Package.package para abrir el diseñador de paquetes.

3. Haga clic en la pestaña Avanzadas en la parte inferior del diseñador.

Figura 85 - Pestaña Avanzadas del paquete

Página 73

Tutoriales para programadores de SharePoint 2010

4. Haga clic en el bot贸n Agregar y seleccione Agregar ensamblado desde la salida del proyecto.

5. En el cuadro de di谩logo Agregar ensamblado desde la salida del proyecto, haga clic en el cuadro combinado Proyecto de origen y seleccione SPDActivityDemo\bin.

Figura 86 - Agregar ensamblado existente desde resultados del proyecto

6. Haga clic en el bot贸n situado debajo de Controles seguros. Dentro de Controles seguros agregue lo siguiente: Nombre de ensamblado: SPDActivityDemo, Version=1.0.0.0, Culture=neutral, PublicKeyToken= a66e91d2ee2fa8f8 Espacio de nombres: SPDActivityDemo Seguro: Activado Nombre de tipo: * 7. Una vez rellenados los detalles del control seguro, presione ENTRAR para confirmarlos.

8. Haga clic en Aceptar.

P谩gina 74

Tutoriales para programadores de SharePoint 2010

Tarea 6: configuración de una característica mediante el diseñador de características 1. Haga clic con el botón secundario en la carpeta Features en el Explorador de soluciones debajo del proyecto SPCHOL305Ex1 y seleccione Agregar característica.

2. Haga clic con el botón secundario en Feature1 y cambie el nombre a SPCHOL305Ex1Feature.

3. En el diseñador de características, cambie el ámbito del ámbito SPCHOL305Ex1Feature a WebApplication.

Figura 87 - Diseñador de características

Tarea 7: adición y codificación de un receptor de características 1. Haga clic con el botón secundario en la característica SPCHOL305Ex1Feature en el Explorador de soluciones y seleccione Agregar receptor de eventos.

2. Agregue una instrucción using al principio del código: using Microsoft.SharePoint.Administration;

Página 75

Tutoriales para programadores de SharePoint 2010

3. Agregue el siguiente código a la declaración de clases de FeatureReceiver: public override void FeatureActivated(SPFeatureReceiverProperties properties) { SPWebApplication wappCurrent = (SPWebApplication)properties.Feature.Parent; SPWebConfigModification modAuthorizedType = new SPWebConfigModification(); modAuthorizedType.Name = "AuthType"; modAuthorizedType.Owner = "SPDActivityDemo"; modAuthorizedType.Path = "configuration/System.Workflow.ComponentModel.WorkflowCompiler/authorizedTypes"; modAuthorizedType.Type = SPWebConfigModification.SPWebConfigModificationType.EnsureChildNode; modAuthorizedType.Value = "<authorizedType Assembly=\"SPDActivityDemo, " + "Version=1.0.0.0, Culture=neutral, PublicKeyToken=a66e91d2ee2fa8f8\" " + "Namespace=\"SPDActivityDemo\" TypeName=\"*\" Authorized=\"True\" />"; wappCurrent.WebConfigModifications.Add(modAuthorizedType); wappCurrent.WebService.ApplyWebConfigModifications(); }

Fragmento de código: Mis fragmentos de código | spchol305_ex1_spchol305feature_receiver 4. Genere e implemente el proyecto SPCHOL305Ex1; para ello, haga clic con el botón secundario en el nombre del proyecto y seleccione Implementar.

Figura 88 - Implementación de la solución

Tarea 8: creación de un flujo de trabajo reutilizable mediante SharePoint Designer 1. Abra SharePoint Designer 2010; para ello, vaya a Inicio | Todos los programas | SharePoint | Microsoft SharePoint Designer 2010

Página 76

Tutoriales para programadores de SharePoint 2010

2. Haga clic en Sitios y, a continuación, en Abrir sitio.

Figura 89 - Botón de menú Sitios en SharePoint Designer 2010

Si se le solicitan credenciales, use: Nombre de usuario: Administrator Contraseña: pass@word1

Página 77

Tutoriales para programadores de SharePoint 2010

3. Cambie el Nombre de sitio a http://intranet.contoso.com y seleccione Abrir

.

Figura 90 - Cuadro de diรกlogo Abrir sitio

Pรกgina 78

Tutoriales para programadores de SharePoint 2010

5. Haga clic en el botón Flujo de trabajo reutilizable y, cuando se le pida, asigne el nombre SPDWorkflow al flujo de trabajo y, a continuación, haga clic en el botón Aceptar para crear el flujo de trabajo reutilizable.

Figura 91 - Creación de un flujo de trabajo reutilizable

6. Haga clic en el botón Acción de la cinta de opciones y desplácese hacia abajo hasta Labs y haga clic en Create Document Library. Nota: esta es la actividad que realizamos previamente

Página 79

Tutoriales para programadores de SharePoint 2010

en Visual Studio.

Figura 92 - Adici贸n de acci贸n Crear biblioteca de documentos

P谩gina 80

Tutoriales para programadores de SharePoint 2010

7. Haga clic en el Paso 1. En el cuadro situado junto a Nombre de la biblioteca de documentos, haga clic en el botón Fx. 8. Seleccione Elemento actual como Origen de datos y Título como Campo del origen. A continuación, haga clic en Aceptar.

Figura 93 - Cuadro de diálogo Búsqueda de cadena

9. Escriba http://intranet.contoso.com como la dirección URL del sitio base.

10. Haga clic en Guardar en la cinta de opciones.

Figura 94 - Configuración de la acción de flujo de trabajo

Página 81

Tutoriales para programadores de SharePoint 2010

11. Después de guardar, haga clic en el botón Publicar de la cinta de opciones. Espere hasta que se publique el flujo de trabajo.

Figura 95 - Publicación del flujo de trabajo

12. Después de guardar, haga clic en Flujos de trabajo en la navegación izquierda.

13. Vuelva a hacer clic en el flujo de trabajo debajo de Flujo de trabajo reutilizable para abrir las propiedades del flujo de trabajo. Haga clic en Guardar como plantilla para guardar el archivo .WSP en la lista Biblioteca de activos del sitio de SharePoint.

Figura 96 - Guardar como plantilla

14. Abra un explorador web en http://intranet.contoso.com.

Página 82

Tutoriales para programadores de SharePoint 2010

15. Haga clic en Acciones del sitio -> Ver todo el contenido del sitio -> Biblioteca de activos del sitio.

Figura 97 - Biblioteca de activos del sitio

16. Haga clic en el menú desplegable SPDWorkflow y, a continuación, en Enviar a -> Descargar una copia.

Figura 98 - Descarga del WSP

Página 83

Tutoriales para programadores de SharePoint 2010

17. Guarde el WSP en una ubicación a la que pueda obtener acceso en un paso siguiente (como el escritorio).

Figura 99 - Cuadro de diálogo Guardar como

Tarea 9: importación del flujo de trabajo reutilizable a Visual Studio 1. En Visual Studio 2010, haga clic con el botón secundario en la solución SPCHOL305Ex1 de la ventana Explorador de soluciones y seleccione Agregar | Nuevo proyecto.

2. Seleccione la plantilla de proyecto Importar flujo de trabajo reutilizable de Visual C# | SharePoint | 2010.

Página 84

Tutoriales para programadores de SharePoint 2010

3. Cambie el Nombre a SPDWorkflowImport.

Figura 100 - Cuadro de diรกlogo Nuevo proyecto

4. Haga clic en Aceptar.

Pรกgina 85

Tutoriales para programadores de SharePoint 2010

5. Asegúrese de que la dirección URL sea http://intranet.contoso.com. Haga clic en Siguiente.

Figura 101 - Asistente para personalizar SharePoint

Página 86

Tutoriales para programadores de SharePoint 2010

6. Cuando se le pregunte qué archivo .WSP desea importar, busque el archivo SPDWorkflow.wsp que guardó anteriormente. Haga clic en Siguiente.

Figura 102 - Asistente para personalizar SharePoint

7. Haga clic en Finalizar.

Página 87

Tutoriales para programadores de SharePoint 2010

Figura 103 - Asistente para personalizar SharePoint

Pรกgina 88

Tutoriales para programadores de SharePoint 2010

8. Haga doble clic en el paquete del proyecto SPCHOL305Ex1 y agregue la caracterĂ­stica Flujos de trabajo convertidos al paquete.

Figura 104 - Explorador de paquetes de SharePoint

PĂĄgina 89

Tutoriales para programadores de SharePoint 2010

9. Haga clic con el bot贸n secundario en el proyecto SPDWorkflowImport y seleccione Agregar referencia.

10. Seleccione la referencia de proyecto SPDActivityDemo y haga clic en Aceptar.

Figura 105 - Adici贸n de referencia de ensamblado

11. En el proyecto SPDWorkflowImport , expanda el nodo Workflows\SPDWorkflowFT. 12. Abra Elements.xml.

13. Cambie el nombre del flujo de trabajo a SPDWorkflowFT

.

Figura 106 - Configuraci贸n del nombre del flujo de trabajo importado

P谩gina 90

Tutoriales para programadores de SharePoint 2010

14. Guarde el proyecto, genere la solución e implemente el proyecto SPCHOL305Ex1.

Tarea 10: asociación del flujo de trabajo con una lista en SharePoint 1.

2.

3.

4.

5.

Busque http://intranet.contoso.com.

Haga clic en Acciones del sitio | Más opciones.

Seleccione Lista personalizada en la lista de elementos.

Asigne el nombre Customers a la lista y haga clic en Crear.

Abra la Configuración de la lista

.

Figura 107 - Configuración de la lista

6. En Permisos y administración, haga clic en Configuración del flujo de trabajo.

7. Configure el flujo de trabajo de la lista del siguiente modo:  Seleccione una plantilla de flujo de trabajo: SPDWorkflowFT  Escriba un nombre único para este flujo de trabajo: Create Doc Lib for Customer  Seleccione una lista de tareas: Tareas  Seleccione un historial: Historial del flujo de trabajo  Opciones de inicio: Iniciar este flujo de trabajo cuando se cree un nuevo elemento

Página 91

Tutoriales para programadores de SharePoint 2010

Figura 108 - Configuraci贸n del flujo de trabajo

8. Haga clic en Aceptar.

9. Navegue a la lista Customers y seleccione Elementos | Nuevo elemento.

Figura 109 - Creaci贸n de un nuevo elemento

P谩gina 92

Tutoriales para programadores de SharePoint 2010

10. Escriba Northwind como el nombre del cliente y haga clic en Guardar cuando aparezca el cuadro de diálogo Customers – Nuevo elemento.

Figura 110 - Cuadro de diálogo Nuevo elemento

11. Espere mientras se crea automáticamente una nueva biblioteca de documentos con el mismo nombre.

Resumen del tutorial En este tutorial, se repasaron seis escenarios para programadores de SharePoint 2010. Puede practicar en los laboratorios en los que se basaron estos tutoriales en http://msdn.microsoft.com/eses/sharepoint/ee513147.aspx.

Página 93