ios - テキストの UITextView 下の影

Question

たぶん、解決策を知っているかもしれません.textViewに影を追加する方法は次のとおりです。

だから私はバックグラウンドでビューを見ることができる透明なtextViewが必要です

Answer 1

アップルはCAReplicatorLayer、レイヤーの自動ミラーリングを行うために使用できるものを提供しています（とりわけ）。これはビデオ レイヤーでも機能し、非常に効率的です (GPU で直接描画を実行します)。

CAReplicatorLayer クラスは、指定された数のサブレイヤー (ソース レイヤー) のコピーを作成します。各コピーには、幾何学的、時間的、および色の変換が適用される可能性があります。

これを使用する方法について簡単に説明している WWDC ビデオ ( Core Animation Essentialsの 51:00 あたり) と、 ReplicatorDemoと呼ばれる OSX デモ プロジェクトがあります。

コード/テクニックの品質を確認していませんが、簡単に検索すると、レイヤーを反映する例を示すブログ投稿が見つかります。

Answer 2

以下の方法を組み合わせることができると思います（テストされていません！）：

NSString 描画機能を使用してテキストから UIImage を作成するにはどうすればよいですか

UIImage * textImage = [self imageFromText:text];

//You may play with the scale value
UIImage *textImageMirrored = [UIImage imageWithCGImage:[textImage CGImage] scale:1.0 orientation:UIImageOrientationDownMirrored]; 

And then use this mirrored image in the correct position.
UIImageView *textShadow = [[UIImageView alloc] initWithImage:textImageMirrored];
textShadow.opacity = 0.6; //or so

Answer 3

私は最善の解決策を見つけます。マスクレイヤーとCAGradientLayerを使用しています。したがって、UITextView に使用すると、レイヤーは動的になります。UIView を作成し、この UIView に UITextView を追加し、UIView のレイヤーを使用します

//this float need for creating second sublayer, for scrollIndicator
CGFloat layerWidth = 8.f;
CAGradientLayer *gl1 = [CAGradientLayer layer];
id col1 = (id)[[UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:1.0]CGColor];
id col2 = (id)[[UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.0]CGColor];
gl1.colors = @[col2, col1, col1, col2];
gl1.locations = @[@0.0, @0.0, @0.85, @1.0];
//underTextView - this is my UIView
gl1.frame = CGRectMake(0, 0, self.underTextView.width - layerWidth, self.underTextView.height);
//layer for scrollIndicator - it must be visible always good
CAGradientLayer *gl2 = [CAGradientLayer layer];
gl2.colors = @[col1, col1];
gl2.locations = @[@0.0, @1.0];
gl2.frame = CGRectMake(self.underTextView.width - layerWidth, 0, layerWidth, self.underTextView.height);
//create main layer
CAGradientLayer *gl = [CAGradientLayer layer];
[gl addSublayer:gl1];
[gl addSublayer:gl2];
//add to mask of UIView
self.underTextView.layer.mask = gl;

それで、- (void)scrollViewDidScroll:(UIScrollView *)scrollView上と下のグラデーションの方法で CAGradientLayer の色の位置を変更します。したがって、textView を開くと、上に適切なテキストが表示され、下に透明なテキストが表示されます。スクロールすると、上と下が透明になり、下にスクロールすると、上が透明で下が不透明になります。

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
CGFloat layerWidth = 8.f;
CAGradientLayer *gl1 = [CAGradientLayer layer];
id col1 = (id)[[UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:1.0]CGColor];
id col2 = (id)[[UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.0]CGColor];
gl1.colors = @[col2, col1, col1, col2];
if (self.mainTextView.contentOffset.y < 5)
    gl1.locations = @[@0.0, @0.0, @0.85, @1.0];
if (self.mainTextView.contentOffset.y >=5 && self.mainTextView.contentOffset.y < 20) {
    CGFloat number = (self.mainTextView.contentOffset.y - 5) * 0.01;
    gl1.locations = @[@0.0, [NSNumber numberWithFloat:number], @0.85, @1.0];
}
if (self.mainTextView.contentOffset.y >= 20  && self.mainTextView.contentOffset.y < self.mainTextView.contentSize.height - self.mainTextView.height - 20)
    gl1.locations = @[@0.0, @0.15, @0.85, @1.0];
if (self.mainTextView.contentOffset.y >= (self.mainTextView.contentSize.height - self.mainTextView.height - 20) && self.mainTextView.contentOffset.y < (self.mainTextView.contentSize.height - self.mainTextView.height - 5)) {
    CGFloat number = 1 - (self.mainTextView.contentSize.height - self.mainTextView.contentOffset.y - self.mainTextView.height - 5) * 0.01;
    gl1.locations = @[@0.0, @0.15, [NSNumber numberWithFloat:number], @1.0];
}
if (self.mainTextView.contentOffset.y >= self.mainTextView.contentSize.height - self.mainTextView.height - 5)
    gl1.locations = @[@0.0, @0.15, @1.0, @1.0];
gl1.frame = CGRectMake(0, 0, self.underTextView.width - layerWidth, self.underTextView.height);
CAGradientLayer *gl2 = [CAGradientLayer layer];
gl2.colors = @[col1, col1];
gl2.locations = @[@0.0, @1.0];
gl2.frame = CGRectMake(self.underTextView.width - layerWidth, 0, layerWidth, self.underTextView.height);
CAGradientLayer *gl = [CAGradientLayer layer];
[gl addSublayer:gl1];
[gl addSublayer:gl2];
self.underTextView.layer.mask = gl;
}

Answer 4

私は過去に白い背景でこれを行ったことがあります。最初は完全に不透明で、フェードアウトしてクリアになるグラデーションを使用して白い画像を作成しました。これをテーブルビューの下端の上に重ねました。これにより、テーブル ビューが下端で白くフェードアウトするように見えました。

テーブルのスクロールコンテンツの一番下に到達したときに画像を下にスライドさせて、最後のビットがフェードしないようにすることで、「下」の問題を解決しました。

背景が複雑で、動きがあり、変化に富んでいる場合、これは最適な選択肢ではないかもしれませんが、単純な背景の場合はうまく機能します。