[NUI] Picker: Apply Tizen 7.0 GUI

diff --git a/src/Tizen.NUI.Components/Controls/Picker.cs b/src/Tizen.NUI.Components/Controls/Picker.cs
index 6e4c079..e119bae 100755 (executable)
--- a/src/Tizen.NUI.Components/Controls/Picker.cs
+++ b/src/Tizen.NUI.Components/Controls/Picker.cs
@@ -81,14 +81,14 @@ namespace Tizen.NUI.Components
         private bool isAtspiEnabled;
         private ReadOnlyCollection<string> displayedValues;
         private PickerScroller pickerScroller;
-        private View upLine;
-        private View downLine;
         private IList<TextLabel> itemList;
         private Vector2 size;
         private TextLabelStyle itemTextLabel;
         private bool keyEditMode = false;
         private View recoverIndicator = null;
         private View keyEditModeIndicator = null;
+        private View UpperMask = null; //For Tizen 7.0 UX
+        private View LowerMask = null; //For Tizen 7.0 UX
 
 
         /// <summary>
@@ -159,10 +159,10 @@ namespace Tizen.NUI.Components
                     pickerScroller = null;
                 }
 
-                Remove(upLine);
-                Utility.Dispose(upLine);
-                Remove(downLine);
-                Utility.Dispose(downLine);
+                Remove(UpperMask);
+                Utility.Dispose(UpperMask);
+                Remove(LowerMask);
+                Utility.Dispose(LowerMask);
 
                 recoverIndicator = null;
                 if (keyEditModeIndicator)
@@ -353,14 +353,15 @@ namespace Tizen.NUI.Components
                 if (itemList != null)
                     foreach (TextLabel textLabel in itemList)
                         textLabel.ApplyStyle(pickerStyle.ItemTextLabel);
-            }
 
-            //Apply PickerCenterLine style.
-            if (pickerStyle.Divider != null && upLine != null && downLine != null)
-            {
-                upLine.ApplyStyle(pickerStyle.Divider);
-                downLine.ApplyStyle(pickerStyle.Divider);
-                downLine.PositionY = (int)pickerStyle.Divider.PositionY + itemHeight;
+                if (UpperMask != null && LowerMask != null)
+                {
+                    UpperMask.SizeHeight = itemHeight * middleItemIdx;
+                    LowerMask.SizeHeight = itemHeight * middleItemIdx;
+                    LowerMask.PositionY = itemHeight * (middleItemIdx + 1);
+                    UpperMask.BackgroundColor = pickerStyle.ItemTextLabel.BackgroundColor.All;
+                    LowerMask.BackgroundColor = pickerStyle.ItemTextLabel.BackgroundColor.All;
+                }
             }
 
             startScrollY = (itemHeight * dummyItemsForLoop) + startScrollOffset;
@@ -434,7 +435,7 @@ namespace Tizen.NUI.Components
             loopEnabled = false;
 
             Add(pickerScroller);
-            AddLine();
+            AddMasks();
 
             Focusable = true;
             KeyEvent += OnKeyEvent;
@@ -581,14 +582,25 @@ namespace Tizen.NUI.Components
             }
         }
 
-        //This is UI requirement. It helps where exactly center item is.
-        private void AddLine()
+        //This is an UX requirement. It gives highlight on center item area.
+        private void AddMasks()
         {
-            upLine = new View();
-            downLine = new View();
+            UpperMask = new View()
+            {
+                WidthSpecification = LayoutParamPolicies.MatchParent,
+                Opacity = 0.7f,
+                AccessibilityHidden = true,
+            };
+
+            LowerMask = new View()
+            {
+                WidthSpecification = LayoutParamPolicies.MatchParent,
+                Opacity = 0.7f,
+                AccessibilityHidden = true,
+            };
 
-            Add(upLine);
-            Add(downLine);
+            Add(UpperMask);
+            Add(LowerMask);
         }
 
         private String GetItemText(bool loopEnabled, int idx)

diff --git a/src/Tizen.NUI.Components/Controls/TimePicker.cs b/src/Tizen.NUI.Components/Controls/TimePicker.cs
index aeac65e..fc76232 100755 (executable)
--- a/src/Tizen.NUI.Components/Controls/TimePicker.cs
+++ b/src/Tizen.NUI.Components/Controls/TimePicker.cs
@@ -237,7 +237,6 @@ namespace Tizen.NUI.Components
             {
                 if (is24HourView == value) return;
 
-                Console.WriteLine(" Is 24 Hour View");
                 is24HourView = value;
                 if (value == true)
                 {
@@ -400,7 +399,6 @@ namespace Tizen.NUI.Components
             {
                 LinearOrientation = LinearLayout.Orientation.Horizontal,
             };
-            Console.WriteLine("initialize");
 
             is24HourView = false;
 

diff --git a/src/Tizen.NUI.Components/Style/PickerStyle.cs b/src/Tizen.NUI.Components/Style/PickerStyle.cs
index fce37d6..5d4f405 100755 (executable)
--- a/src/Tizen.NUI.Components/Style/PickerStyle.cs
+++ b/src/Tizen.NUI.Components/Style/PickerStyle.cs
@@ -49,11 +49,6 @@ namespace Tizen.NUI.Components
         /// </summary>
         [EditorBrowsable(EditorBrowsableState.Never)]
         public TextLabelStyle ItemTextLabel { get; set; } = new TextLabelStyle();
-
-        /// <summary>
-        /// Gets or sets the PickerStyle Center line style.
-        /// </summary>
-        public ViewStyle Divider { get; set;} = new ViewStyle();
         
         /// <summary>
         /// Gets or sets the PickerStyle Item list start offset value.
@@ -70,7 +65,6 @@ namespace Tizen.NUI.Components
             if (bindableObject is PickerStyle pickerStyle)
             {
                 ItemTextLabel.CopyFrom(pickerStyle.ItemTextLabel);
-                Divider.CopyFrom(pickerStyle.Divider);
                 StartScrollOffset = (pickerStyle.StartScrollOffset == null) ?
                                     new Size() : new Size(pickerStyle.StartScrollOffset.Width, pickerStyle.StartScrollOffset.Height);
             }

diff --git a/src/Tizen.NUI.Components/Theme/DefaultThemeCommon.cs b/src/Tizen.NUI.Components/Theme/DefaultThemeCommon.cs
index 9e5ac8f..4875997 100755 (executable)
--- a/src/Tizen.NUI.Components/Theme/DefaultThemeCommon.cs
+++ b/src/Tizen.NUI.Components/Theme/DefaultThemeCommon.cs
@@ -589,28 +589,21 @@ namespace Tizen.NUI.Components
             // Picker base style
             theme.AddStyleWithoutClone("Tizen.NUI.Components.Picker", new PickerStyle()
             {
-                Size = new Size(160, 339),
+                SizeHeight = 220.0f,
+                MinimumSize = new Size(80, -1),
                 ItemTextLabel = new TextLabelStyle()
                 {
-                    //FIXME: Should be check PointSize. given size from UX is too large.
-                    PixelSize = 32,
+                    PixelSize = 24,
                     VerticalAlignment = VerticalAlignment.Center,
                     HorizontalAlignment = HorizontalAlignment.Center,
-                    Size = new Size(0,72),
+                    Size = new Size(0, 44),
                     TextColor = new Selector<Color>()
                     {
-                        Normal = new Color("#000C2B"),
+                        Normal = new Color(0.035f, 0.055f, 0.123f, 1.0f),
                     },
-                    BackgroundColor = Color.White,
-                },
-                Divider = new ViewStyle()
-                {
-                    SizeHeight = 2.0f,
-                    WidthResizePolicy = ResizePolicyType.FillToParent,
-                    Position = new Position(0, 132),
-                    BackgroundColor = new Color("#0A0E4A"),
+                    BackgroundColor = new Color("#FAFAFA"),
                 },
-                StartScrollOffset = new Size(0, 12),
+                StartScrollOffset = new Size(0, 0),
             });
 
             // TabBar base style
@@ -727,60 +720,50 @@ namespace Tizen.NUI.Components
             // TimePicker base style
             theme.AddStyleWithoutClone("Tizen.NUI.Components.TimePicker", new TimePickerStyle()
             {
-                CellPadding = new Size(50, 339),
+                CellPadding = new Size(12, 220),
 
                 Pickers = new PickerStyle()
                 {
-                    Size = new Size(160, 339),
+                    Size = new Size(80, 220),
                     ItemTextLabel = new TextLabelStyle()
                     {
-                        //FIXME: Should be check PointSize. given size from UX is too large.
-                        PixelSize = 32,
+                        PixelSize = 24,
                         VerticalAlignment = VerticalAlignment.Center,
                         HorizontalAlignment = HorizontalAlignment.Center,
-                        Size = new Size(0,72),
-                        TextColor = new Color("#000C2B"),
-                        BackgroundColor = Color.White,
+                        Size = new Size(0, 44),
+                        TextColor = new Selector<Color>()
+                        {
+                            Normal = new Color(0.035f, 0.055f, 0.123f, 1.0f),
+                        },
+                        BackgroundColor = new Color("#FAFAFA"),
                         ThemeChangeSensitive = false
                     },
-                    Divider = new ViewStyle()
-                    {
-                        SizeHeight = 2.0f,
-                        WidthResizePolicy = ResizePolicyType.FillToParent,
-                        Position = new Position(0, 132),
-                        BackgroundColor = new Color("#0A0E4A"),
-                    },
-                    StartScrollOffset = new Size2D(0, 12),
+                    StartScrollOffset = new Size2D(0, 0),
                 }
             });
 
             // DatePicker base style
             theme.AddStyleWithoutClone("Tizen.NUI.Components.DatePicker", new DatePickerStyle()
             {
-                CellPadding = new Size(50, 339),
+                CellPadding = new Size(12, 220),
 
                 Pickers = new PickerStyle()
                 {
-                    Size = new Size(160, 339),
+                    Size = new Size(80, 220),
                     ItemTextLabel = new TextLabelStyle()
                     {
-                        //FIXME: Should be check PointSize. given size from UX is too large.
-                        PixelSize = 32,
+                        PixelSize = 24,
                         VerticalAlignment = VerticalAlignment.Center,
                         HorizontalAlignment = HorizontalAlignment.Center,
-                        Size = new Size(0,72),
-                        TextColor = new Color("#000C2B"),
-                        BackgroundColor = Color.White,
+                        Size = new Size(0, 44),
+                        TextColor = new Selector<Color>()
+                        {
+                            Normal = new Color(0.035f, 0.055f, 0.123f, 1.0f),
+                        },
+                        BackgroundColor = new Color("#FAFAFA"),
                         ThemeChangeSensitive = false
                     },
-                    Divider = new ViewStyle()
-                    {
-                        SizeHeight = 2.0f,
-                        WidthResizePolicy = ResizePolicyType.FillToParent,
-                        Position = new Position(0, 132),
-                        BackgroundColor = new Color("#0A0E4A"),
-                    },
-                    StartScrollOffset = new Size2D(0, 12),
+                    StartScrollOffset = new Size2D(0, 0),
                 }
             });