tesses50
/
Ooui-tws-port
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Write custom switch control

This commit is contained in:
Frank A. Krueger 2018-02-02 20:51:05 -08:00
parent e4b1c44aa3
commit d58625129b
No known key found for this signature in database
GPG Key ID: 0471C67474FFE664
4 changed files with 87 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
Ooui.Forms/Renderers/SwitchRenderer.cs
View File

@ -3,7 +3,7 @@ using Xamarin.Forms;
namespace Ooui.Forms.Renderers
{
public class SwitchRenderer : ViewRenderer<Switch, Input>
public class SwitchRenderer : ViewRenderer<Switch, SwitchRenderer.SwitchElement>
{
public override SizeRequest GetDesiredSize (double widthConstraint, double heightConstraint)
{
@ -26,7 +26,7 @@ namespace Ooui.Forms.Renderers
if (e.NewElement != null) {
if (Control == null) {
var input = new Input (InputType.Checkbox);
var input = new SwitchElement ();
SetNativeControl (input);
Control.Change += OnControlValueChanged;
}
@ -47,5 +47,52 @@ namespace Ooui.Forms.Renderers
{
Control.IsChecked = Element.IsToggled;
}
public class SwitchElement : Div
{
public event EventHandler Change;
bool isChecked = false;
readonly Div knob = new Div ();
public bool IsChecked {
get => isChecked;
set {
isChecked = value;
UpdateUI ();
}
}
public SwitchElement ()
{
AppendChild (knob);
knob.Style.Position = "absolute";
knob.Style.BorderRadius = "10px";
knob.Style.Cursor = "pointer";
knob.Style.Top = "2px";
knob.Style.Width = "18px";
knob.Style.Height = "34px";
Style.BorderRadius = "10px";
Style.Cursor = "pointer";
Style.BorderStyle = "solid";
Style.BorderWidth = "2px";
Click += (s, e) => {
IsChecked = !IsChecked;
Change?.Invoke (this, EventArgs.Empty);
};
UpdateUI ();
}
void UpdateUI ()
{
Style.BackgroundColor = isChecked ? "#337ab7" : "#888";
Style.BorderColor = Style.BackgroundColor;
knob.Style.BackgroundColor = isChecked ? "#FFF" : "#EEE";
if (isChecked) {
knob.Style.Left = "34px";
}
else {
knob.Style.Left = "2px";
}
}
}
}
}

2
Ooui/Client.js
View File

@ -1,6 +1,6 @@
// Ooui v1.0.0
var debug = true;
var debug = false;
const nodes = {};
const hasText = {};

40
Ooui/Color.cs
View File

@ -65,15 +65,47 @@ namespace Ooui
if (styleValue == "inherit")
return Colors.Clear;
//if (styleValue[0] == '#' && styleValue.Length == 4) {
//}
if (styleValue[0] == '#' && styleValue.Length == 4) {
var r = ReadHexNibble (styleValue[1]);
var g = ReadHexNibble (styleValue[2]);
var b = ReadHexNibble (styleValue[3]);
return new Color (r, g, b, 255);
}
//if (styleValue[0] == '#' && styleValue.Length == 7) {
//}
if (styleValue[0] == '#' && styleValue.Length == 7) {
var r = ReadHexByte (styleValue[1], styleValue[2]);
var g = ReadHexByte (styleValue[3], styleValue[4]);
var b = ReadHexByte (styleValue[5], styleValue[6]);
return new Color (r, g, b, 255);
}
throw new ArgumentException ($"Cannot parse color string `{styleValue}`", nameof (styleValue));
}
static byte ReadHexByte (char c0, char c1)
{
var n0 = ReadHex (c0);
var n1 = ReadHex (c1);
return (byte)((n0 << 4) | n1);
}
static byte ReadHexNibble (char c)
{
var n = ReadHex (c);
return (byte)((n << 4) | n);
}
static byte ReadHex (char c)
{
if ('0' <= c && c <= '9')
return (byte)(c - '0');
if ('a' <= c && c <= 'z')
return (byte)((c - 'a') + 10);
if ('A' <= c && c <= 'Z')
return (byte)((c - 'A') + 10);
return 0;
}
public override string ToString ()
{
if (A == 255)

2
Samples/SwitchErrorSample.cs
View File

@ -22,7 +22,7 @@ namespace Samples
};
sw.Toggled += (sender, args) =>
{
label.Text = $"Switch state is :{((Switch)sender).IsToggled}";
label.Text = $"Switch state is: {((Switch)sender).IsToggled}";
};
layout.Children.Add(label);
layout.Children.Add(sw);