How can I ‘shine’ a png on the iPhone in code?

匿名 (未验证) 提交于 2019-12-03 10:03:01

问题:

How do I replicate the effect that the app launcher uses on a square .png to show my users what their icon will look like as an app badge.

NB - I want to do this in code on the iPhone, not in photoshop on my computer.

Thanks!

edit: trying to be really clear here. How do I do this with code! I have tried creating an overlay, but the shine apple does actually brightens the top, so just putting a png over the top will not give the same effect.

Presumably the app launcher applies some CA effects - does anyone know how to duplicate them???

回答1:

Create a transparent shine overlay in Photoshop on your computer and merge the two images in code.

Short of hard-coding the shine mask, or building a mini ray-tracer, that's probably the easiest way to do it.

There's even a link to a photoshop tutorial/template here:

http://www.keepthewebweird.com/iphone-icon-psd-template/



回答2:

Another more simple approach is to save your icon as a 57px x 57px PNG called "icon.png" without any shine effects, then FTP it to the root folder of a web server and create a file there called icon_test.html containing the following code:

<html>     <head>         <link rel="apple-touch-icon" href="/icon.png"/>          <title>The App Name</title>     </head>     <body>          iPhone test page     </body> </html>

Then just browse to the icon_test.html file in mobile Safari on your iPhone, tap the "+" button in the toolbar to save the page as a bookmark, tap "Add to Home Screen", and tap "Add" in the top right. You'll then see your icon appear on the home screen, complete with Apple's shine overlay.



标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!