Liangchao's blog
一个技术商人的笔记
github
|
email
Toggle navigation
Liangchao's blog
主页
归档
关于我
津ICP备17001227号
Rails-Gem-使用 avatar_magick 生成 gmail 头像效果
2018-03-13 14:19:14
252
0
0
liangchaob@163.com
# 摘要 其实通常来讲头像生成都是用 gravatar,但是是在外网,内网部署就会很麻烦,所以这里使用[avatar_magick](https://github.com/bjedrocha/avatar_magick) 它可以根据用户名生成 google 风格的用户名缩略头像,基本使用方式参考[使用指南](http://bjedrocha.com/rails/2016/01/06/default-gmail-style-avatars-in-rails/) # 步骤 首先先安装 gem`gemfile` ``` # 头像生成 gem 'dragonfly', '~> 1.1.4' gem 'avatar_magick' # 拼音 gem 'chinese_pinyin' ``` 安装插件 ``` bundle install ``` 初始化 dragonfly配置,理论上可以直接`rails g dragonfly`,但是要存储生成的图片,这里避免麻烦就不存了. ``` $ touch app/config/initializers/dragonfly.rb ``` 写入plugin 配置`app/config/initializers/dragonfly.rb` ``` require 'dragonfly' # Configure Dragonfly.app.configure do plugin :imagemagick plugin :avatarmagick end ``` 加入头像生成路由`config/route.rb` ``` # 头像动态生成 get "avatar/:size/:background/:text" => Dragonfly.app.endpoint { |params, app| app.generate(:initial_avatar, URI.unescape(params[:text]), { size: params[:size], background_color: params[:background] }) }, as: :avatar ``` 现在已经可以通过这个 url 随意生成 logo 了,比如`http://localhost:3000/avatar/250/d81b60/bart`  建立一个 model 的辅助模块 ``` $ touch app/models/concerns/avatarable.rb ``` `app/models/concerns/avatarable.rb` ``` # app/models/concerns/avatarable.rb module Avatarable extend ActiveSupport::Concern AVATAR_COLORS = [ 'e53935', 'b71c1c', 'd81b60', '880e4f', '8e24aa', '4a148c', '5e35b1', '311b92', '3949ab', '1a237e', '1e88e5', '0d47a1', '039be5', '01579b', '00acc1', '006064', '00897b', '004d40', '43a047', '1b5e20', '7cb342', '33691e', 'c0ca33', '827717', 'fdd835', 'f57f17', 'ffb300', 'ff6f00', 'fb8c00', 'e65100', 'f4511e', 'bf360c', '6d4c41', '3e2723', '757575', '212121', '546e7a', '263238' ] included do delegate :url_helpers, to: 'Rails.application.routes' end def avatar_magick_url url_helpers.send(:avatar_path, avatar_size, avatar_color, avatar_text) end def avatar_size 150 end def avatar_param to_param end def avatar_color AVATAR_COLORS[ Zlib.crc32( avatar_param ).modulo( AVATAR_COLORS.length ) ] end end ``` 最终在真正需要添加头像的 model 上应用 ``` class User < ApplicationRecord extend Dragonfly::Model include Avatarable ... # 头像字符 def avatar_text name_pinyin.chr end # 全名 def name_pinyin Pinyin.t(self.name) end end ``` 在 helper 里面加入这个 image_tag ``` module ApplicationHelper ... # 头像生成器 def user_avatar(user, options = {}) # 如果用户没有头像,就生成一个,有的话就用自带的 if user.avatar.nil? image_tag user.avatar_magick_url, options else image_tag user.avatar_url, options end end end ``` 在前端view调用 ``` <%= user_avatar(current_user, class: 'media-object img-circle', style: 'width:64px;height:64px;') %> ``` 图片动态调整大小只需要在外围套一层 thum的 div就好 ``` <div class="col-md-2 col-sm-4 col-xs-12"> <a href="#" class="thumbnail"> <!-- 显示当前用户头像 --> <%= render 'common/user_edit_avatar' %> </a> </div> ``` 最终效果 
上一篇:
Rails-使用 params 进行排序与筛选 与 筛选 btn 按钮 按需 active
下一篇:
Rails-菜单按钮按页面url动态 active
0
赞
252 人读过
新浪微博
微信
腾讯微博
QQ空间
人人网
提交评论
立即登录
, 发表评论.
没有帐号?
立即注册
0
条评论
More...
文档导航
没有帐号? 立即注册