質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.50%

  • Swift

    8758questions

    Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

CAGradientLayerでグラデーションを実装する際のCALayerの扱いについて

解決済

回答 2

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 1,690
退会済みユーザー

退会済みユーザー

CAGradientLayerメソッドを使ってグラデーションを実装しようとこころみましたが、
レイヤーより下の階層のパーツに対してもグラデーションの影響が出てしまいました。
イメージ説明
白いテキストにグラデーションとして設定した緑がうっすらかかっています。

実施した方法

イメージ説明
基本構造はViewControllerの中にtableViewを配置、
Dynamic Prototypesを使ってCellを生成しています。

この時self.viewにはベースとなるカラー(透過なし)を設定し。
その下の階層にあるtableViewにグラーデーションレイヤーを適用しています。
イメージ説明

グラーデーションの設定値はこちら

startColor = UIColor(red: 30/255, green: 255/255, blue: 0/255, alpha: 0.15).cgColor
endColor = UIColor(red: 0/255, green: 0/255, blue: 0/255, alpha: 0.25).cgColor

階層
イメージ説明
薄い水色---Layer
グリーン ---TableView

最初はtableViewCellのViewパーツより手前側にレイヤーが配置されているからTableViewCellがレイヤーの影響を受けていると考えていたので
tableViewCellでなければコードでパーツを作成してレイヤーをaddした後に
さらにその上にラベルをaddしようと考えていたのですが、
階層をみると階層は関係ないようです。

ここまで調べた所で解決先が思いつかなくなりご相談させていただきました。

どうかよろしくお願いします。


おかげさまで解決しました!!!

解決したのですが、その挙動に疑問が残るので共有しておきます。

1)self.viewに対し、階層の0番目にレイヤーを追加
self.view.layer.insertSublayer(layer, at: 0)
イメージ説明

結果
イメージ説明
tableViewより後ろにレイヤーが存在するため、
tableViewに設定した色のみが前面に表示

2)self.viewに対し、階層の1番目にレイヤーを追加
上記とまったく同じ結果

3)self.viewに対し、階層の2番目にレイヤーを追加
イメージ説明
レイヤーの階層における位置は同じ場所にあるように見えるが
結果
イメージ説明
tableViewよりも手前にレイヤーがあるようす。

4)tableViewに対し、階層の0番目にレイヤーを追加
イメージ説明
先ほどまで存在した黄緑色のviewがなくなりtableView自体の色が変わっている。

結果
イメージ説明
ラベルに影響なく、tableViewにのみグラデーションをかけた状態に。

今回わかったこと
・そもそもXcodeのview hierarchyで見られるviewにレイヤーはうつっていない。

・viewを選択するとCALayerクラスのviewが存在するが、
この時レイヤーはこのUIViewに対して配置されている。

イメージ説明

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • _Kentarou

    2017/01/01 12:12

    最終的に作りたいものがわからないので質問です、テーブル自体にグラデーションがかかっているものか、テーブルセルごとにグラデーションがかかっているものかどちらでしょうか?

    キャンセル

  • 退会済みユーザー

    退会済みユーザー

    2017/01/01 17:07

    テーブル自体にグラデーションをかけたいです!

    キャンセル

回答 2

checkベストアンサー

0

追記します。insertSublayerでView階層も調節できます。この場合は、一番下に配置されます。
self.view.layer.insertSublayer(gradientLayer, atIndex: 0)

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2017/01/01 17:17

    おけましておめでとうございます^^

    おかげさまで上記を使って解決できました!
    tableViewに対してレイヤーをat:0にインサートすると想定通りの結果ができました!

    これについてちょっと書きます

    キャンセル

0

明けましておめでとうございます。CAGradientLayerは他のパーツにも影響が、かかってしまうようです。
提示していただいたViewの階層を見ると、全体にLayerのViewがあるので、Layerのframeを調整すれば良いのでは?と思いました。実施したいことは、他のパーツに影響なくframe管理することと思いましたので,そのようなアプリを即席で作ってみました。参考にどうぞ。
gradientLayer = CAGradientLayer()
gradientLayer.frame =   CGRect(x:50,y:UIScreen.main.bounds.height/2,width:UIScreen.main.bounds.width/1.5,height:UIScreen.main.bounds.height/4)
self.view.layer.addSublayer(gradientLayer)
![イメージ説明説明](77d8244ed5c5a1d8f8c2fd547207e07b.png)説明](8331e410a1ec2e2880a07926000ca81d.png)](5fed796446e7a77c7573c0db9171932a.png)

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

同じタグがついた質問を見る

  • Swift

    8758questions

    Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています