Skip to content

Instantly share code, notes, and snippets.

@tomh4
Last active October 23, 2023 12:32
Show Gist options
  • Save tomh4/e3a37f1abba2361ed02c09577dc2f09c to your computer and use it in GitHub Desktop.
Save tomh4/e3a37f1abba2361ed02c09577dc2f09c to your computer and use it in GitHub Desktop.
An implementation to use DuoTone Icons in Xamarin.Forms
using System;
using System.Collections.Generic;
using System.Globalization;
using System.Text;
using System.Text.RegularExpressions;
using Xamarin.Forms;
namespace Fontawesome
{
public class DuoToneIcon : AbsoluteLayout
{
public EncodingStyle Encoding { get; set; } = EncodingStyle.Unicode;
public enum EncodingStyle
{
Unicode,
IconName
}
/// <summary>
/// MANDATORY ON ANDROID AND UWP
/// The font file name in your project including the file ending
/// e.g. FontAwesome5Duotone.otf
/// </summary>
public string FontFileName { get; set; }
private string FontFamily { get; set; }
private Label primaryLabel = new Label();
private Label secondaryLabel = new Label();
#region LabelProperties
public TextAlignment HorizontalIconAlignment { get { return (TextAlignment)GetValue(HorizontalIconAlignmentProperty); } set { SetValue(HorizontalIconAlignmentProperty, value); } }
public static readonly BindableProperty HorizontalIconAlignmentProperty = BindableProperty.Create("HorizontalTextAlignment", typeof(TextAlignment), typeof(DuoToneIcon), TextAlignment.Start, propertyChanged: OnHorizontalIconAlignmentPropertyChanged);
private static void OnHorizontalIconAlignmentPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (DuoToneIcon)bindable;
control.primaryLabel.HorizontalTextAlignment = (TextAlignment)newValue;
control.secondaryLabel.HorizontalTextAlignment = (TextAlignment)newValue;
}
public TextAlignment VerticalIconAlignment { get { return (TextAlignment)GetValue(VerticalIconAlignmentProperty); } set { SetValue(VerticalIconAlignmentProperty, value); } }
public static readonly BindableProperty VerticalIconAlignmentProperty = BindableProperty.Create("VerticalTextAlignment", typeof(TextAlignment), typeof(DuoToneIcon), TextAlignment.Start, propertyChanged: OnVerticalIconAlignmentPropertyChanged);
private static void OnVerticalIconAlignmentPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (DuoToneIcon)bindable;
control.primaryLabel.VerticalTextAlignment = (TextAlignment)newValue;
control.secondaryLabel.VerticalTextAlignment = (TextAlignment)newValue;
}
public double IconSize { get { return (double)GetValue(IconSizeProperty); } set { SetValue(IconSizeProperty, value); } }
public static readonly BindableProperty IconSizeProperty = BindableProperty.Create("IconSize", typeof(double), typeof(DuoToneIcon), 12d, propertyChanged: OnIconSizePropertyChanged);
private static void OnIconSizePropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (DuoToneIcon)bindable;
control.primaryLabel.FontSize = (double)newValue;
control.secondaryLabel.FontSize = (double)newValue;
}
public Color PrimaryColor { get { return (Color)GetValue(PrimaryColorProperty); } set { SetValue(PrimaryColorProperty, value); } }
public static readonly BindableProperty PrimaryColorProperty = BindableProperty.Create("PrimaryColor", typeof(Color), typeof(DuoToneIcon), Color.White, propertyChanged: OnPrimaryColorPropertyChanged);
private static void OnPrimaryColorPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (DuoToneIcon)bindable;
control.primaryLabel.TextColor = (Color)newValue;
}
public Color SecondaryColor { get { return (Color)GetValue(SecondaryColorProperty); } set { SetValue(SecondaryColorProperty, value); } }
public static readonly BindableProperty SecondaryColorProperty = BindableProperty.Create("SecondaryColor", typeof(Color), typeof(DuoToneIcon), Color.White, propertyChanged: OnSecondaryColorPropertyChanged);
private static void OnSecondaryColorPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (DuoToneIcon)bindable;
control.secondaryLabel.TextColor = (Color)newValue;
}
public double PrimaryOpacity { get { return (double)GetValue(PrimaryOpacityProperty); } set { SetValue(PrimaryOpacityProperty, value); } }
public static readonly BindableProperty PrimaryOpacityProperty = BindableProperty.Create("PrimaryOpacity", typeof(double), typeof(DuoToneIcon), 1d, propertyChanged: OnPrimaryOpacityPropertyChanged);
private static void OnPrimaryOpacityPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (DuoToneIcon)bindable;
control.primaryLabel.Opacity = (double)newValue;
}
public double SecondaryOpacity { get { return (double)GetValue(SecondaryOpacityProperty); } set { SetValue(SecondaryOpacityProperty, value); } }
public static readonly BindableProperty SecondaryOpacityProperty = BindableProperty.Create("SecondaryOpacity", typeof(double), typeof(DuoToneIcon), 0.5d, propertyChanged: OnSecondaryOpacityPropertyChanged);
private static void OnSecondaryOpacityPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (DuoToneIcon)bindable;
control.secondaryLabel.Opacity = (double)newValue;
}
#endregion
public string Icon { get { return (string)GetValue(IconProperty); } set { SetValue(IconProperty, value); } }
public static readonly BindableProperty IconProperty = BindableProperty.Create("Icon", typeof(string), typeof(DuoToneIcon), "", propertyChanged: OnIconPropertyChanged);
private static void OnIconPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (DuoToneIcon)bindable;
control.primaryLabel.Text = control.Encoding == EncodingStyle.Unicode ? UnicodeToCharacter(newValue.ToString()) : newValue.ToString() + "-primary";
control.secondaryLabel.Text = control.Encoding == EncodingStyle.Unicode ? UnicodeToCharacter("10" + newValue.ToString()) : newValue.ToString() + "-secondary";
}
private static string UnicodeToCharacter(string inStr)
{
int code = 0;
bool success = int.TryParse(inStr, System.Globalization.NumberStyles.HexNumber, CultureInfo.InvariantCulture, out code);
if (success)
{
return char.ConvertFromUtf32(code);
}
return inStr;
}
public DuoToneIcon()
{
switch (Device.RuntimePlatform)
{
case Device.iOS:
FontFamily = "FontAwesome5Duotone-Solid";
break;
case Device.UWP:
FontFamily = "/Assets/" + FontFileName + "#Font Awesome 5 Duotone";
break;
case Device.Tizen:
FontFamily = "FontAwesome5Duotone";
break;
case Device.Android:
FontFamily = FontFileName + "#Regular";
break;
default:
FontFamily = "FontAwesome5Duotone";
break;
}
primaryLabel.FontFamily = FontFamily;
primaryLabel.Text = Encoding == EncodingStyle.Unicode ? Icon : Icon + "-primary";
primaryLabel.TextColor = PrimaryColor;
primaryLabel.Opacity = PrimaryOpacity;
primaryLabel.FontSize = IconSize;
primaryLabel.HorizontalTextAlignment = HorizontalIconAlignment;
primaryLabel.VerticalTextAlignment = VerticalIconAlignment;
secondaryLabel.FontFamily = FontFamily;
secondaryLabel.Text = Encoding == EncodingStyle.Unicode ? "10" + Icon : Icon + "-secondary";
secondaryLabel.TextColor = SecondaryColor;
secondaryLabel.Opacity = SecondaryOpacity;
secondaryLabel.FontSize = IconSize;
secondaryLabel.HorizontalTextAlignment = HorizontalIconAlignment;
secondaryLabel.VerticalTextAlignment = VerticalIconAlignment;
AbsoluteLayout.SetLayoutBounds(primaryLabel, new Rectangle(0, 0, 1, 1));
AbsoluteLayout.SetLayoutFlags(primaryLabel, AbsoluteLayoutFlags.All);
AbsoluteLayout.SetLayoutBounds(secondaryLabel, new Rectangle(0, 0, 1, 1));
AbsoluteLayout.SetLayoutFlags(secondaryLabel, AbsoluteLayoutFlags.All);
this.Children.Add(secondaryLabel);
this.Children.Add(primaryLabel);
}
}
}
@tomh4
Copy link
Author

tomh4 commented Aug 26, 2019

Usage:
<fontawesome:DuoToneIcon Icon="f6be" Encoding="Unicode"/>
OR
<fontawesome:DuoToneIcon Icon="cat" Encoding="IconName"/>

Cheatsheet : https://fontawesome.com/cheatsheet/pro/duotone

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment