用CALayer.Mask(遮罩)实现iphone图标的水晶立体效果

2024-06-13 03:08

本文主要是介绍用CALayer.Mask(遮罩)实现iphone图标的水晶立体效果,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

昨天打群雄一下打了两个“破敌”,比较空虚,然后想起周末觉得自己应用中的图案都是纯用Path画的平面效果,比较土,就研究了一下如何实现点时尚的效果。

最终完成效果如下:

而原图效果只是这样:

 

通过遮罩完成以上效果,代码非常简单,不过需要准备遮罩层要用的alpha通道图片,对于非常非常不美工的我来说,用d版的fireworks搞掂:

 

但是你并不能直接把这个遮罩蒙在你的图片上,这样的话,图片会变暗,而且效果是跟你期望的相反的,正确的做法是在图片上蒙一个某种色的层,然后给这个层应用这个遮罩,这样最终效果就是我们期望的。

不过这里我们还需要一个简单的遮罩,应用在整个图上,把它修正成圆角(因为原图是四方的):

这个遮罩很简单,圆角alpha通道全透明,把原图的四角给全透掉(遮罩原理就是在原图像素的alpha改成遮罩的alpha)。

好了,整个代码如下:

 

复制代码
-  ( void )viewDidLoad {
    [super viewDidLoad];
    UIGraphicsBeginImageContext(icon.bounds.size);
    CGContextRef ctx 
=  UIGraphicsGetCurrentContext();
    
const  CGFloat components[ 4 =  { 0.0 , 0.4 , 0.0 , 1.0 };
    CGContextSetFillColor(ctx, components);
    CGContextFillRect(ctx, CGRectMake(
0 0 , icon.bounds.size.width, icon.bounds.size.height));
    UIImage 
* background  =  UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    
    UIImage 
* image  =  [UIImage imageNamed: @" icon.png " ];
    UIImage 
* mask  =  [UIImage imageNamed: @" IconBase.png " ];
    UIImage 
* roundCorner  =  [UIImage imageNamed: @" round-corner.png " ];
    icon.image 
=  image;
    
    CALayer
*  subLayer  =  [[CALayer layer] retain];
    subLayer.frame 
=  icon.bounds;
    subLayer.contents 
=  ( id )[background CGImage];

    CALayer
*  maskLayer  =  [[CALayer layer] retain];
    maskLayer.frame 
=  icon.bounds;
    maskLayer.contents 
=  ( id )[mask CGImage]; 
    [subLayer setMask:maskLayer];
    [[icon layer] addSublayer:subLayer];
    
    CALayer
*  roundCornerLayer  =  [[CALayer layer] retain];
    roundCornerLayer.frame 
=  icon.bounds;
    roundCornerLayer.contents 
=  ( id )[roundCorner CGImage];
    [[icon layer] setMask:roundCornerLayer];
    
    [maskLayer release];
    [subLayer release];
    [roundCornerLayer release];


}
复制代码

 

DEMO程序下载 

这篇关于用CALayer.Mask(遮罩)实现iphone图标的水晶立体效果的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1056107

相关文章

C++中零拷贝的多种实现方式

《C++中零拷贝的多种实现方式》本文主要介绍了C++中零拷贝的实现示例,旨在在减少数据在内存中的不必要复制,从而提高程序性能、降低内存使用并减少CPU消耗,零拷贝技术通过多种方式实现,下面就来了解一下... 目录一、C++中零拷贝技术的核心概念二、std::string_view 简介三、std::stri

C++高效内存池实现减少动态分配开销的解决方案

《C++高效内存池实现减少动态分配开销的解决方案》C++动态内存分配存在系统调用开销、碎片化和锁竞争等性能问题,内存池通过预分配、分块管理和缓存复用解决这些问题,下面就来了解一下... 目录一、C++内存分配的性能挑战二、内存池技术的核心原理三、主流内存池实现:TCMalloc与Jemalloc1. TCM

OpenCV实现实时颜色检测的示例

《OpenCV实现实时颜色检测的示例》本文主要介绍了OpenCV实现实时颜色检测的示例,通过HSV色彩空间转换和色调范围判断实现红黄绿蓝颜色检测,包含视频捕捉、区域标记、颜色分析等功能,具有一定的参考... 目录一、引言二、系统概述三、代码解析1. 导入库2. 颜色识别函数3. 主程序循环四、HSV色彩空间

苹果macOS 26 Tahoe主题功能大升级:可定制图标/高亮文本/文件夹颜色

《苹果macOS26Tahoe主题功能大升级:可定制图标/高亮文本/文件夹颜色》在整体系统设计方面,macOS26采用了全新的玻璃质感视觉风格,应用于Dock栏、应用图标以及桌面小部件等多个界面... 科技媒体 MACRumors 昨日(6 月 13 日)发布博文,报道称在 macOS 26 Tahoe 中

Python实现精准提取 PDF中的文本,表格与图片

《Python实现精准提取PDF中的文本,表格与图片》在实际的系统开发中,处理PDF文件不仅限于读取整页文本,还有提取文档中的表格数据,图片或特定区域的内容,下面我们来看看如何使用Python实... 目录安装 python 库提取 PDF 文本内容:获取整页文本与指定区域内容获取页面上的所有文本内容获取

基于Python实现一个Windows Tree命令工具

《基于Python实现一个WindowsTree命令工具》今天想要在Windows平台的CMD命令终端窗口中使用像Linux下的tree命令,打印一下目录结构层级树,然而还真有tree命令,但是发现... 目录引言实现代码使用说明可用选项示例用法功能特点添加到环境变量方法一:创建批处理文件并添加到PATH1

Java使用HttpClient实现图片下载与本地保存功能

《Java使用HttpClient实现图片下载与本地保存功能》在当今数字化时代,网络资源的获取与处理已成为软件开发中的常见需求,其中,图片作为网络上最常见的资源之一,其下载与保存功能在许多应用场景中都... 目录引言一、Apache HttpClient简介二、技术栈与环境准备三、实现图片下载与保存功能1.

canal实现mysql数据同步的详细过程

《canal实现mysql数据同步的详细过程》:本文主要介绍canal实现mysql数据同步的详细过程,本文通过实例图文相结合给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的... 目录1、canal下载2、mysql同步用户创建和授权3、canal admin安装和启动4、canal

Nexus安装和启动的实现教程

《Nexus安装和启动的实现教程》:本文主要介绍Nexus安装和启动的实现教程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录一、Nexus下载二、Nexus安装和启动三、关闭Nexus总结一、Nexus下载官方下载链接:DownloadWindows系统根

SpringBoot集成LiteFlow实现轻量级工作流引擎的详细过程

《SpringBoot集成LiteFlow实现轻量级工作流引擎的详细过程》LiteFlow是一款专注于逻辑驱动流程编排的轻量级框架,它以组件化方式快速构建和执行业务流程,有效解耦复杂业务逻辑,下面给大... 目录一、基础概念1.1 组件(Component)1.2 规则(Rule)1.3 上下文(Conte