Implement radio button for Sky’s fn2

sky/sdk/lib/framework/components2/radio.dart

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'dart:sky' as sky;
 import '../fn2.dart';
+import '../rendering/box.dart';
+import '../rendering/object.dart';
 import 'button_base.dart';
 import 'ink_well.dart';
 
 typedef void ValueChanged(value);
 
 class Radio extends ButtonBase {
   Object value;
   Object groupValue;
   ValueChanged onChanged;
 
-  static final Style _style = new Style('''
-    width: 14px;
-    height: 14px;
-    border-radius: 7px;
-    border: 1px solid blue;
-    margin: 0 5px;'''
-  );
+  static const BoxDecoration highlightDecoration = const BoxDecoration(
+    backgroundColor: const sky.Color.fromARGB(102, 153, 153, 153)
+  ); 

[abarth-chromium, 2015/06/04 23:58:39]

No need for this.

[jackson, 2015/06/05 00:23:10]

Done.

 
-  static final Style _highlightStyle = new Style('''
-    width: 14px;
-    height: 14px;
-    border-radius: 7px;
-    border: 1px solid blue;
-    margin: 0 5px;
-    background-color: orange;'''
-  );
-
-  static final Style _dotStyle = new Style('''
-    width: 10px;
-    height: 10px;
-    border-radius: 5px;
-    background-color: black;
-    margin: 2px;'''
-  );
+  static const sky.Size outerSize = const sky.Size(outerRadius * 2, outerRadius * 2);

[abarth-chromium, 2015/06/04 23:58:39]

No need for this either.

[jackson, 2015/06/05 00:23:10]

Done.

 
   Radio({
     Object key,
     this.onChanged,
     this.value,
     this.groupValue
   }) : super(key: key);
 
   UINode buildContent() {
+    sky.Color color = highlight ? new sky.Color(0xFF673AB7) : new sky.Color(0x8A000000);

[eseidel, 2015/06/04 23:50:54]

I take it these are not material colors?

[abarth-chromium, 2015/06/04 23:58:38]

const sky.Color

[jackson, 2015/06/05 00:23:10]

Done.

+    const double outerWidth = 16.0;
+    const double outerRadius = outerWidth / 2;
+
+    CustomPaint buildDot() {
+      const double innerRadius = 5.0;
+      return new CustomPaint(
+        child: new Container(desiredSize: new sky.Size(outerWidth, outerWidth)),
+        callback: (RenderObjectDisplayList canvas) {
+          sky.Paint paint = new sky.Paint()..color = color;
+          paint.style = 0; // SkPaint::FILL_STYLE;

[eseidel, 2015/06/04 23:50:54]

Do we not have an enum?

[jackson, 2015/06/05 00:23:10]

I am going to fix this in the next CL

+          canvas.drawCircle(outerRadius, outerRadius, innerRadius, paint);
+        }
+      );
+    }
+
     return new EventListenerNode(
-      new StyleNode(
-        new InkWell(
-          children: value == groupValue ? [new Container(style: _dotStyle)] : []
-        ),
-        highlight ? _highlightStyle : _style
+      new Container(
+        margin: const EdgeDims.symmetric(horizontal: 5.0),
+        child: new CustomPaint(
+          callback: (RenderObjectDisplayList canvas) {
+            sky.Paint paint = new sky.Paint()..color = color;
+            paint.style = 1; // SkPaint::STROKE_STYLE;
+            paint.strokeWidth = 2.0;
+            canvas.drawCircle(outerRadius, outerRadius, outerRadius, paint);
+          },
+          child: new Container(
+            desiredSize: new sky.Size(outerWidth, outerWidth),
+            child: new InkWell(
+              children: value == groupValue ? [buildDot()] : []
+            )
+          )
+        )
       ),
       onGestureTap: _handleClick
     );
   }
 
   void _handleClick(_) {
     onChanged(value);
   }
 }