简介

Cameleon 是一个轻量级且功能强大的 iOS (Objective-C & Swift) 颜色框架。它建立在软件应用应该无缝运行同时保持其美丽界面的理念之上。

使用 Chameleon，您可以轻松停止调整 RGB 值，浪费数小时来找出您的应用中应该使用的正确颜色组合，并担心您的文本是否会在您应用的多种背景色上可读。

特性

应用展示

在即将到来的更新中，我们将开始展示一些最佳使用 Chameleon 的应用和公司。如果您希望您的应用在本节中展示，请确保添加到这里。

目录

● 产品特性
● 要求
● 许可证
● 贡献
● 文档
●Storyboard 添加组件
● 作者
● 感谢
● 待办事项清单
● 变更日志

🌟产品特性

100% 扁平化 & 美观

Chameleon 提供了24种精选颜色，包括浅色和深色。

扁平化色彩方案

Chameleon 提供了三种从扁平或非扁平颜色生成的扁平化色彩方案类别。 以下示例中，白色星星表示用于生成方案的色彩。

类似扁平色彩方案

互补式平面配色方案

三原色平面配色方案

对比文本

在选择文本颜色时，有众多选择，但很难找到一个所有人都喜欢并且能够阅读的颜色。无论你对文本颜色和色调的选择持有疑虑，还是担心让用户自定义个人资料颜色会因为干扰可读性或用户体验，你都不必再担忧。有了Chameleon，你可以确保所有文本都能独立于背景颜色突出显示。

哦……Chameleon同样可以与状态栏一起使用。: )

主题

Chameleon现在允许你用最少的一条代码轻松为主题化应用程序。你可以为所有视图设置主题，也可以为特定的视图设置主题。

从图像中提取颜色

Chameleon允许你无缝地从图像中提取非平面或平面配色方案，无需麻烦。你还可以轻松地从一个图像生成平均颜色。现在你可以根据图像来调整用户资料或产品的UI颜色了！

渐变颜色

随着iOS 7 & 8的发布，苹果普及了平面颜色。现在，随着iOS 9的发布，Chameleon试图再次提升水平。你好，渐变颜色。使用一行代码，你可以轻松设置任何对象的颜色属性为渐变（背景颜色、文本颜色、调色板颜色等）。Chameleon的其他功能，如对比功能，也可以应用于创建无缝的产品。鼓励实验，欢迎勇气！

Xcode 快速帮助文档

尽管Chameleon的文档尽可能写得清晰简洁，但仍可能让人有些困惑。但别担心！我们致力于简化整个颜色处理过程的愿景，因此我们添加了Xcode 快速帮助文档支持！只需突出显示Chameleon方法或用三根手指轻触它，即可了解更多关于它是做什么的以及如何使用的信息！

Storyboard 调色板

如果你像我一样喜欢使用Storyboard，Chameleon为你提供了方便。我们为你提供了一种快速简单的方式，可以直接从Storyboard或其他使用颜色选择器（例如TextEdit）的应用程序中访问Chameleon颜色。

⚠️要求

• Objective-C或Swift
• 要求Objective-C至少iOS 7.0（对于所有早期版本未进行积极开发，但可能与6.0兼容）和Swift至少iOS 8.0。
• 要求使用Xcode 6.3在任何iOS项目中使用。

🔑许可证

Chameleon根据MIT许可协议的条款和条件发布和分发。

👥贡献

如果你遇到问题，请打开一个问题。我们还积极欢迎拉取请求。通过向Chameleon做出贡献，你同意你的贡献将在其MIT许可证下进行授权。

如果你在你的应用中使用Chameleon，我们非常乐意听听你的意见！在twitter上向Vicc发送信息。

📗文档

Chameleon 中所有可用的方法、属性和类型都如下所述。

文档目录

● 安装
● Storyboard 扩展插件
● 使用方法
● UIColor 方法
● 从图片中获取颜色
● UIStatusBarStyle 方法
● 颜色方案方法
● 主题方法

安装

Objective-C

use_frameworks!

pod 'ChameleonFramework'

Swift

use_frameworks!

pod 'ChameleonFramework/Swift'

注意： Chameleon 2.0 的 Swift 支持即将完成。

手动安装

如果您更愿意手动安装此框架，只需将 Chameleon 文件夹拖放到您的项目中，并确保您勾选以下复选框。注意：如果您打算使用渐变色，别忘了手动导入 QuartzCore 和 CoreGraphics 框架！

如果您使用 Swift 并且正在手动安装 Chameleon，还有一个额外的步骤。请确保下载并将以下文件，ChameleonShorthand.swift，拖放到您的项目中，然后一切就绪。

Storyboard 扩展插件

在 Storyboard 中使用 Chameleon 的出色调色板很容易！只需下载并安装 Chameleon 调色板。

安装后，请确保重启 XCode。您将可以在需要时随时在颜色选择器中找到所有 Chameleon 的颜色！ :)

使用方法

为了使用 Chameleon 的众多功能，请包含以下导入

Objective-C

#import <ChameleonFramework/Chameleon.h>

Swift

import ChameleonFramework

如果您手动安装了 Chameleon

#import "Chameleon.h"

UIColor 方法

● 饱和颜色
● 随机颜色
● 补充颜色
● 对比颜色
● 展平非饱和颜色
● 渐变色
● 十六进制颜色
● 更亮和更暗的颜色

饱和颜色

使用饱和颜色就像添加其他任何颜色到您的应用中（可能更容易）。例如，要将视图的背景属性设置为一种深色调的饱和颜色，您只需执行以下操作

常规约定

Objective-C

self.view.backgroundColor = [UIColor flatGreenColorDark];

Swift

view.backgroundColor = UIColor.flatGreenColorDark()

变色龙简写

Objective-C

self.view.backgroundColor = FlatGreenDark;

Swift

view.backgroundColor = FlatGreenDark()

设置浅色系颜色的颜色与设置深色系颜色相同，只是不需要添加 Dark 后缀。默认情况下，所有没有添加 Dark 后缀的颜色均为浅色系。例如

常规方法

Objective-C

self.view.backgroundColor = [UIColor flatGreenColor];

Swift

view.backgroundColor = UIColor.flatGreenColor()

变色龙简写

Objective-C

self.view.backgroundColor = FlatGreen;

Swift

view.backgroundColor = FlatGreen()

随机颜色

生成随机纯色有四种方法。如果你对浅色系或深色系没有偏爱，可以这样做

常规方法

Objective-C

self.view.backgroundColor = [UIColor randomFlatColor];

Swift

view.backgroundColor = UIColor.randomFlatColor()

变色龙简写

Objective-C

self.view.backgroundColor = RandomFlatColor;

Swift

view.backgroundColor = RandomFlatColor()

否则，你可以通过以下方法调用来指定返回浅色系或深色系

常规方法

Objective-C

[UIColor colorWithRandomFlatColorOfShadeStyle:UIShadeStyleLight];

Swift

UIColor(randomFlatColorOfShadeStyle:.Light)

变色龙简写

Objective-C

RandomFlatColorWithShade(UIShadeStyleLight);

Swift

RandomFlatColorWithShade(.Light)

UIShadeStyles

• UIShadeStyleLight （Swift中的 UIShadeStyle.Light）
• UIShadeStyleDark （Swift中的 UIShadeStyle.Dark）

从颜色列表中选择一个随机颜色

如果你需要更加有选择性，只从一组特定的颜色中选择随机颜色，可以使用以下方法

常规方法

Objective-C

[UIColor colorWithRandomColorInArray:@[FlatWhite, FlatRed, FlatBlue]];

Swift

TBA

Chameleon 简写

Objective-C

RandomFlatColorInArray(@[FlatWhite, FlatRed, FlatBlue]) 

Swift

TBA

选择一个随机的单色颜色，但不包括少数几种

但最后一项绝对不是最不重要的，你也可以从随机颜色列表中选择，排除你不想使用的颜色。例如，如果你想随机会选一个用户资料的单色颜色，但不想使用任何黑色、灰色或白色。你可以简单地这样做

常规方法

Objective-C

[UIColor colorWithRandomFlatColorExcludingColorsInArray:@[FlatBlack, FlatBlackDark, FlatGray, FlatGrayDark, FlatWhite, FlatWhiteDark]];

Swift

TBA

Chameleon 简写

Objective-C

RandomFlatColorExcluding(@[FlatBlack, FlatBlackDark, FlatGray, FlatGrayDark, FlatWhite, FlatWhiteDark]) 

Swift

TBA

互补颜色

要生成互补颜色，执行以下方法调用，请记住指定你想要其互补色的颜色

常规方法

Objective-C

[UIColor colorWithComplementaryFlatColorOf:(UIColor *)someUIColor];

Swift

UIColor(complementaryFlatColorOf:someUIColor)

Chameleon 简写

Objective-C

ComplementaryFlatColorOf(color);

Swift

ComplementaryFlatColorOf(color)

对比颜色

对比颜色功能将返回暗色或亮色，取决于 Chameleon 算法认为更好的选择。您可以指定所需的是暗色还是亮色：([UIColor flatWhiteColor] & [UIColor flatBlackColorDark]) 或非单色 ([UIColor whiteColor] & [UIColor blackColor]).

如果您正在尝试设置 UILabel's textColor 属性，请确保提供 UILabel's backgroundColor。如果您的标签没有背景色，只需提供位于 UILabel 后面对象的 backgroundColor 属性。

这里是一个例子

常规用法

Objective-C

[UIColor colorWithContrastingBlackOrWhiteColorOn:(UIColor *)backgroundColor isFlat:(BOOL)flat];

Swift

UIColor(contrastingBlackOrWhiteColorOn:UIColor!, isFlat:Bool)

Chameleon 简写

Objective-C

ContrastColor(backgroundColor, isFlat);

Swift

ContrastColor(backgroundColor, isFlat)

细化非平面颜色

如前所述，此功能是 Chameleon 独有的。虽然这个功能还在初期运作阶段，可以进行改进，但它能精确地找到光谱中任何颜色的最近平面版本，并且使用起来非常简单。

常规用法

Objective-C

[(UIColor *)color flatten];

Swift

UIColor.pinkColor().flatten()

渐变色

通常使用渐变色给对象着色需要几行代码，加上许多行代码来实现智能对比文本。幸运的是，Chameleon 已经为您处理这些。我们介绍了一种新的方式来实现多彩对象，那就是使用渐变色！

渐变样式

Chameleon 提供了三种简单的渐变样式。只要提供至少两种颜色，您就可以从所需数量的颜色中创建渐变。别忘了对比文本功能也兼容渐变色！

UIGradientStyles

• UIGradientStyleLeftToRight (Swift 中的 UIGradientStyle.LeftToRight)
• UIGradientStyleTopToBottom (Swift 中的 UIGradientStyle.TopToBottom)
• UIGradientStyleRadial (Swift 中的 UIGradientStyle.Radial)

常规用法

Objective-C

[UIColor colorWithGradientStyle:(UIGradientStyle)gradientStyle withFrame:(CGRect)frame andColors:(NSArray<UIColor *> *)colors];

Swift

UIColor(gradientStyle:UIGradientStyle, withFrame:CGRect, andColors:[UIColor])

Chameleon 简写

Objective-C

GradientColor(gradientStyle, frame, colors);

Swift

GradientColor(gradientStyle, frame, colors)

Objective-C 备注：如果您使用 Chameleon 简写，并使用 NSArray 文字字面量 @[] 来设置颜色数组，请确保在它周围添加括号，否则您会得到一个错误。

注意：目前 UIGradientStyleRadial 只使用最多 2 种颜色。因此，如果提供更多颜色，它们将不会显示。

十六进制颜色

最受欢迎的功能之一，十六进制颜色 现在 available。您可以简单地提供带有或不含 # 符号的十六进制字符串。

常规用法

Objective-C

[UIColor colorWithHexString:(NSString *)string];

Swift

UIColor(hexString:string)

变色龙简写

Objective-C

HexColor(hexString)

Swift

HexColor(hexString)

十六进制颜色值

获取 UIColor 的 hexValue 非常简单。

Objective-C

[FlatGreen hexValue]; //Returns @"2ecc71"

Swift

FlatGreen.hexValue //Returns @"2ecc71"

亮色和暗色

有时您可能只需要一种稍微亮一些或暗一些的颜色。对于这些罕见但至关重要的时刻，变色龙可以提供帮助。您现在可以按以下方式使任何颜色变亮

常规方法

Objective-C

[color lightenByPercentage:(CGFloat)percentage];

Swift

color.lightenByPercentage(percentage: CGFloat)

您也可以生成颜色的暗色版本

常规方法

Objective-C

[color darkenByPercentage:(CGFloat)percentage];

Swift

color.darkenByPercentage(percentage: CGFloat)

从图片中提取颜色

Chameleon 现在支持从图片中提取颜色。您可以从图片中生成扁平和非扁平调色板，或者轻松提取平均颜色。

要生成调色板，只需执行以下操作

常规方法

Objective-C

[NSArray arrayOfColorsFromImage:(UIImage *)image withFlatScheme:(BOOL)flatScheme];

Swift （缺少数组扩展）

NSArray(ofColorsFromImage: UIImage, withFlatScheme: Bool)

变色龙简写

Objective-C

ColorsFromImage(image, isFlatScheme)

Swift

ColorsFromImage(image, isFlatScheme)

要从图片中提取平均颜色，您也可以这样做

常规方法

Objective-C

[UIColor colorWithAverageColorFromImage:(UIImage *)image];

Swift

UIColor(averageColorFromImage: UIImage)

变色龙简写

Objective-C

AverageColorFromImage(image)

Swift

AverageColorFromImage(image)

UIStatusBarStyle 方法

对比 UIStatusBarStyle

市场上许多应用，即使是最受欢迎的，也忽略了美丽应用的一个方面：状态栏样式。Chameleon 做了其他任何框架都没有做的事情……它创建了一个新的状态栏样式：UIStatusBarStyleContrast。无论是您有一个嵌入 NavigationController 中的 ViewController，还是没有，您可以这样做

正常惯例

Objective-C

[self setStatusBarStyle:UIStatusBarStyleContrast];

Swift

self.setStatusBarStyle(UIStatusBarStyleContrast)

注意：确保 Info.plist 中的键 View controller-based status bar appearance 设置为 YES。

颜色方案方法

注意：由于当前可用的纯色数量有限，颜色方案可能会返回重复某些纯色的结果。由于这种冗余，我们提供了返回纯色方案或非纯色方案的选择，直到更多的纯色添加到库存中。

初始颜色可以是非纯色或纯色。Chameleon 将返回一个包含 5 个 UIColor 的 NSArray，其中原始颜色将是方案中的第三个对象。这允许 Chameleon 设计颜色方案的颜色（从初始颜色逆时针和顺时针两个颜色），因此所选颜色将按照特定顺序排列。

类似颜色方案

类似颜色方案使用色彩轮上的相邻三种颜色。根据维基百科，最好与暖色调或冷色调一起使用，以创造具有某些温度质感和适当色彩和谐的统一集合；但是，这个方案缺乏对比度，不如互补方案鲜艳。在方案中，选择一种颜色为主色调，两种为辅助色。剩下的两种颜色应与黑色、白色或灰色一起用作配饰。

互补色方案

互补色方案使用色彩轮上的对角颜色。用略带技术性的话来说，它们是两种颜色，当结合使用时会产生一种中性色。互补色在大量使用时很棘手，但在需要强调点时效果很好。互补色通常不适宜用于文本。

三色方案

三色调方案在色轮上使用均匀间隔的颜色。这些颜色往往是生动丰富的，并且提供更高的对比度，同时在保持色彩和谐。让一种颜色为主色调，并用另外两种颜色进行点缀。

获取色彩方案中的颜色

要获取一个颜色数组，首先确保初始化一个NSMutableArray（如果您想稍后使用相同的数组替换不同的颜色）

常规方法

Objective-C

NSMutableArray *colorArray = [NSMutableArray alloc] initWithArray:[NSArray arrayOfColorsWithColorScheme:(ColorScheme)colorScheme 
                                                                                                    with:(UIColor *)color 
                                                                                             flatScheme:(BOOL)isFlatScheme]];

Swift

var colorArray = NSArray(ofColorsWithColorScheme:ColorScheme, with:UIColor!, flatScheme:Bool)

Chameleon 简写

Objective-C

NSMutableArray *colorArray = [[NSMutableArray alloc] initWithArray:ColorScheme(colorSchemeType, color, isFlatScheme)];

Swift

var colorArray = ColorSchemeOf(colorSchemeType, color, isFlatScheme)

示例

假设您想为Flat Red的浅色调生成一个类似色色彩方案，请执行以下方法调用

常规方法

Objective-C

NSMutableArray *colorArray = [NSMutableArray alloc] initWithArray:[NSArray arrayOfColorsWithColorScheme:ColorSchemeAnalogous
                                                                                                    with:[UIColor flatRedColor] 
                                                                                             flatScheme:YES]];

Swift

var colorArray = NSArray(ofColorsWithColorScheme:ColorScheme.Analogous, with:UIColor.flatRedColor(), flatScheme:true)

Chameleon 简写

Objective-C

NSMutableArray *colorArray = [[NSMutableArray alloc] initWithArray:ColorScheme(ColorSchemeAnalogous, FlatRed, YES)];

Swift

var colorArray = ColorSchemeOf(ColorScheme.Analogous, FlatRed(), true)

然后您可以通过与从数组中检索任何对象相同的方式检索每个单个颜色

Objective-C

UIColor *firstColor = colorArray[0];

Swift

var firstColor = colorArray[0] as! UIColor

主题方法

使用 Chameleon，您现在只需一行代码即可指定一个全局色彩主题（它还会处理状态栏风格的问题）！以下是三种启动方法之一。代码 ContentStyle 允许您决定文本和少数其他元素应该是白色、黑色还是与 UI 元素的 backgroundColor 具有更高的对比度。

您可以在您的应用程序代理中设置全局主题

常规方法

Objective-C

[Chameleon setGlobalThemeUsingPrimaryColor:(UIColor *)color withContentStyle:(UIContentStyle)contentStyle];

但是，如果您想为特定的 UIViewController 使用不同的主题，没问题，Chameleon 允许您通过以下操作在任何 UIViewController 和 UINavigationController 中覆盖全局主题

常规方法

Objective-C

//This would go in the controller you specifically want to theme differently
[self setThemeUsingPrimaryColor:FlatMint withSecondaryColor:FlatBlue andContentStyle:UIContentStyleContrast];

注意：为了使用主题自动设置状态栏样式，您需要确保在Info.plist中设置基于视图控制器的状态栏外观键为NO。

导航栏细线

从2.0.3版本开始，导航栏细线视图默认不再隐藏。但是，如果您想要实现真正的扁平化外观（如上图中所示），您可以通过以下方式隐藏导航栏底部的细线：

Objective-C

[self.navigationController setHidesNavigationBarHairline:YES];

//or

self.navigationController.hidesNavigationBarHairline = YES;

👑作者

Chameleon是Vicc Alexander（@ViccsMind）在2014年开发的。目前，它由@ViccAlexander和@Bre7维护。

支持☕️

如果您喜欢Chameleon并希望为我们买杯咖啡，我们会非常感激。

📝待办事项清单

• Cocoapods支持
  
• 目录
  
• Storyboard颜色选择器附加组件
  
• Xcode内文档
  
• 从RGB值切换到HSB和LAB
  
• 渐变色
  
• 更新GradientStyle & ShadeStyle语法
  
• 添加径向渐变支持
  
• 修复与 initWithArray:for:flatScheme: 方法的 Swift 冲突
  
  
• Swift 支持
  
  
• 从图片获取配色方案
  
  
• UIAppearance 便捷方法
  
  
• 添加隐藏 NavigationBar 线的选项

• 允许渐变颜色适应框架更改

📄变更日志

查看 Changelog.md👀