关于 ios 渐变的一些疑问

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

iOS 开发实用技术导航

NSHipster 中文版

› http://nshipster.cn/

cocos2d 开源 2D 游戏引擎

› http://www.cocos2d-iphone.org/

CocoaPods

› http://cocoapods.org/

Google Analytics for Mobile 统计解决方案

› http://code.google.com/mobile/analytics/

WWDC

› https://developer.apple.com/wwdc/

Design Guides and Resources

› https://developer.apple.com/design/

Transcripts of WWDC sessions

› http://asciiwwdc.com

Cocoa with Love

› http://cocoawithlove.com/

Cocoa Dev Central

› http://cocoadevcentral.com/

NSHipster

› http://nshipster.com/

Style Guides

› Google Objective-C Style Guide

› NYTimes Objective-C Style Guide

Useful Tools and Services

› Charles Web Debugging Proxy

› Smore

这是一个创建于 3548 天前的主题，其中的信息可能已经有所发展或是发生改变。

看到qq音乐和网易云音乐的歌词显示的时候，顶部的歌词和底部的歌词都有一个渐变的效果，我想问下他们是怎么实现的
图片

渐变

歌词

顶部

12 条回复 • 2015-04-14 11:27:56 +08:00

Galvin

2015-04-12 19:21:26 +08:00

求各路大神解答啊T_T

thuai

2015-04-12 20:10:06 +08:00

最简单的做法，顶部和底部都用个半透的mask，不可以做到么？

Madimo

2015-04-12 23:34:06 +08:00 via iPhone

实现起来很简单，主要是用 CALayer 的 mask 属性以及 CAGradientLayer，手机码字不方便具体 Google 吧

Galvin

2015-04-13 02:55:35 +08:00

@thuai @Madimo 但是不透名的那一边呢？CAGradienLayer不是只能给颜色的数组吗？

Galvin

2015-04-13 02:56:52 +08:00

@Madimo @thuai 噢～我知道了。。。误入歧途

wezzard

2015-04-13 09:49:40 +08:00

CALayer 都不用，現在 UIView 有了 maskView 這個 property 之後可以直接才 UIKit 這一層完成。

krafttuc

2015-04-13 13:47:05 +08:00

UIVisualEffectView

Galvin

2015-04-13 22:47:28 +08:00

@krafttuc UIVisualEffectView是ios8才支持的吧？

Galvin

2015-04-13 22:48:44 +08:00

@wezzard 能具体说说怎么实现吗？～目前我的做法是截上下两个部分的图，然后加CAGradientLayer,然后设置mask

wezzard

2015-04-14 10:18:26 +08:00

@Galvin 我沒具體實現過，因爲我發現以我接觸的需求但凡碰到要漸變的，就要進入 CoreAnimation 這個 tech stack了，我看了下 API，你準備一張上下有不透明漸變，中間是透明的PNG圖片然後 init 一個 UIImageView 出來再設置 maskView 應該就可以了。另外這個也是 iOS 8 特性。 UIVisualEffectView 是背後的 blurring 特效，網易的這個特效很可能是他們自己寫的，因爲要兼容 iOS 7。

kobe1941

2015-04-14 10:51:28 +08:00

跑个题啊，这个歌词显示目测都是用tableView直接一行歌词一个tableviewcell就实现啦？

Galvin

2015-04-14 11:27:56 +08:00

@kobe1941 我觉得是～