Snippets and SDKBrowser

How to add snippets and samples in SDKBrowser

SDKBrowser examples structure

Examples should have the following structure:

ControlName
---- Group1
-------- ExampleName1
------------ example1Xaml
------------ example1CSharp
------------ other files required by the example
-------- ExampleName2
------------ example2Xaml
------------ example2CSharp
------------ other files required by the example
---- Group2
...

Example

DataForm
---- GroupLayouts
-------- GridLayout
------------ DataFormGridLayoutCSharp
------------ DataFormGridLayoutXaml
------------ SourceItem
-------- StackLayout
------------ DataFormStackLayoutCSharp
------------ DataFormStackLayoutXaml
------------ SourceItem
---- Editors
...

Namespaces rules

• Example namespaces: SDKBrowser.Examples.[ControlName]

    SDKBrowser.Examples.DataForm
  

• Additional files namespace: SDKBrowser.Examples.[ControlName].[GroupName].[ExampleName]

    SDKBrowser.Examples.DataForm.GroupLayouts.GridLayout
  

Naming rules in navigation

Examples have title and group. If there are two examples that demonstrate the same feature in Xaml and CSharp, the title should be the same name + specifier:

<Example>
	<Title>GridLayout - Xaml</Title>
	<PageName>DataFormGridLayoutXaml</PageName>
	<GroupName>Group Layouts</GroupName>
</Example>
<Example>
	<Title>GridLayout - Code</Title>
	<PageName>DataFormGridLayoutCSharp</PageName>
	<GroupName>Group Layouts</GroupName>
</Example>

Snippets naming rules

Important:

• Snippets are located in comments. Each comment should contain a single snippet.
• Snippets should have only small letters.

Namespace snippets

We can't add snippets with Xaml namespaces because we cant put comments inside tags, but we have a workaround for this limitation. All namespaces are defined in the SDKBrowser/Common/XmlNs.xml file.

This requires all namespaces across the app to have the same name when defined in Xaml.
Telerik.XamarinForms.DataControls should always be named telerikDataControls.

We have also created a file that contains all namespaces defined in c#: SDKBrowser/Common/Usings.cs.

Snippets are named after the Xaml name of the namespace prefixed with specifier. For example the snippet for Telerik.XamarinForms.DataControls will have the following id:

• Xaml: xmlns-telerikdatacontrols
• C#: ns-telerikdatacontrols

Getting started snippets

####ExportRenderer attributes snippets:

Located in native app files: AppDelegate / MainActivity / MainPage ...

TelerikForms.Init in iOS

The iOS project requires modifications of the AppDelegate.FinishedLaunching that are control specific. The SDKBrowser.iOS/Inits/AppDelegates.cs file contains classes created for each control that have the required snippets for each control.

All other cases

[ControlName]-[GroupName]-[ExampleName]-[optional: example specific]-[optional: csharp or xaml]

csharp and xaml are added only to snippets that demonstrate the same feature and should be visualized as one snippet with tabs.

Examples:

// >> dataform-grouplayouts-stacklayout-csharp

<!-- >> dataform-grouplayouts-stacklayout-xaml -->

// >> dataform-grouplayouts-stacklayout-sourceitem

In order to add a reference to a code snippet marked with comment use the following line in the md file:

<snippet id='calendar-features-cellstyling-setstyleforcell'/>