Merge pull request #39 from telerik/SNenchev-NaskoUpdates

-Added Nasko's updates

_config.yml

@@ -23,10 +23,10 @@ navigation:
         position: 3
     common/localization:
         title: "Localization"
-        position: 3
+        position: 4
     common/troubleshooting:
         title: "Troubleshooting"
-        position: 4
+        position: 5
     controls:
         title: "Controls"
         position: 4

common/accessibility.md

@@ -0,0 +1,45 @@
+---
+title: Accessibility
+page_title: Accessibility
+description: Accessibility
+slug: accessibility
+tags: narrator, keyboard, automationpeer, accessibility, contrast
+published: True
+position: 1
+---
+
+# Accessibility
+
+Nowadays in the world there are many disablities such as limitations in mobility, vision, color perception, hearing etc. Using the built-in accessibility functionalities of the  **Telerik UI for Universal Windows Platform** controls introduced with __R2 2017__ these disablities could easily be overcome. The controls provide keyboard support and support for assistive technologies such as screen readers, which take advantage of accessibility frameworks. The high contrast themes of the OS are supported as well and they make the interface easier to see.
+
+In this article, we will go through all these accessibility functionalities:
+
+* [UI Automation](#ui-automation)
+
+* [Keyboard support](#keyboard-support)
+
+* [High Contrast Themes](#high-contrast-themes)
+
+## UI Automation
+
+All controls provides built-in support for Microsoft UI Automation – the accessibility framework for Microsoft Windows. UI Automation support is implemented through a tree of peer classes that derive from FrameworkElementAutomationPeer. Each control class uses the UI Automation concepts of automation peers and automation patterns that report the control's role and content to UI Automation clients. We follow the convention about naming the peer classes – they begin with the control class name and end with “AutomationPeer”.
+
+A screen reader needs to be used in order the user to be able to receive all the needed information provided by the UI Automation. The screen reader read read the text associated with the specific control when it receives focus.
+
+## Keyboard support
+
+Each control provides a keyboard navigation of its own based on the needs of the control. That provides the ability for people with vision limitations to easily use the controls and to accomplish basic application scenarios by using only the keyboard. In order the keyboard to be used the control must be focused.  
+
+The controls support tab navigation and could easly gain the focus - by default, the tab order of the contols is the same as the order they are listed in XAML or programmatically added to the application. If you want to exclude a control from the Tab order the **IsTabStop** property of the control should be set to false.
+
+For the controls that can be invoked a keyboard support for the Spacebar and Enter keys is implemented. The arrow keys has also been implemented for navigation among child elements, in cases where the child elements have a special relationship to each other.
+
+## High Contrast Themes
+
+The OS supports a group of high contrast themes from which the users can choose to enable. These themes makes the controls easier to see and are of gread help for people with vision limitations. When the theme is switched to a high contrast all the UI controls will use an appropriate high contrast theme as well.
+
+In figure 1 you could see how the RadDatePicker, RadLoopingList, RadNumericBox and RadChart controls are visualized when the theme is changed to a high contrast theme:
+
+#### __Figure 1: High Contrast Theme support__
+
+![](images/high-contrast.png)

common/nugettoolbox.md

@@ -0,0 +1,44 @@
+---
+title: Nuget Toolbox Support
+page_title: Nuget Toolbox Support
+description: Nuget Toolbox Support
+slug: nuget-toolbox-support
+tags: nuget, toolbox, installation
+published: True
+position: 3
+---
+
+# Nuget Toolbox Support
+
+The Telerik UI for UWP controls provide a pre-build NuGet package. The package contains all the assemblies from the UI for UWP suite.
+
+In this article, we will go through the installation of the package and the features it provides:
+
+* [Installing UWP Controls Package](#installing-uwp-controls-package)
+
+* [Toolbox support](#toolbox-support)
+
+## Installing UWP Controls Package
+
+The next steps show how to install the complete NuGet package which includes all the assemblies.
+
+Once you open the “Manage NuGet Packages” dialog in Visual Studio (right-click Project References -> Manage NuGet Packages), you can select the "Browse" tab and search for "Telerik UI for Universal Windows Platform" - please, be aware that the package source should be nuget.org.
+
+#### __Figure 1: Manage NuGet Packages dialog__
+
+![](images/nuget-toolbox-support-1.png)
+
+After the package is found click the "Install" button and the package will be included in the project.
+
+#### __Figure 2: Installed NuGet Package__
+
+![](images/nuget-toolbox-support-2.png)
+
+## Toolbox support
+
+With Visual Studio 2017 a Toolbox support has been added for the NuGet packaged to easily view and categorize the controls. As soon as the NuGet package is referenced, the controls it contains will appear in the Toolbox for you to use in your application. These controls can be used just like any other Toolbox control, with drag and drop support on the design surface.
+
+#### __Figure 3: NuGet Toolbox support__
+
+![](images/nuget-toolbox-support-3.png)
+

controls/radchart/containervisualsfactory.md

@@ -0,0 +1,102 @@
+---
+title: ContainerVisualsFactory
+page_title: ContainerVisualsFactory
+description: ContainerVisualsFactory
+slug: radchart-containervisualsfactory
+tags: containervisualsfactory
+published: True
+position: 4
+---
+
+# Overview
+
+With the **R2 2017 SP1** release version of **UI for UWP**, RadChart provides a brand new rendering implementation for some of the Chart's visual elements. By using it some of the visual elements are drawn using the [Composition API](https://docs.microsoft.com/en-us/uwp/api/windows.ui.composition). This article will provide information about the visual elements drawn with the Composition API and how you can modify the drawing implementaion.
+
+## Visuals supporting Composition API
+
+The following visual elements are drawn using the [SpriteVisual](https://docs.microsoft.com/en-us/uwp/api/windows.ui.composition.spritevisual) element of the Composition API:
+
+* [Axis]({%slug radchart-axes-axis%})
+* [Ticks]({%slug radchart-axes-axis%})
+* [ScatterLineSeries]({%slug radchart-cartesianchart-series-skatter-scatterlineseries%})
+* [BarSeries]({%slug radchart-cartesianchart-series-categorical-barseries%})
+* [RangeBarSeries]({%slug radchart-cartesianchart-series-categorical-rangebarseries%})
+* [LineSeries]({%slug radchart-cartesianchart-series-categorical-lineseries%})
+* [StepLineSeries]({%slug radchart-cartesianchart-series-categoricalseries-steplineseries%})
+* [CandleStickSeries]({%slug radchart-cartesianchart-series-categorical-candlestickseries%})
+* [OhlcSeries]({%slug radchart-cartesianchart-series-categorical-ohlcseries%})
+* [Trend Line and Financial Indicator]({%slug radchart-series-radcartesianchart-indicators-indicators%})
+
+>By default, the listed above visuals will be drawn using the Composition API. If the visual elements have a custom Style or Template set - the Composition won't be used for the drawing functionality.
+
+## ContainerVisualsFactory
+
+The __ContainerVisualsFactory__ class helps preparing the [ContainerVisuals](https://docs.microsoft.com/en-us/uwp/api/windows.ui.composition.containervisual) that will be used for the rendering ot the Chart control. RadChart exposes a __ContainerVisualsFactory__ property that can be used to change the defaulf implementation for the drawing of the ContainerVisuals.
+
+In order to achieve a different behavior (for example to be able to change the Brush of the SpriteVisual) you can create a custom __ContainerVisualsFactory__ class and override its methods.
+
+The methods of the factory that could be overridden are the following:
+
+* __CanDrawContainerVisual:__  Indicates whether the visual element can be drawn using the Composition API. If the method returns false the element won't be drawn as a SpriteVisual element. Using that method the Composition mechanism could easily be disabled and the elements to be drawn using the UIElements provided by the Framework.
+
+* __CreateContainerVisual:__  It creates a new SpriteVisual instance that will be used for the visualization of the elements. The methods return ContainerVisual type of element and you could easily return any other ContainerVisual that will be used for the drawing - currently, we suggest you to use the __SpriteVisual__ as the only __ContainerVisual__ element from the Composition API that provides a __CompositionBrush__.
+
+* __PrepareTickVisual:__  Prepares the __SpriteVisual__ used for the visualization of the ticks of the Axis by setting its Size, Color and Offset.
+
+* __PrepareCartesianChartGridLineVisual:__ Prepares the __SpriteVisual__ used for the visualization of the lines of the CartesianChartGrid by setting its Size, Color and Offset. You can also pass to the method a __DoubleCollection__ that represents the dash array for the lines that will be used when drawing the __SpriteVisuals__.
+
+* __PreparePointTemplateSeriesVisual:__ Used for setting the Offset, Brush and Size of the series that are drawn with the Composition API.
+
+* __PrepareCartesianAxisLineVisual:__ Prepares the __SpriteVisual__ that will be visualized as an Axis. The method also provides information about the AxisType that is currently drawn.
+
+* __PrepareLineRenderVisual:__ - Prepares the Trend Lines and Financial Indicators by setting their Size, Offset and Brush.
+
+* __PrepareBarIndicatorVisual:__ - Prepares the BarIndicatorBase instances by setting their Size, Offset and Brush.
+
+The following example will demonstrate how to implement a custom ContainerVisualsFactory that will change the Brush of the BarSeries of RadChart and change the dash array of the CartesianChartGrid.
+
+First, you need to create a custom class that inherits the default ContainerVisualsFactory:
+
+	public class CustomContainerVisualFactory : ContainerVisualsFactory
+	{
+		
+	}
+
+Next thing you have to do is to override the **CreateContainerVisual** method that should return a **ContainerVisual** used for the rendering of the Chart control. The **Compositor** parameter is used for the creation of the **SpriteVisual** element and the type gives you information of the currently created element:
+
+	public class CustomContainerVisualFactory : ContainerVisualsFactory
+	{
+		protected override ContainerVisual CreateContainerVisual(Compositor compositor, Type elementType)
+		{
+			var containerVisual = base.CreateContainerVisual(compositor, elementType) as SpriteVisual;
+			if (containerVisual != null && elementType == typeof(BarSeries))
+			{
+				containerVisual.Brush = compositor.CreateColorBrush(Color.FromArgb(0xFF, 0x93, 0xC8, 0x49));
+			}
+
+			return containerVisual;
+		}
+	}
+
+Finally, we will override the **PrepareCartesianChartGridLineVisual** method as well in order to change the dash array for the lines used for the drawing of the CartesianChartGrid:
+
+	public class CustomContainerVisualFactory : ContainerVisualsFactory
+	{
+		protected override ContainerVisual CreateContainerVisual(Compositor compositor, Type elementType)
+		{
+			var containerVisual = base.CreateContainerVisual(compositor, elementType) as SpriteVisual;
+			if (containerVisual != null && elementType == typeof(BarSeries))
+			{
+				containerVisual.Brush = compositor.CreateColorBrush(Color.FromArgb(0xFF, 0x93, 0xC8, 0x49));
+			}
+
+			return containerVisual;
+		}
+
+		protected override ContainerVisual PrepareCartesianChartGridLineVisual(ContainerVisual containerVisual, RadRect layoutSlot, Orientation orientation, DoubleCollection dashArray)
+		{
+			return base.PrepareCartesianChartGridLineVisual(containerVisual, layoutSlot, orientation, new DoubleCollection() { 1, 0});
+		}
+	}
+	
+You could easily override the other methods as well in order to achieve the desired behavior and appearance of the Chart.