Android6.0风格图标,jQuery仿Android样式扁平风格图标插件

Flatify是一款可以制作安卓(Android)样式的Material-Design扁平风格图标的jQuery插件。它小巧实用，通过简单的设置，就可以制作出多种扁平风格的图标。

使用方法

使用该扁平风格图标插件需要引入jQuery和flatify.js文件。插件演示中使用了font-awesome字体图标。

该插件的CDN加速地址为：

https://cdn.rawgit.com/n3x0/Flatify/master/flatify.js

HTML结构

通过font-awesome字体图标的标准HTML结构来创建图标。

初始化插件

要将font-awesome字体图标转换为一个扁平风格的图标，可以像下面一样初始化插件。

$('#twitter').flatify({

'r':101, // red

'g':159, // green

'b':203 // blue

});

生成带长阴影效果的扁平图标的初始化方式如下：

$('#twitter').flatify({

'r':101, // red

'g':159, // green

'b':203, // blue

's':35, // number of shadows for the icon text

'a':0.7, // opacity for the icon text shadow

});

配置参数

该扁平风格图标插件有如下一些可用的参数。

'r'：取值0-255，组成图标RGB颜色的R值。

'g'：取值0-255，组成图标RGB颜色的G值。

'b'：取值0-255，组成图标RGB颜色的B值。

'f'：取值0-∞，图标的字体大小。

'w'：取值30-∞，图标的宽度。

'c'：取值0-50，图标的圆角百分百。

's'：取值0-100，图标阴影的数量。

'a'：取值0-1，图标阴影的透明度。

Android6.0风格图标,jQuery仿Android样式扁平风格图标插件相关推荐

jQuery仿Android锁屏图案应用插件
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
jQuery仿Android锁屏图案应用
jQuery仿Android锁屏图案应用在线演示本地下载 posted @ 2018-12-03 14:08 栖息地阅读(...) 评论(...) 编辑收藏
h5仿android 京东三级联动,jquery仿京东商城三级联动代码插件
2019-3-1更新:location.js文件里第三级县之前使用京东旧域名d.360buy.com的jsonp数据,域名做了跳转首页所以第三加载不出来.现在已经更新为d.jd.com,正常加载.不过 ...
android扁平风格图标下载,meeyo下载-meeyo扁平风格圆图标包下载v3.9.1 安卓版-西西软件下载...
meeyo是一款扁平风格的圆图标包,这种扁平化的设计颇有一种谷歌上面的风格,并且在整体上面也看起来十分的舒适,作为国内设计者所制作的图标包在适配上面也是较为的全面,你可以在各种启动器上面使用这款mee ...
android修改桌面app图标的问题,android修改桌面app图标的有关问题
android修改桌面app图标的问题. 我知道配置app图标的做法是在 manifest.xml中的 android:allowBackup="true" android:ico ...
【Midjourney】Midjourney Prompt 提示词 ① ( 贴纸风格 | A 扮演 B 角色 | 对称扁平 Logo 图标设计 | 列表图片 | 平行 / 直角排列元素 )
文章目录一.Design a Sticker of 提示词 - 贴纸风格二.A as B 提示词 - A 扮演 B 角色三.symmetrical,flat icon design 提示词 - ...
android6.0升级名单,首批升级Android 6.0机型名单出炉
今年九月份苹果和谷歌的新品发布会都备受关注,除了新机外iOS 9和Android M(安卓6.0)也同样受到用户关注.近日,谷歌就公开了首批获Android M系统升级的机器名单. 目前,首批升级An ...
Android教程 -05 Android6.0权限的管理
视频为本篇博客知识的讲解,建议采用超清模式观看, 欢迎点击订阅我的优酷 height="498" width="510" src="http://pl ...
Android源码定制（1）——Android6.0源码编译
一.前言最近在研究Xposed框架定制,恰好又看到看雪上两个大佬关于源码定制和Xposed源码定制的帖子,所以尝试基于Android6.0版本,详细记录一下从源码下载到Xposed框架定制的全过程. ...

Android6.0风格图标,jQuery仿Android样式扁平风格图标插件

Android6.0风格图标,jQuery仿Android样式扁平风格图标插件相关推荐

最新文章

热门文章