iOS 6+ に付属する新しいアプリ ストア アプリの共有サブ ビューにあるようなビューを作成してアニメーション化する方法は知っていますが (添付のスクリーンショットを参照)、透明な色の効果を追加する方法がわかりません。このビューで。UIView
スクリーンショットとまったく同じ外観にするためのコードサンプルを誰でも提供できますか?
PS alpha
UIView のプロパティだけでは、そのようなことはできません。
iOS 6+ に付属する新しいアプリ ストア アプリの共有サブ ビューにあるようなビューを作成してアニメーション化する方法は知っていますが (添付のスクリーンショットを参照)、透明な色の効果を追加する方法がわかりません。このビューで。UIView
スクリーンショットとまったく同じ外観にするためのコードサンプルを誰でも提供できますか?
PS alpha
UIView のプロパティだけでは、そのようなことはできません。
このメソッドをUIViewカテゴリに追加し、必要に応じて再利用できます。これは、「theColor」から特定のビューの透明までの線形の黒のグラデーションを適用します。
CAGradientLayerオブジェクトを使用するには、プロジェクトにQuartzCore.frameworkが必要です。
+ (void)addLinearGradientToView:(UIView *)theView withColor:(UIColor *)theColor transparentToOpaque:(BOOL)transparentToOpaque
{
CAGradientLayer *gradient = [CAGradientLayer layer];
//the gradient layer must be positioned at the origin of the view
CGRect gradientFrame = theView.frame;
gradientFrame.origin.x = 0;
gradientFrame.origin.y = 0;
gradient.frame = gradientFrame;
//build the colors array for the gradient
NSArray *colors = [NSArray arrayWithObjects:
(id)[theColor CGColor],
(id)[[theColor colorWithAlphaComponent:0.9f] CGColor],
(id)[[theColor colorWithAlphaComponent:0.6f] CGColor],
(id)[[theColor colorWithAlphaComponent:0.4f] CGColor],
(id)[[theColor colorWithAlphaComponent:0.3f] CGColor],
(id)[[theColor colorWithAlphaComponent:0.1f] CGColor],
(id)[[UIColor clearColor] CGColor],
nil];
//reverse the color array if needed
if(transparentToOpaque)
{
colors = [[colors reverseObjectEnumerator] allObjects];
}
//apply the colors and the gradient to the view
gradient.colors = colors;
[theView.layer insertSublayer:gradient atIndex:0];
}
グラデーションに干渉しないように、ViewのbackgroundColorをclearColorに設定する必要があることに注意してください。また、スクリーンショットに示されている結果の場合、transparentToOpaqueフラグはYESである必要があります。
これは、誰かが必要な場合にSwiftに翻訳されたPedroSilvaのソリューションです(垂直オプションも追加されています)
class func addLinearGradientToView(view: UIView, colour: UIColor, transparntToOpaque: Bool, vertical: Bool)
{
let gradient = CAGradientLayer()
let gradientFrame = CGRectMake(0, 0, view.frame.size.width, view.frame.size.height)
gradient.frame = gradientFrame
var colours = [
colour.CGColor,
colour.colorWithAlphaComponent(0.9).CGColor,
colour.colorWithAlphaComponent(0.8).CGColor,
colour.colorWithAlphaComponent(0.7).CGColor,
colour.colorWithAlphaComponent(0.6).CGColor,
colour.colorWithAlphaComponent(0.5).CGColor,
colour.colorWithAlphaComponent(0.4).CGColor,
colour.colorWithAlphaComponent(0.3).CGColor,
colour.colorWithAlphaComponent(0.2).CGColor,
colour.colorWithAlphaComponent(0.1).CGColor,
UIColor.clearColor().CGColor
]
if transparntToOpaque == true
{
colours = colours.reverse()
}
if vertical == true
{
gradient.startPoint = CGPointMake(0, 0.5)
gradient.endPoint = CGPointMake(1, 0.5)
}
gradient.colors = colours
view.layer.insertSublayer(gradient, atIndex: 0)
}
CAGradientLayer *layer = [CAGradientLayer layer];
layer.frame = yourView.bounds;
UIColor *blackColor = [UIColor colorWithWhite:0.42f alpha:1.0f];
UIColor *clearColor = [UIColor colorWithWhite:0.42f alpha:0.0f];
layer.colors = [NSArray arrayWithObjects:(id)clearColor.CGColor, (id)blackColor.CGColor, nil];
[myView.layer insertSublayer:layer atIndex:0];
layer
ビューのレイヤーはどこにありますか。
半透明のpngを背景として使用するだけで、このような効果を得ることができます。UIViewをに設定していることを確認してくださいopaque
。NO
そうすれば問題ありません。
この効果を達成するために必要な魔法はありません。Apple が行っているように行う必要があります。小さく引き伸ばされた画像を含む UIImageViews。
このビュー (アイコンを含む下半分の正方形) は、引き伸ばされてこの効果を生み出す画像を使用します。
あなたもこの方法に従うべきです。ビューは非常に明るく、Photoshop でいくつかのテストを行うだけで正しい効果が得られます。
お気づきのように、Apple は iPhone でグラデーション レイヤーを使用することはありません。多くの画像を保存していたので、かなり多くの GPU を消費する必要があります...
テスト用の同様の画像を次に示します。
それが役に立てば幸い。
ビューの背景色のアルファ値を目的の値に設定するだけです。
添付の郵便番号を参照してください。AlphaViewController の nib ファイルに移動し、そこで確認します
サブビューのアルファ値を 70% に設定しただけです。あなたの要件に応じてそれを行うことができます。