DEV中svg图标的使用

Posted 2020-10-19 花生地

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了DEV中svg图标的使用相关的知识，希望对你有一定的参考价值。

0、开始之前

先看看使用效果

在操作栏的使用：

在菜单中的使用

1、简述SVG图标

中文名：可缩放矢量图形

外文名：Scalable Vector Graphics

外语缩写：SVG

开发商：万维网联盟

发行时间：1999年

格式：矢量图

延伸至：可扩展标记语言

类型：图形格式

2、DEV中使用SVG图标

            this._btnSvgImageTest.ImageOptions.ImageToTextAlignment = DevExpress.XtraEditors.ImageAlignToText.LeftCenter;
            this._btnSvgImageTest.ImageOptions.SvgImage = global::SmartSolution.Apps.ABM.UI.Properties.Resources.newemployee;
            this._btnSvgImageTest.ImageOptions.SvgImageSize = new System.Drawing.Size(24, 24);

在DEV中svg图标都是附加于控件的ImageOptions之上，所以可以通过为ImageOptions添加扩展方法简化Svg图片的使用

    /// <summary>
    /// 图标管理
    /// </summary>
    public static class ImageOptionsExtends
    {

        /// <summary>
        /// 设置SVG图标
        /// </summary>
        public static ImageOptions SetSvgIcon(this ImageOptions options, SvgImage svg, int width = 16, int height = 16)
        {
            options.SvgImageSize = new Size(width, height);
            options.SvgImage = svg;
            return options;
        }
        /// <summary>
        /// 
        /// </summary>
        /// <param name="options"></param>
        /// <param name="align"></param>
        /// <param name="indent"></param>
        public static SimpleButtonImageOptions SetSvgIconPosition(this SimpleButtonImageOptions options, ImageAlignToText align, int indent)
        {
            options.ImageToTextAlignment = ImageAlignToText.LeftCenter;
            options.ImageToTextIndent = 10;
            return options;
        }

    }

调用方法：

            _btnSvgImageTest.ImageOptions
                .SetSvgIconPosition(ImageAlignToText.LeftCenter, 10)
                .SetSvgIcon(Resources.newemployee, 24, 24);