Location>code7788 >text

Use vector font (FontAwsome, Elegant) icons in WinForm (C/S) projects.

Popularity:462 ℃/2024-12-09 19:41:02

1. Introduction

Font icons are most common in web applications, font icons are vector, vector graphics means that each icon renders perfectly on all screen sizes, can change size and color at any time, and is not distorted. Font icons are commonly found in Font Awesome and Elegant Icon Font, they not only have a large number of icons, but are also free to use. If these icons can be used in WinForm project, not only can bring a more intuitive interface effect, but also allows the icon is no longer limited to similar png type, this article will introduce how to use font icons in WinForm project.

2、Font icon selection

Online IconFont resources are many, while many sites that provide SVG downloads will provide the corresponding IconFont files. In this article: more popular and open source free FontAwesome font icons as an example, to explain how to use the WinForm project developed by .

FontAwesome, official website:/v4/icons

FontAwesome

In the above image, we can see that each icon has a corresponding Unicode encoding, which we need to use for the icon presentation.

3. Usage

Download the font icons locally and put them in the corresponding location of the project, such as in our project uses two types of font icons, FontAwesome and ElegantIcon, as shown in the figure below.

字体图标

图标

The code for defining the enumeration section corresponding to the font encoding in the project is shown below.

/// <summary>
/// Icon enumeration,incorporateAwesomeIcons andEleganticon (computing),meta-analysisAcap (a poem)Ebeginning
/// </summary>
public enum FontIcons
{
    #region Awesome English:Awesome
    /// <summary>
    /// a fa 500PX
    /// </summary>
    A_fa_500px = 0xf26e,
    /// <summary>
    /// a fa address book
    /// </summary>
    A_fa_address_book = 0xf2b9,
    /// <summary>
    /// a fa address book o
    /// </summary>
    A_fa_address_book_o = 0xf2ba,
    /// <summary>
    /// a fa address card
    /// </summary>
    A_fa_address_card = 0xf2bb,
    #endregion
    
    #region Elegant English:Elegant
    /// <summary>
    /// The e arrow up
    /// </summary>
    E_arrow_up = 0x21,
    /// <summary>
    /// The e arrow down
    /// </summary>
    E_arrow_down = 0x22,
    /// <summary>
    /// The e arrow left
    /// </summary>
    E_arrow_left = 0x23,
    #endregion
}

Define the font icon loading public class :, this class not only supports to load the icon to specify the size of the size, but also can set the foreground color and background color.

FontImagesHelper

The source code is below:

/// <summary>
/// 字体icon (computing)图片,awesomeFonts are loaded by default,elegantDelayed loading of fonts while in use
/// </summary>
public static class FontImagesHelper
{
    /// <summary>
    /// The m font collection
    /// </summary>
    private static readonly PrivateFontCollection fontCollection = new PrivateFontCollection();

    /// <summary>
    /// The m fonts awesome
    /// </summary>
    private static readonly Dictionary<string, Font> fontsAwesome = new Dictionary<string, Font>();

    /// <summary>
    /// The m fonts elegant
    /// </summary>
    private static readonly Dictionary<string, Font> fontsElegant = new Dictionary<string, Font>();

    /// <summary>
    /// The m cache maximum size
    /// </summary>
    private static Dictionary<int, float> cacheMaxSize = new Dictionary<int, float>();

    /// <summary>
    /// The minimum font size
    /// </summary>
    private const int MinFontSize = 8;

    /// <summary>
    /// The maximum font size
    /// </summary>
    private const int MaxFontSize = 43;

    /// <summary>
    /// constructor
    /// </summary>
    /// <exception cref="FileNotFoundException">Font file not found</exception>
    static FontImagesHelper()
    {
        string strFile = (, "Resource", "IconFont\\");
        (strFile);
        float size = MinFontSize;
        for (int i = 0; i <= (MaxFontSize - MinFontSize) * 2; i++)
        {
            (("F2"), new Font([0], size, , ));
            size += 0.5f;
        }
    }

    /// <summary>
    /// Get Icon
    /// </summary>
    /// <param name="iconName">Icon name</param>
    /// <param name="imageSize">Icon size</param>
    /// <param name="foreColor">foreground color</param>
    /// <param name="backColor">background color</param>
    /// <returns>icon (computing)</returns>
    public static Icon GetIcon(string iconName, int imageSize = 32, Color? foreColor = null, Color? backColor = null)
    {
        FontIcons icon = (FontIcons)(typeof(FontIcons), iconName);
        return GetIcon(icon, imageSize, foreColor, backColor);
    }

    /// <summary>
    /// Get Icon
    /// </summary>
    /// <param name="iconName">Icon name</param>
    /// <param name="imageSize">Icon size</param>
    /// <param name="foreColor">foreground color</param>
    /// <param name="backColor">background color</param>
    /// <returns>icon (computing)</returns>
    public static Icon GetIcon(FontIcons iconName, int imageSize = 32, Color? foreColor = null, Color? backColor = null)
    {
        try
        {
            Bitmap image = GetImage(iconName, imageSize, foreColor, backColor);
            return image != null ? ToIcon(image, imageSize) : null;
        }
        catch
        {
            return null;
        }
    }

    /// <summary>
    /// Get Icon
    /// </summary>
    /// <param name="iconName">Icon name</param>
    /// <param name="imageSize">Icon size</param>
    /// <param name="foreColor">foreground color</param>
    /// <param name="backColor">background color</param>
    /// <returns>icon (computing)</returns>
    public static Bitmap GetImage(string iconName, int imageSize = 32, Color? foreColor = null, Color? backColor = null)
    {
        try
        {
            FontIcons icon = (FontIcons)(typeof(FontIcons), iconName);
            return GetImage(icon, imageSize, foreColor, backColor);
        }
        catch
        {
            return null;
        }
    }    

    /// <summary>
    /// Gets the size of the icon.
    /// </summary>
    /// <param name="iconName">The icon text.</param>
    /// <param name="graphics">The graphics.</param>
    /// <param name="font">The font.</param>
    /// <returns>Size.</returns>
    private static Size GetIconSize(FontIcons iconName, Graphics graphics, Font font)
    {
        string text = char.ConvertFromUtf32((int)iconName);
        return (text, font).ToSize();
    }

    /// <summary>
    /// Converts to icon.
    /// </summary>
    /// <param name="srcBitmap">The source bitmap.</param>
    /// <param name="size">The size.</param>
    /// <returns>Icon.</returns>
    /// <exception cref="ArgumentNullException">srcBitmap</exception>
    private static Icon ToIcon(Bitmap srcBitmap, int size)
    {
        if (srcBitmap == null)
        {
            throw new ArgumentNullException("srcBitmap");
        }

        Icon icon;
        using (MemoryStream memoryStream = new MemoryStream())
        {
            new Bitmap(srcBitmap, new Size(size, size)).Save(memoryStream, );
            Stream stream = new MemoryStream();
            BinaryWriter binaryWriter = new BinaryWriter(stream);
            if ( <= 0L)
            {
                return null;
            }

            ((byte)0);
            ((byte)0);
            ((short)1);
            ((short)1);
            ((byte)size);
            ((byte)size);
            ((byte)0);
            ((byte)0);
            ((short)0);
            ((short)32);
            ((int));
            (22);
            (());
            ();
            (0, );
            icon = new Icon(stream);
            ();
        }

        return icon;
    }
}

The use of font icons is integrated in the framework product, and the icons of the framework module are loaded integrally by font icons, as shown in the following figure.

模块字体图标

Calls the code for the corresponding icon.

var img = ("A_fa_address_card", 26, "#66B9BF");

In addition to the font icons mentioned above, we can also use the Alibaba vector icon library at:/

4. Reference articles

iconfont-alibaba vector icon library

FontAwesome Font Icon Chinese Icon

CS Agile Development Framework V6.1 released (.NET6+, Framework dual-engine, the only network)

NET development WinForm (C/S) project to integrate three service access modes (direct connection, WCF, WebAPI)