読者です 読者をやめる 読者になる 読者になる

日本語教師、プログラマーになる。

韓国に嫁いで日本語を教えていましたが、なんやかんやでiOSアプリ作ってます。

Swiftで写真にいい感じのグラデーションをつける

残った仕事を片付けつつ、たまにはMarkdown記法も使わないと忘れそうなのでメモしとく。

このご時世にグラデーションなんているか〜!?と思いつつも、 やっぱり必要な部分はあるみたいで…。 ほら…Android版との兼ね合いとか色々さ…。

特に、背景写真+白いラベルをつけたい場合。 写真が白っぽかったりすると、文字が見えない!汗

f:id:lavandin:20160530150946p:plain

(全然わかんないけど、本当は白いラベルがある。)

そんな時、ラベルの後ろにうっすら黒っぽいグラデかけておくと、映えて見えるんですよね。

まず、Storyboardでグラデーションさせたい部分に「gradientView」とでも名付けておきます。 冒涜的なネーミングセンスはつっこまないで下さい…。

//まずはグラデーションレイヤーをつくります
let gradientLayer = CAGradientLayer();

//上は透明、下は黒。
let colorTop = UIColor.clearColor();
let blackColor = UIColor.blackColor();

//まっくろくろから始まるとヘンなので、黒にちょびっとアルファをプラスしてあげます。
//ま適当に0.7くらいかな。
let colorBottom = blackColor.colorWithAlphaComponent(0.7);

//そしたら、この二つを最初につくったレイヤーの色にセット。
gradientLayer.colors = [colorTop.CGColor, colorBottom.CGColor];

//フレームをきっちりセットしてあげないと、どこから始まるのかわかんないみたい。
gradientLayer.frame = gradientView.bounds;

//addSublayerでもいいのかな?
gradientView.layer.insertSublayer(gradientLayer, atIndex: 0);

こんな感じで、実行するといい感じにモワァ〜っと影っぽくなります!

f:id:lavandin:20160530150931p:plain

あっ…。今見たら、そんな言うほどいい感じじゃねぇッ…!!

まぁ、なんか、アルファ値とか幅とか適当にいじくったらいいと思うよ(適当) これがこういうイラストではなくて、JPGイメージとかだったら、結構いい感じなんすよ!(半泣き)

黒にアルファ値を設定してあげとくのがミソです。 最初、ズルして黒じゃなくてグレーにしたら、なんだか白く濁ってきちゃない色になっちゃいました。

透明〜透過黒のグラデーションにしてあげるのが正解でした!