Finalmente anche l'interfaccia utente di SharePoint 2010 vede l'introduzione dei ribbon.
Anche in SP 2010 i ribbon sono gestiti come una serie di "Tab", ogni tab contiene uno o più "Gruppi", identificati visualmente da una label, dove vengono posizionati i controlli.

I tipi di controllo che vengono gestiti sono all'interno dei gruppi sono: Button, Checkbox, Color Picker, Combo Box, Drop Down, Flyout Anchor, Insert Table, Label, Menu, Menu Section, MRU Split Button, Spinner, Split Button, Text Box, Toggle Button.
A ogni controllo può essere associato un solo comando.

Similmente a Office 2007 e 2010, anche in SP 2010 possiamo andare a personalizzare ogni aspetto dei ribbon, dall'aggiunta di tab, all'aggiunta di gruppi o controlli, fino alla modifica di quelli già presenti.

Di seguito un esempio di file Elements.xml con il CustomAction contenente la definizione del Tab custom:

  1: <?xml version="1.0" encoding="utf-8"?>
  2: <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  3:   <CustomAction
  4:     Id="MyCustomRibbonTab"
  5:     Location="CommandUI.Ribbon.ListView"
  6:     RegistrationId="101"
  7:     RegistrationType="List">
  8:     <CommandUIExtension>
  9:       <CommandUIDefinitions>
 10:         <CommandUIDefinition
 11:           Location="Ribbon.Tabs._children">
 12:           <Tab
 13:             Id="Ribbon.CustomTabExample"
 14:             Title="My Custom Tab"
 15:             Description="My Custom Tab"
 16:             Sequence="501">
 17:             <Groups Id="Ribbon.CustomTabExample.Groups">
 18:               <Group
 19:                 Id="Ribbon.CustomTabExample.CustomGroupExample"
 20:                 Description="Custom Group"
 21:                 Title="Custom Group"
 22:                 Sequence="52">
 23:                 <Controls Id="Ribbon.CustomTabExample.CustomGroupExample.Controls">
 24:                   <Button
 25:                     Id="Ribbon.CustomTabExample.CustomGroupExample.HelloWorld"
 26:                     Command="CustomTabExample.HelloWorldCommand"
 27:                     Sequence="15"
 28:                     Description="Hello, World!"
 29:                     LabelText="Hello, World!"/>
 30:                 </Controls>
 31:               </Group>
 32:             </Groups>
 33:           </Tab>
 34:         </CommandUIDefinition>
 35:       </CommandUIDefinitions>
 36:       <CommandUIHandlers>
 37:         <CommandUIHandler
 38:           Command="CustomTabExample.HelloWorldCommand"
 39:           CommandAction="javascript:alert('Hello, world!');" />
 40:       </CommandUIHandlers>
 41:     </CommandUIExtension>
 42:   </CustomAction>
 43: </Elements>

Come si può notare, nella definizione della CustomAction, l’azione vera e propria (“CustomTabExample.HelloWorldCommand”) non è nient’altro che una funzione JavaScript.

Nei prossimi post, scenderò nel dettaglio di ogni singola funzionalità.

Stay tuned!!