9
30
2010
12

colorpicker: 给 Vim 加一个调色板!

本文来自依云's Blog,转载请注明。

作为一名一直喜欢写网页前端的vimmer,自然会使用Vim来编写CSS了。但是,CSS中经常需要调色。虽然相继有一些工具的出现(见可视化的配置Vim(gVim)配色-colorsel.vim),但一直不太理想。编辑CSS的颜色,不仅需要细致的调色,而且需要方便修改,并且支持从屏幕取色是最好不过了!

既然没有现成的,而自己不管怎么说已经入了GTK的门,就自己写了一个简单的工具。本来有个叫gcolor2的调色/取色工具的,可惜它不支持把取到的颜色输出到标准输出,或者任何其它可被其它程序调用的地方(难道这只是某个大牛闲着没事做时写着玩儿的 :-P)。所以,colorpicker与之类似,只有一个标准的GTK调色板。重要的不同之处在于:它可以和其它程序交互。

还是先放个图吧:

就是这样。从图中可以看到,这个标准的调色板除了支持RGB值,还支持HSV,而后者非常适合对色彩进行微调,不像RGB那样只有机器能够理解。左下角有之前颜色和当前颜色的显示(截图时没注意,都是白色。。。)。之前颜色是可以从命令行设置的,这个很有用(请往下看)。也有取色器,在Linux下是可以取到屏幕上任何一点的颜色的。但根据我使用GIMP的经验,好像在Windows上只能取到本程序的颜色。另外还可以看到,图中显示了“透明度”一项。关注Web前端的童鞋都知道,CSS3支持半透明色彩了,所以,本程序也支持输出rgba(79, 0, 159, 0.51)这样的颜色值。

关于程序自身的介绍就到这儿。下面是在Vim里使用的截图:

我需要输入一个颜色值,于是按了我自己定义的Alt-C键,colorpicker启动了。因为是新颜色,加之之前我没使用过,所以“之前颜色”那里显示的是默认的白色。

颜色已经输入了,但我想换一个颜色,怎么办呢?在普通模式下按cac(change a color)就可以了,“之前颜色”会被置为待修改的颜色,方便进行微调。


PS: 在图中可以看到CSS中的颜色值下方背景被高亮成了相应的颜色。这是使用css.vim实现的。

PS2: 这里演示的是修改CSS文件,但实际上是和文件类型无关的。你可以将它用于任何你想用的文件中。

PS3: colorpicker是独立的GTK程序,所以不一定非要和Vim配合工作啦。Emacs什么的一样可以调用,只要有人写出调用代码。

PS4: 程序在哪里下载呢?请移步我的陈列室。Vim调用部分的代码尚未整理,在我的vimrc中,搜索colorpicker就可以了(共两个函数,截图中可以看到函数名。目前(2010年9月30日)它们处于我的vimrc的前50行内)。


2011年4月9日更新

这里 jiazhoulvke 提供了编译好的 Windows 版程序(以及分离出来的 Vim 配置),当然GTK Runtime 环境还是得装,而且还可能遭遇著名的DLL Hell(如果不幸地出现了,那么请把出问题的 DLL 文件从 GTK 的 bin 目录复制到 colorpicker.exe 所在的目录中)。

2014年11月8日更新:

颜色值的高亮显示可以使用 colorizer 插件了哦~

Category: Vim | Tags: gtk css vim C代码 | Read Count: 9163
蓝色基因 说:
Oct 01, 2010 06:42:35 AM

这个厉害!

keke 说:
Oct 05, 2010 12:25:03 AM

一般在ps看颜色,原来vim中也有这种插件,太强大了。

keke 说:
Oct 05, 2010 12:27:17 AM

罪过,没好好看文章,看来在Windows下是没戏了?

Avatar_small
依云 说:
Oct 05, 2010 12:32:37 AM

Windows下也有GTK啊,就是不知道好不好用。或者你弄个Windows原生取色器来代替colorpicker也是可以的。

jiazhoulvke 说:
Apr 09, 2011 01:00:05 PM

一直就想要这个功能,今天无意中发现这篇文章,在windows下一次用gcc性的编译通过了,哈哈。

Avatar_small
依云 说:
Apr 09, 2011 04:06:13 PM

啊,那你是在 Win 下搭建了 GTK 的编译环境了?

jiazhoulvke 说:
Apr 10, 2011 08:59:13 PM

说来也巧,我在看到这篇文章之前就正好在学习gtk编程,编译环境也是刚搭建成功,真没想到这么快就派上用场了,呵呵。

Star Brilliant 说:
Jul 31, 2013 10:03:27 PM

Windows上也可以获取屏幕某一点颜色。
因为看过某人写的屏保程序源代码,就是这样取色的:is.gd/FqTmlG

Avatar_small
依云 说:
Jul 31, 2013 10:16:46 PM

这是 Dephi 啊……真要好好支持 Windows 我还不如去调 Win32 API 呢。

Star Brilliant 说:
Jul 31, 2013 11:13:37 PM

看清楚。那个是纯 Win API。没有用 Delphi 库。

Avatar_small
依云 说:
Jul 31, 2013 11:28:35 PM

我是指,拿 C 或者 Python 去调……Delphi 看不太懂。

Star Brilliant 说:
Jul 31, 2013 11:35:14 PM

我既然说是没有用 Delphi 库了,就应该说是纯 Pascal 了。
关键点在 CreateDC 和 GetPixel 这两个 API。

(那个源代码里面的单引号竟然莫名其妙变成了 '……)


登录 *


loading captcha image...
(输入验证码)
or Ctrl+Enter

部分静态文件存储由又拍云存储提供。 | Theme: Aeros 2.0 by TheBuckmaker.com