support item selected

AwesomeUIWidgets/Assets/Scripts/RaycastableScene/ItemPickerMainUIPanel.cs

                     new PickListItem("ball4"), 
                     new PickListItem("cylinder1"), 
                     new PickListItem("cylinder2")
+                },
+                itemCheckCallback: (index, active) =>
+                {
+                    //TODO: callback when item is activated/inactivated
+                    Debug.Log($"item {index}'s state is {active}");
+                },
+                itemSelectCallback: (index) =>
+                {
+                    //TODO: callback when item is selected
+                    Debug.Log($"item {index} is selected");
                 }
             )));
         }

AwesomeUIWidgets/Assets/Scripts/RaycastableScene/LeftUIPanel.cs

             this.showName = showName ?? itemName;
         }
     }
+
+    public delegate void OnItemSelected(int itemIndex);
+
+    public delegate void OnItemChecked(int itemIndex, bool active);
-            List<PickListItem> itemNames = null) : base(key: key)
+            List<PickListItem> itemNames = null,
+            OnItemChecked itemCheckCallback = null,
+            OnItemSelected itemSelectCallback = null) : base(key: key)
+            this.itemCheckCallback = itemCheckCallback;
+            this.itemSelectCallback = itemSelectCallback;
+        public readonly OnItemChecked itemCheckCallback;
+        public readonly OnItemSelected itemSelectCallback;
+        
         public override State createState()
         {
             return new LeftUIPanelState();
         }
 
         private readonly List<PickListItem> _searchResult = new List<PickListItem>();
+        private int selectedIndex = -1;
 
         private Widget buildSearchBar()
         {
                                         borderRadius: BorderRadius.all(Radius.circular(2.0f))
                                     ),
                                     margin: EdgeInsets.all(1),
-                                    child: new Row(
+                                    child: new GestureDetector(
+                                        onTap: () =>
+                                        {
+                                            setState(() =>
+                                            {
+                                                selectedIndex = index;
+                                                widget.itemSelectCallback?.Invoke(selectedIndex);
+                                            });
+                                        },
+                                        child: new AnimateButton(
+                                            selected: selectedIndex == index,
+                                            child: new Row(
                                         children: new List<Widget> {
                                             new Padding(padding: EdgeInsets.only(left: 2f)),
                                             new Checkbox(value: _searchResult[index].active, onChanged: (value) =>
                                                 setState(() =>
                                                 {
                                                     _searchResult[index].active = value.Value;
+                                                    widget.itemCheckCallback?.Invoke(index, value.Value);
-                                )));
+                                )))));
                         }) : new Center(
                             child: new Text("No Available Item", style: new TextStyle(fontSize: 8f))
                         )

AwesomeUIWidgets/Assets/Scripts/RaycastableScene/animate_button.cs

+using System;
+using uiwidgets;
+using Unity.UIWidgets.animation;
+using Unity.UIWidgets.foundation;
+using Unity.UIWidgets.ui;
+using Unity.UIWidgets.widgets;
+
+namespace UIWidgetsSample.RaycastableScene
+{
+    public class AnimateButton : StatefulWidget
+    {
+        public AnimateButton(Key key = null, Widget child = null, bool selected = false) : base(key: key)
+        {
+            this.child = child;
+            this.selected = selected;
+        }
+        
+        public readonly Widget child;
+        public readonly bool selected;
+        
+        public override State createState()
+        {
+            return new AnimateButtonState();
+        }
+    }
+
+    public class AnimateButtonState : SingleTickerProviderStateMixin<AnimateButton>
+    {
+        private AnimationController selectAnim;
+        private Animation<Color> _colorTween;
+
+        public override void initState()
+        {
+            selectAnim = new AnimationController(vsync: this, duration: new TimeSpan(0, 0, 0, 0, 200));
+            _colorTween = new ColorTween(begin: Colors.white, Colors.green).animate(selectAnim);
+            base.initState();
+        }
+
+        public override void dispose()
+        {
+            base.dispose();
+            selectAnim.dispose();
+        }
+
+
+        public override Widget build(BuildContext context)
+        {
+            if (widget.selected)
+            {
+                selectAnim.forward();
+            }
+            else
+            {
+                selectAnim.reverse();
+            }
+            
+            return new AnimatedBuilder(
+                    animation: _colorTween,
+                    builder: (build_context, child) =>
+                    {
+                        return new Container(
+                            color: _colorTween.value,
+                            child: widget.child);
+                    }
+                );
+        }
+    }
+}

AwesomeUIWidgets/Assets/Scripts/RaycastableScene/animate_button.cs.meta

+fileFormatVersion: 2
+guid: 96ea7736c64d4298849a9012085a0aa2
+timeCreated: 1627525724