diff --git a/ReactNative/ReactNative.csproj b/ReactNative/ReactNative.csproj
index ad2928d6bda..5fc513da0d3 100644
--- a/ReactNative/ReactNative.csproj
+++ b/ReactNative/ReactNative.csproj
@@ -191,6 +191,7 @@
+
@@ -210,6 +211,7 @@
+
diff --git a/ReactNative/UIManager/BaseViewManager.cs b/ReactNative/UIManager/BaseViewManager.cs
new file mode 100644
index 00000000000..03e7c313fa5
--- /dev/null
+++ b/ReactNative/UIManager/BaseViewManager.cs
@@ -0,0 +1,147 @@
+using Newtonsoft.Json.Linq;
+using ReactNative.Views.View;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+
+namespace ReactNative.UIManager {
+ ///
+ /// Base class that should be suitable for the majority of subclasses of .
+ /// It provides support for base view properties such as backgroundColor, opacity, etc.
+ ///
+ public abstract class BaseViewManager : ViewManager
+ {
+ private static readonly string PROP_DECOMPOSED_MATRIX_ROTATE = "rotate";
+ private static readonly string PROP_DECOMPOSED_MATRIX_ROTATE_X = "rotateX";
+ private static readonly string PROP_DECOMPOSED_MATRIX_ROTATE_Y = "rotateY";
+ private static readonly string PROP_DECOMPOSED_MATRIX_SCALE_X = "scaleX";
+ private static readonly string PROP_DECOMPOSED_MATRIX_SCALE_Y = "scaleY";
+ private static readonly string PROP_DECOMPOSED_MATRIX_TRANSLATE_X = "translateX";
+ private static readonly string PROP_DECOMPOSED_MATRIX_TRANSLATE_Y = "translateY";
+
+ ///
+ /// Sets the background color of the .
+ ///
+ ///
+ ///
+ [ReactProperty("backgroundColor", CustomType="Color")]
+ public void setBackgroundColor(ReactViewPanel view, string backgroundColor)
+ {
+ view.SetBackgroundColor(backgroundColor);
+ }
+
+ ///
+ /// Set's the styling layout properties, based on the map.
+ ///
+ /// The view to style.
+ /// The requested styling properties to set.
+ [ReactProperty("C")]
+ public void setDecomposedMatrix(ReactViewPanel view, JObject decomposedMatrix)
+ {
+ if (decomposedMatrix == null)
+ {
+ resetTransformMatrix(view);
+ }
+ else {
+ setTransformMatrix(view, decomposedMatrix);
+ }
+ }
+
+ ///
+ /// Sets the opacity of the .
+ ///
+ /// The WPF view panel.
+ ///
+ [ReactProperty("opacity", DefaultFloat = 1)]
+ public void setOpacity(ReactViewPanel view, float opacity)
+ {
+ view.Opacity = opacity;
+ }
+
+ ///
+ /// Sets the scaleX property of the .
+ ///
+ /// The WPF view panel.
+ /// The scaling factor.
+ [ReactProperty("scaleX", DefaultFloat = 1)]
+ public void setScaleX(ReactViewPanel view, float factor)
+ {
+ view.setScaleX(factor);
+ }
+
+ ///
+ /// Sets the scaleY property of the .
+ ///
+ /// The WPF view panel.
+ /// The scaling factor.
+ [ReactProperty("scaleY", DefaultFloat = 1)]
+ public void setScaleY(ReactViewPanel view, float factor)
+ {
+ view.setScaleY(factor);
+ }
+
+ ///
+ /// Sets the translateX property of the .
+ ///
+ /// The WPF view panel.
+ /// The scaling factor.
+ [ReactProperty("translationX", DefaultFloat = 1)]
+ public void setTranslationX(ReactViewPanel view, float distance)
+ {
+ view.setTranslationX(distance);
+ }
+
+ ///
+ /// Sets the translateY property of the .
+ ///
+ /// The WPF view panel.
+ /// The scaling factor.
+ [ReactProperty("translationY", DefaultFloat = 1)]
+ public void setTranslationY(ReactViewPanel view, float distance)
+ {
+ view.setTranslationY(distance);
+ }
+
+ ///
+ /// Retrieves the property using the given name and type.
+ ///
+ /// The JSON property map.
+ /// The property name.
+ /// The property type.
+ ///
+ public static object GetProperty(JObject decomposedMatrix, string name, Type type)
+ {
+ var token = default(JToken);
+ if (decomposedMatrix.TryGetValue(name, out token))
+ {
+ return token.ToObject(type);
+ }
+
+ return null;
+ }
+
+ private static void setTransformMatrix(ReactViewPanel view, JObject matrix)
+ {
+ view.setTranslationX((float)GetProperty(matrix, PROP_DECOMPOSED_MATRIX_TRANSLATE_X, typeof(float)));
+ view.setTranslationY((float)GetProperty(matrix, PROP_DECOMPOSED_MATRIX_TRANSLATE_Y, typeof(float)));
+ view.setRotationX((float)GetProperty(matrix, PROP_DECOMPOSED_MATRIX_ROTATE_X, typeof(float)));
+ view.setRotationY((float)GetProperty(matrix, PROP_DECOMPOSED_MATRIX_ROTATE_Y, typeof(float)));
+ view.setScaleY((float)GetProperty(matrix, PROP_DECOMPOSED_MATRIX_SCALE_Y, typeof(float)));
+ view.setScaleX((float)GetProperty(matrix, PROP_DECOMPOSED_MATRIX_SCALE_X, typeof(float)));
+ }
+
+ private static void resetTransformMatrix(ReactViewPanel view)
+ {
+ view.setTranslationX(0);
+ view.setTranslationY(0);
+ view.setRotationX(0);
+ view.setRotationY(0);
+ view.setScaleX(1);
+ view.setScaleY(1);
+ }
+ }
+}
diff --git a/ReactNative/UIManager/SimpleViewManager.cs b/ReactNative/UIManager/SimpleViewManager.cs
new file mode 100644
index 00000000000..8e91654a09c
--- /dev/null
+++ b/ReactNative/UIManager/SimpleViewManager.cs
@@ -0,0 +1,34 @@
+using ReactNative.Views.View;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Windows.UI.Xaml;
+
+namespace ReactNative.UIManager
+{
+ ///
+ /// Common base class for most of the s.
+ /// It provides support for most common properties through extending .
+ ///
+ public abstract class SimpleViewManager : BaseViewManager
+ {
+ ///
+ /// Creates a instance.
+ ///
+ ///
+ public override ReactShadowNode CreateShadowNodeInstance()
+ {
+ return new LayoutShadowNode();
+ }
+
+ public override Type ShadowNodeType
+ {
+ get
+ {
+ return typeof(LayoutShadowNode);
+ }
+ }
+ }
+}
diff --git a/ReactNative/UIManager/ViewManager.Generic.cs b/ReactNative/UIManager/ViewManager.Generic.cs
index 92fb38e9e8b..dd95a706949 100644
--- a/ReactNative/UIManager/ViewManager.Generic.cs
+++ b/ReactNative/UIManager/ViewManager.Generic.cs
@@ -25,7 +25,7 @@ public abstract class ViewManager : ViewMan
/// collect properties exposed using the
/// annotation from the subclass.
///
- public sealed override Type ShadowNodeType
+ public override Type ShadowNodeType
{
get
{
@@ -43,7 +43,7 @@ public sealed override Type ShadowNodeType
/// .
///
/// The shadow node instance.
- public sealed override ReactShadowNode CreateShadowNodeInstance()
+ public override ReactShadowNode CreateShadowNodeInstance()
{
return CreateShadowNodeInstanceCore();
}
@@ -84,7 +84,7 @@ public sealed override void ReceiveCommand(FrameworkElement view, int commandId,
///
/// The root view.
/// The extra data.
- public sealed override void UpdateExtraData(FrameworkElement root, object extraData)
+ public override void UpdateExtraData(FrameworkElement root, object extraData)
{
UpdateExtraData((TFrameworkElement)root, extraData);
}
diff --git a/ReactNative/Views/View/ReactViewPanel.cs b/ReactNative/Views/View/ReactViewPanel.cs
index 63f661ad032..f1652bdbb8b 100644
--- a/ReactNative/Views/View/ReactViewPanel.cs
+++ b/ReactNative/Views/View/ReactViewPanel.cs
@@ -76,7 +76,7 @@ private void OnInterceptTouchEvent(object sender, PointerRoutedEventArgs ev)
_OnInterceptTouchEventListener.onInterceptTouchEvent(sender, ev);
}
- protected void SetBackgroundColor(string color)
+ public void SetBackgroundColor(string color)
{
this.Background = ParseColor(color);
}
@@ -146,7 +146,7 @@ public void SetBorderPadding(float thickness)
}
///
- /// Sets an elevation 3D transformatin effect on the .
+ /// Sets an elevation 3D transformation effect on the .
///
/// The positive negative elevation Z Index value of the view.
public void SetElevationEffect(float elevation)
@@ -154,7 +154,72 @@ public void SetElevationEffect(float elevation)
_Transform.TranslateZ = elevation;
this.Transform3D = _Transform;
}
-
+
+ ///
+ /// Sets the distance to translate along the x-axis in pixels of the view panel.
+ ///
+ /// The translation distance value along the x-axis.
+ public void setTranslationX(float distance)
+ {
+ _Transform.TranslateX = distance;
+ this.Transform3D = _Transform;
+ }
+
+ ///
+ /// Sets the angle in degrees of clockwise rotation around the x-axis
+ /// of the view panel.
+ ///
+ /// The x-axis rotation degrees.
+ public void setRotationX(float degrees)
+ {
+ _Transform.RotationX = degrees;
+ this.Transform3D = _Transform;
+ }
+
+ ///
+ /// Sets the angle in degrees of clockwise rotation around the y-axis
+ /// of the view panel.
+ ///
+ /// The y-axis rotation degrees.
+ public void setRotationY(float degrees)
+ {
+ _Transform.RotationY = degrees;
+ this.Transform3D = _Transform;
+ }
+
+
+ ///
+ /// Sets the distance to translate along the y-axis in pixels of the view panel.
+ ///
+ /// The translation distance value along the y-axis.
+ public void setTranslationY(float value)
+ {
+ _Transform.TranslateY = value;
+ this.Transform3D = _Transform;
+ }
+
+ ///
+ /// Sets the y-axis scale factor. You can use this property to stretch or shrink
+ /// the panel along the y-axis.
+ ///
+ /// The y-axis scale factor.
+ public void setScaleY(float factor)
+ {
+ _Transform.ScaleY = factor;
+ this.Transform3D = _Transform;
+ }
+
+ ///
+ /// Sets the y-axis scale factor. You can use this property to stretch or shrink
+ /// the panel along the x-axis.
+ ///
+ /// The x-axis scale factor.
+ public void setScaleX(float factor)
+ {
+ _Transform.ScaleX = factor;
+ this.Transform3D = _Transform;
+ }
+
///
/// Retrieves the number of subviews for the current view.
///