ExtWebView

My custom WebView. It has a HTML string property. This was very useful to draw my chart :) a simple HTML file with some embedded Javascript to draw the shapes. It was the faster way for me to make a cross pie chart control. When the HTML property has changed, the source of the WebView gets updated.

//
// <copyright file=ExtWebView.cs company=Krossapp>
//     Copyright (c) Krossapp. All rights reserved.
// </copyright>
// <author>Nicolas Krier</author>
//
namespace SDF.XForm.Controls
{
    #region Using

    using System.Diagnostics.CodeAnalysis;
    using System.Windows.Input;
    using Xamarin.Forms;

    #endregion

    /// <summary>
    /// Web view.
    /// </summary>
    public class ExtWebView : WebView
    {
        #region Bindable property

        /// <summary>
        /// The html property.
        /// </summary>
        [SuppressMessage(StyleCop.CSharp.MaintainabilityRules, SA1401:FieldsMustBePrivate, Justification = Reviewed.)]
        public static BindableProperty HtmlProperty = BindableProperty.Create<ExtWebView, string>(x => x.Html, null, BindingMode.OneWay, propertyChanged: WhenHtmlChanged);

        /// <summary>
        /// The command clicked property.
        /// </summary>
        [SuppressMessage(StyleCop.CSharp.MaintainabilityRules, SA1401:FieldsMustBePrivate, Justification = Reviewed.)]
        public static BindableProperty Command = BindableProperty.Create<ExtWebView, ICommand>(x => x.CommandClicked, null);

        #endregion

        #region Constructor

        /// <summary>
        /// Initializes a new instance of the <see cref=ExtWebView/> class.
        /// </summary>
        public ExtWebView()
            : base()
        {
            this.HandleTapEvent();
        }

        #endregion

        #region Property

        /// <summary>
        /// Gets or sets the html.
        /// </summary>
        /// <value>The html.</value>
        public string Html
        {
            get { return (string)this.GetValue(HtmlProperty); }
            set { this.SetValue(HtmlProperty, value); }
        }

        /// <summary>
        /// Gets or sets the command clicked.
        /// </summary>
        /// <value>The command clicked.</value>
        public ICommand CommandClicked
        {
            get { return (ICommand)this.GetValue(Command); }
            set { this.SetValue(Command, value); }
        }

        #endregion

        /// <summary>
        /// Raises the html changed event.
        /// </summary>
        /// <param name=sender>The sender.</param>
        /// <param name=oldValue>Old value.</param>
        /// <param name=newValue>New value.</param>
        private static void WhenHtmlChanged(BindableObject sender, string oldValue, string newValue)
        {
            WebView ctrl = (WebView)sender;
            ctrl.Source = new HtmlWebViewSource() { Html = newValue };
        }

        /// <summary>
        /// Handle the tap event : the click.
        /// </summary>
        private void HandleTapEvent()
        {
            /*
            var tapGestureRecognizer = new TapGestureRecognizer();
            tapGestureRecognizer.Tapped += (sender, args) =>
            {
                if (args != null && this.CommandClicked != null && this.CommandClicked.CanExecute(args))
                {
                    this.CommandClicked.Execute(args);
                }
            };
            this.GestureRecognizers.Add(tapGestureRecognizer);
            */
        }
    }
}

ExtSwitch

My custom switch control. This control is kind of useless right now. I don’t use to bind a command on a switch. Even more if the switch is used in a ListView because I may handle the tap event on a bigger area than just the switch itself.

//
// <copyright file=ExtSwitch.cs company=Krossapp>
//     Copyright (c) Krossapp. All rights reserved.
// </copyright>
// <author>Nicolas Krier</author>
//
namespace SDF.XForm.Controls
{
    #region Using

    using System.Diagnostics.CodeAnalysis;
    using System.Windows.Input;
    using Xamarin.Forms;

    #endregion

    /// <summary>
    /// The Switch.
    /// </summary>
    public class ExtSwitch : Switch
    {
        #region Bindable property

        /// <summary>
        /// The command toggled property.
        /// </summary>
        [SuppressMessage(StyleCop.CSharp.MaintainabilityRules, SA1401:FieldsMustBePrivate, Justification = Reviewed.)]
        public static BindableProperty CommandToggledProperty = BindableProperty.Create<ExtSwitch, ICommand>(x => x.CommandToggled, null);

        /// <summary>
        /// The command parameter toggled property.
        /// </summary>
        [SuppressMessage(StyleCop.CSharp.MaintainabilityRules, SA1401:FieldsMustBePrivate, Justification = Reviewed.)]
        public static BindableProperty CommandToggledParameterProperty = BindableProperty.Create<ExtSwitch, object>(x => x.CommandToggledParameter, null);

        #endregion

        #region Constructor

        /// <summary>
        /// Initializes a new instance of the <see cref=ExtSwitch/> class.
        /// </summary>
        public ExtSwitch()
            : base()
        {
            // SubscribeClickToRaiseCommand();
            this.Toggled += this.OnItemSelected;
        }

        #endregion

        #region Property

        /// <summary>
        /// Gets or sets the command toggled.
        /// </summary>
        /// <value>The command toggled.</value>
        public ICommand CommandToggled
        {
            get { return (ICommand)this.GetValue(CommandToggledProperty); }
            set { this.SetValue(CommandToggledProperty, value); }
        }

        /// <summary>
        /// Gets or sets the command parameter toggled.
        /// </summary>
        /// <value>The command parameter toggled.</value>
        public object CommandToggledParameter
        {
            get { return (object)this.GetValue(CommandToggledParameterProperty); }
            set { this.SetValue(CommandToggledParameterProperty, value); }
        }

        #endregion

        /// <summary>
        /// Raises the item selected event.
        /// </summary>
        /// <param name=sender>The sender.</param>
        /// <param name=e>The event args</param>
        private void OnItemSelected(object sender, ToggledEventArgs e)
        {
            if (this.CommandToggled != null && sender.GetType() == typeof(ExtSwitch) && ((ExtSwitch)sender).CommandToggledParameter != null && this.CommandToggled.CanExecute(e) && e.Value)
            {
                this.CommandToggled.Execute(this.CommandToggledParameter);
            }
        }

        /// <summary>
        /// Subscribes the click to raise command.
        /// </summary>
        private void SubscribeClickToRaiseCommand()
        {
            var tapGestureRecognizer = new TapGestureRecognizer();
            tapGestureRecognizer.Tapped += (sender, e) =>
            {
                if (this.CommandToggled != null && this.CommandToggled.CanExecute(e))
                {
                    this.CommandToggled.Execute(this.CommandToggledParameter);
                }
            };
            this.GestureRecognizers.Add(tapGestureRecognizer);
        }
    }
}

ExtProgressBar

This control needs a custom renderer to use the ProgressColor. A custom renderer gives you the possibility to animate the progress bar on iOS when its progress value changes.

//
// <copyright file=ExtProgressBar.cs company=Krossapp>
//     Copyright (c) Krossapp. All rights reserved.
// </copyright>
// <author>Nicolas Krier</author>
//
namespace SDF.XForm.Controls
{
    #region Using

    using System.Diagnostics.CodeAnalysis;
    using Xamarin.Forms;

    #endregion

    /// <summary>
    /// Progress bar.
    /// </summary>
    public class ExtProgressBar : ProgressBar
    {
        #region Bindable property

        /// <summary>
        /// The progress color property.
        /// </summary>
        [SuppressMessage(StyleCop.CSharp.MaintainabilityRules, SA1401:FieldsMustBePrivate, Justification = Reviewed.)]
        public static BindableProperty ProgressColorProperty = BindableProperty.Create<ExtProgressBar, Color>(x => x.ProgressColor, Color.Blue);

        #endregion

        #region Constructor

        /// <summary>
        /// Initializes a new instance of the <see cref=ExtProgressBar/> class.
        /// </summary>
        public ExtProgressBar()
            : base()
        {
        }

        #endregion

        #region Property

        /// <summary>
        /// Gets or sets the color of the progress.
        /// </summary>
        /// <value>The color of the progress.</value>
        public Color ProgressColor
        {
            get { return (Color)this.GetValue(ProgressColorProperty); }
            set { this.SetValue(ProgressColorProperty, value); }
        }

        #endregion
    }
}