2017-09-27 2 views
15

iOSプロジェクトにドロップシャドウを持つカスタムUIViewを作成しました。 私の目的は、ビューの背景と同じ勾配を影に適用することです。UIViewシャドーグラデーション

以下は、現在の単色の影がどのように見えるかの例です。

Shadow Example これは、以下のコードでのUIViewのサブクラスを介して行われます:私は2番目の勾配層を作成し、影にそれをマスキングで遊んでてきたが、運がなかったしている

override func layoutSubviews() { 
    let gradientLayer = layer as! CAGradientLayer 
    gradientLayer.colors = [topColor.cgColor, bottomColor.cgColor] 
    gradientLayer.startPoint = CGPoint(x: startPointX, y: startPointY) 
    gradientLayer.endPoint = CGPoint(x: endPointX, y: endPointY) 
    layer.cornerRadius = cornerRadius 
    layer.shadowColor = shadowColor.cgColor 
    layer.shadowOffset = CGSize(width: shadowX, height: shadowY) 
    layer.shadowRadius = shadowBlur 
    layer.shadowOpacity = 1 

    let inset: CGFloat = bounds.width * 0.05 
    layer.shadowPath = UIBezierPath(roundedRect: bounds.insetBy(dx: inset, dy: 0.0), cornerRadius: cornerRadius).cgPath 
} 

。正しい方向に私を指差してください!

答えて

4

標準的なCALayerのシャドウでは、それ以上のことはできないと思います。 フィルタのCALayerのプロパティを見てください。

https://developer.apple.com/documentation/quartzcore/calayer/1410901-filters

CAGradientLayerを作成し、例えばGausianBlurフィルタを適用します。

https://developer.apple.com/library/content/documentation/GraphicsImaging/Reference/CoreImageFilterReference/index.html#//apple_ref/doc/filter/ci/CIGaussianBlur

標準層の影を無効にし、下層としてのぼやけ層を追加します。

0

私は@jacekは、あなたが作成することです説明ヤツェクとして行うために(正直に言うとあまりないです)

最高のものを使用すると、CALayer影で何ができるかの限界をプッシュしている権利であると信じてあなた自身の影ですが、もう一つのCAGradientLayerは影として働くガウスぼかしを適用します。

また、あなたのコードをlayoutSubviewsの中に配置するのが最も適切な場所だとは思わない。設定したレイヤーはあまり変更する必要がないため、レイアウトが大きく変わると多くのレイヤーが呼び出されます。

通常、interface-builderからのビューを使用している場合は、このロジックをawakeFromNibという専用のconfigureBackgroundViews関数の中から呼び出します。ちょうどあなたのプロジェクトにBlurEffect.swiftファイルをドラッグアンドドロップ:

0

は私のgitRepoで利用できるあなたの条件https://github.com/Krishnarjun-Banoth/BlurView/tree/master/Shadows

ステップ1のための私のコードを使用してください。

ステップ2:次に、以下の方法を使用します。それぞれのビューに対して個別にビュー拡張メソッドを使用します。

testView.applyGradient(colours: [UIColor.blue,UIColor.orange]) //pass your required colours. 
    testView.blur(blurRadius: 5.0) 

注:@JacekGłazikの回答とFlexMonkeyのチュートリアルに触発されています。