Add CircleSurfaceItem TCs (#55)

test/WearableUIGallery/WearableUIGallery/AppViewModel.cs

@@ -29,7 +29,7 @@ public AppViewModel()
             TCs = new ObservableCollection<TCDescribe>();
             TCs.Add(new TCDescribe { Title = "RotaryFocus", Class = typeof(TCRotaryFocus) });
             TCs.Add(new TCDescribe { Title = "ActionButton", Class = typeof(TCActionButton) });
-            TCs.Add(new TCDescribe { Title = "SurfaceItem", Class = typeof(TCSurfaceItems) });
+            TCs.Add(new TCDescribe { Title = "CircleSurfaceItem", Class = typeof(TCCircleSurfaceItemList) });
             TCs.Add(new TCDescribe { Title = "PopupEntry", Class = typeof(TCPopupEntry) });
             TCs.Add(new TCDescribe { Title = "CircleList behavior", Class = typeof(TCListAppender) });
             TCs.Add(new TCDescribe { Title = "CircleStackLayout", Class = typeof(TCCircleStackLayout) });
@@ -51,6 +51,12 @@ public AppViewModel()
             TCs.Add(new TCDescribe { Title = "Radio", Class = typeof(TCRadioList) });
             TCs.Add(new TCDescribe { Title = "Performance", Class = typeof(TCPerformance) });
 
+            // CircleSurfaceItem TCs
+            CircleSurfaceItemTCs = new ObservableCollection<TCDescribe>();
+            CircleSurfaceItemTCs.Add(new TCDescribe { Title = "Add/Remove SurfaceItems", Class = typeof(TCCircleSurfaceItems1) });
+            CircleSurfaceItemTCs.Add(new TCDescribe { Title = "CircleProgressBar", Class = typeof(TCCircleSurfaceItems2) });
+            CircleSurfaceItemTCs.Add(new TCDescribe { Title = "CircleSlider", Class = typeof(TCCircleSurfaceItems3) });
+
             // CircleStepper TCs
             CircleStepperTCs = new ObservableCollection<TCDescribe>();
             CircleStepperTCs.Add(new TCDescribe { Title = "Grid", Class = typeof(TCCircleStepper) });
@@ -65,6 +71,7 @@ public AppViewModel()
         }
 
         public IList<TCDescribe> TCs { get; private set; }
+        public IList<TCDescribe> CircleSurfaceItemTCs { get; private set; }
         public IList<TCDescribe> CircleStepperTCs { get; private set; }
         public IList<TCDescribe> RadioTCs { get; private set; }
     }

test/WearableUIGallery/WearableUIGallery/TC/TCCircleSurfaceItemList.xaml

@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<w:CirclePage
+    x:Class="WearableUIGallery.TC.TCCircleSurfaceItemList"
+    xmlns="http://xamarin.com/schemas/2014/forms"
+    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+    xmlns:local="clr-namespace:WearableUIGallery"
+    xmlns:sys="clr-namespace:System;assembly=netstandard"
+    xmlns:w="clr-namespace:Tizen.Wearable.CircularUI.Forms;assembly=Tizen.Wearable.CircularUI.Forms"
+    RotaryFocusTargetName="list">
+    <w:CirclePage.BindingContext>
+        <local:AppViewModel />
+    </w:CirclePage.BindingContext>
+    <w:CirclePage.Content>
+        <w:CircleListView
+            x:Name="list"
+            ItemTapped="OnItemTapped"
+            ItemsSource="{Binding CircleSurfaceItemTCs}">
+            <w:CircleListView.ItemTemplate>
+                <DataTemplate>
+                    <TextCell Text="{Binding Title}" />
+                </DataTemplate>
+            </w:CircleListView.ItemTemplate>
+        </w:CircleListView>
+    </w:CirclePage.Content>
+</w:CirclePage>

test/WearableUIGallery/WearableUIGallery/TC/TCCircleSurfaceItemList.xaml.cs

@@ -0,0 +1,47 @@
+/*
+ * Copyright (c) 2018 Samsung Electronics Co., Ltd All Rights Reserved
+ *
+ * Licensed under the Flora License, Version 1.1 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://floralicense.org/license/
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+using System;
+using Xamarin.Forms;
+using Tizen.Wearable.CircularUI.Forms;
+using Xamarin.Forms.Xaml;
+
+namespace WearableUIGallery.TC
+{
+	[XamlCompilation(XamlCompilationOptions.Compile)]
+	public partial class TCCircleSurfaceItemList : CirclePage
+	{
+		public TCCircleSurfaceItemList()
+		{
+			InitializeComponent ();
+		}
+
+        public void OnItemTapped(object sender, ItemTappedEventArgs args)
+        {
+            if (args.Item == null) return;
+
+            var desc = args.Item as TCDescribe;
+            if (desc != null && desc.Class != null)
+            {
+                Type pageType = desc.Class;
+
+                var page = Activator.CreateInstance(pageType) as Page;
+                NavigationPage.SetHasNavigationBar(page, false);
+                Navigation.PushAsync(page as Page);
+            }
+        }
+    }
+}

test/WearableUIGallery/WearableUIGallery/TC/TCCircleSurfaceItems1.xaml

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<w:CirclePage
+    x:Class="WearableUIGallery.TC.TCCircleSurfaceItems1"
+    xmlns="http://xamarin.com/schemas/2014/forms"
+    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+    xmlns:w="clr-namespace:Tizen.Wearable.CircularUI.Forms;assembly=Tizen.Wearable.CircularUI.Forms">
+    <ContentPage.Content>
+        <StackLayout>
+            <Button
+                Clicked="OnClick"
+                HorizontalOptions="CenterAndExpand"
+                Text="0"
+                VerticalOptions="CenterAndExpand"
+                WidthRequest="80" />
+        </StackLayout>
+    </ContentPage.Content>
+</w:CirclePage>

test/WearableUIGallery/WearableUIGallery/TC/TCSurfaceItems.xaml.cs → test/WearableUIGallery/WearableUIGallery/TC/TCCircleSurfaceItems1.xaml.cs

@@ -11,7 +11,7 @@
 namespace WearableUIGallery.TC
 {
 	[XamlCompilation(XamlCompilationOptions.Compile)]
-	public partial class TCSurfaceItems : CirclePage
+	public partial class TCCircleSurfaceItems1 : CirclePage
 	{
         static Color[] colors = new Color[] {
             Color.IndianRed,
@@ -44,7 +44,7 @@ public double Value {
             }
         }
 
-		public TCSurfaceItems ()
+		public TCCircleSurfaceItems1()
 		{
 			InitializeComponent ();
 		}

test/WearableUIGallery/WearableUIGallery/TC/TCCircleSurfaceItems2.xaml

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<w:CirclePage
+    x:Class="WearableUIGallery.TC.TCCircleSurfaceItems2"
+    xmlns="http://xamarin.com/schemas/2014/forms"
+    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+    xmlns:w="clr-namespace:Tizen.Wearable.CircularUI.Forms;assembly=Tizen.Wearable.CircularUI.Forms">
+    <w:CirclePage.Content>
+        <AbsoluteLayout>
+            <Button
+                AbsoluteLayout.LayoutBounds="0.5, 0.4, 0.5, 0.2"
+                AbsoluteLayout.LayoutFlags="All"
+                Clicked="OnClick"
+                Text="start" />
+            <Label
+                x:Name="percent"
+                AbsoluteLayout.LayoutBounds="0.5, 0.7, 0.4, 0.1"
+                AbsoluteLayout.LayoutFlags="All"
+                HorizontalOptions="CenterAndExpand"
+                Text="0 %" />
+        </AbsoluteLayout>
+    </w:CirclePage.Content>
+</w:CirclePage>

test/WearableUIGallery/WearableUIGallery/TC/TCCircleSurfaceItems2.xaml.cs

@@ -0,0 +1,114 @@
+using System;
+using System.Collections.Generic;
+using System.Globalization;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Tizen.Wearable.CircularUI.Forms;
+using Xamarin.Forms;
+using Xamarin.Forms.Xaml;
+
+namespace WearableUIGallery.TC
+{
+	[XamlCompilation(XamlCompilationOptions.Compile)]
+	public partial class TCCircleSurfaceItems2 : CirclePage
+	{
+        double _incValue = 0.02;
+        double _progressValue = 0.0;
+        bool _startProgress;
+
+        static Func<double,double>  convFuncs = (v) => v;
+
+        public double Value
+        {
+            get => _progressValue;
+            set
+            {
+                _progressValue = value;
+                OnPropertyChanged(nameof(Value));
+            }
+        }
+
+		public TCCircleSurfaceItems2()
+		{
+			InitializeComponent ();
+
+            var item1 = new CircleProgressBarSurfaceItem
+            {
+                BackgroundColor = Color.Blue,
+                BackgroundRadius = 170,
+                BackgroundLineWidth = 20,
+                BackgroundAngleOffset = 90,
+                BackgroundAngle = 270,
+                BarColor = Color.Red,
+                BarRadius = 170,
+                BarLineWidth = 18,
+                BarAngleOffset = 90,
+                BarAngleMaximum = 180,
+                BarAngleMinimum = 10,
+                IsVisible = true
+            };
+
+            item1.SetBinding(CircleProgressBarSurfaceItem.ValueProperty, "Value", BindingMode.Default, new ValueConverter());
+            percent.SetBinding(Label.TextProperty, "Value", BindingMode.Default, new ProgressConverter());
+            item1.BindingContext = this;
+            percent.BindingContext = this;
+
+            CircleSurfaceItems.Add(item1);
+            _startProgress = false;
+        }
+
+        protected override void OnDisappearing()
+        {
+            base.OnDisappearing();
+            _startProgress = false;
+        }
+
+        void OnClick(object sender, EventArgs args)
+        {
+            var btn = sender as Button;
+            if(_startProgress)
+            {
+                _startProgress = false;
+                btn.Text = "start";
+            }
+            else
+            {
+                if (Value == 1.0) Value = 0;
+                _startProgress = true;
+                btn.Text = "stop";
+                Device.StartTimer(TimeSpan.FromMilliseconds(200), () =>
+                {
+                    Value += _incValue;
+                    Console.WriteLine($"Value:{string.Format("{0:f2}", Value)}");
+                    if (Value > 1.0)
+                    {
+                        _startProgress = false;
+                        Value = 1.0;
+                        btn.Text = "start";
+                    }
+                    return this._startProgress;
+                });
+            }
+        }
+
+        class ValueConverter : IValueConverter
+        {
+            public object Convert(object value, Type targetType, object parameter, CultureInfo culture) => convFuncs((double)value);
+
+            public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) => value;
+        }
+
+        class ProgressConverter : IValueConverter
+        {
+            public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+            {
+                double percent = (double)value * 100;
+                string str = $"{string.Format("{0:0}", percent)} %";
+                return str;
+            }
+
+            public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) => value;
+        }
+    }
+}

test/WearableUIGallery/WearableUIGallery/TC/TCCircleSurfaceItems3.xaml

@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<w:CirclePage
+    x:Class="WearableUIGallery.TC.TCCircleSurfaceItems3"
+    xmlns="http://xamarin.com/schemas/2014/forms"
+    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+    xmlns:w="clr-namespace:Tizen.Wearable.CircularUI.Forms;assembly=Tizen.Wearable.CircularUI.Forms">
+    <w:CirclePage.Content>
+        <AbsoluteLayout>
+            <Button
+                AbsoluteLayout.LayoutBounds="0.5, 0.4, 0.5, 0.2"
+                AbsoluteLayout.LayoutFlags="All"
+                Clicked="OnClick"
+                FontSize="Small"
+                Text="Change focus" />
+            <Label
+                x:Name="label1"
+                AbsoluteLayout.LayoutBounds="0.5, 0.6, 0.3, 0.1"
+                AbsoluteLayout.LayoutFlags="All"
+                FontSize="Micro"
+                HorizontalOptions="Center"
+                Text="0" />
+            <Label
+                x:Name="label2"
+                AbsoluteLayout.LayoutBounds="0.5, 0.7, 0.4, 0.1"
+                AbsoluteLayout.LayoutFlags="All"
+                FontSize="Micro"
+                HorizontalOptions="Center"
+                Text="0" />
+        </AbsoluteLayout>
+    </w:CirclePage.Content>
+</w:CirclePage>