Create UX components in SharePoint 2013

apps for SharePoint

Learn how to create UX components for your apps in SharePoint 2013.

The model for apps for SharePoint offers many UX components and mechanisms that help you build a great user experience in apps for SharePoint. The user experience in the app model is also flexible enough to let you use the techniques and platforms that best adapt to the needs of end users. Table 1 lists resources to help you learn about creating and using UX components in apps.

Table 1. Resources and guidance for creating UX components in apps for SharePoint



How to: Use a SharePoint website's style sheet in apps for SharePoint

You can reference the style sheet of a SharePoint website in your app for SharePoint and use it to style your webpages by using the style sheet in SharePoint 2013. In addition, if someone changes the SharePoint website’s style sheet or theme, you can adopt the new set of styles in your app without modifying the style sheet reference in your app.

How to: Use the client chrome control in apps for SharePoint

The chrome control in SharePoint 2013 enables you to use the header styling of a specific SharePoint site in your app without needing to register a server library or use a specific technology or tool. To use this functionality, you must register a SharePoint JavaScript library through a standard <script> tag. You can provide a placeholder by using an HTML div element and further customize the control by using the available options. The control inherits its appearance from the specified SharePoint website.

How to: Create app parts to install with your app for SharePoint

With app parts, you can show your app user experience right in the host web. An app part displays your app content using an IFrame. End users can customize the experience using the custom properties that you can provide for your app part. The app webpage receives the custom property values through parameters in the query string.

How to: Create custom actions to deploy with apps for SharePoint

When you are creating an app for SharePoint, custom actions let you interact with the lists and the ribbon in the host web. A custom action deploys to the host web when end users install your app. Custom actions can open a remote webpage and pass information through the query string. There are two types of custom actions available for apps: Ribbon and Edit Control Block.

How to: Customize a list view in apps for SharePoint using client-side rendering

Client-side rendering provides a mechanism that you can use to produce your own output for a set of controls that are hosted in a SharePoint page. This mechanism enables you to use well-known technologies, such as HTML and JavaScript, to define the rendering logic of SharePoint list views. In client-side rendering, you can specify your own JavaScript resources and host them in the data storage options available to your apps, such as a document library.

How to: Use the client-side People Picker control in SharePoint-hosted apps

Learn how to use the client-side People Picker control in apps for SharePoint. The client-side People Picker control lets users quickly search for and select valid user accounts for people, groups, and claims in their organization. The picker is an HTML and JavaScript control that provides cross-browser support.

Have you finished designing a great UX for your app? Incorporate data with the mechanisms available to you in the model for apps for SharePoint. For more information, see Work with external data in SharePoint 2013.

© 2014 Microsoft