13

私は最近、UITableViewCells を使用したスクロール パフォーマンスの改善に関する素晴らしい記事を見つけました。記事の中で、特に私が興味をそそられたものがあります。

Twitter for iPhone 4.0 のツイートには、微妙なテクスチャ背景の上にドロップ シャドウが表示されます。ブレンドには費用がかかるため、これは課題でした。セルのコンテンツ領域からシャドウ領域を分割することで、Core Animation が不透明でないと見なす領域を減らすことで、これを解決しました。

iOS シミュレーターを使用して、[デバッグ] - [カラー ブレンド レイヤー] をクリックすると、次のように表示されます。

TwitterTableViewCell

赤でマークされた領域はブレンドされ、緑の領域は不透明です。偉大な。この記事で言及されていないのは、次のことです。これを実装するにはどうすればよいですか? UIView が不透明であるかどうかは、私の理解です。これを達成する唯一の方法はサブビューを使用することだと私には思えますが、記事では単純な実装であると明示的に述べています:

代わりに、Tweet セルにはサブビューのない単一のビューが含まれています。単一の drawRect: すべてを描画します。

では、不透明なものと、単一の drawRect: メソッドにないものをどのように切り離すのですか?

4

3 に答える 3

3

あなたが示している例では、ビューを通して背景を表示しているとは思いません。コア グラフィックスの背景をシミュレートしていると思います。つまり、各セルで、背景に明るい灰色を描画します。次に、(透明度を使用して) 影を描画し、最後に残りの不透明なコンテンツを上部に描画します。私は間違っているかもしれませんが、ビューの一部を透明にできるとは思えません。もしそうなら、私は常にコアグラフィックスを使用しているので、非常に興味がありますが、ビュー全体をブレンドする価値がないように見えるため、角を丸くすることは避けています.

アップデート

さらに調査を行い、Apple のドキュメントを調べた結果、ビューの一部だけが不透明になる可能性はないと思います。また、Twitter のブログ投稿を読んだ後、彼らがそうしたと言っているとは思えません。彼らが言うとき、注意してください：

代わりに、Tweet セルにはサブビューのない単一のビューが含まれています。単一の drawRect: すべてを描画します。

彼らは具体的に と について話していUILabelましUIImageViewた。つまり、これらのビューを使用する代わりに、Core Graphics を使用して画像を直接描画しています。UILabels については、個人的には Core Text を使用しています。これは、より多くのフォントをサポートしているためですが、NSString のdrawAtPoint:withFont:メソッドのような単純なものを使用している可能性もあります。しかし、彼らが伝えようとしている主なポイントは、セルの内容がすべて 1 つの CG 図面であるということです。

次に、新しいセクションに移動します:混合を避ける. ここで彼らは、ブレンドを避けることを強調しています。

セルのコンテンツ領域から影の領域を分割します。

これを行う唯一の方法は、異なるビューを使用することです。使用できるアプローチは 2 つありますが、最初に、セルの仕切り自体がオーバーレイであることに注意してください (tableView によって提供されます)。最初の方法は、セル内で複数のビューを使用することです。2 番目の方法は、UIScrollView に適切なビューを挿入して、セルの背後または上にシャドウ/ブレンド ビューをアンダーレイ/オーバーレイすることです。各セルに 1 つのビュー/drawRect しかないという以前の声明を考えると、これはおそらく彼らが行っていることです。それぞれの方法には課題がありますが、個人的には、セルを 3 つのビュー (シャドウ、コンテンツ、シャドウ) に分割する方が簡単だと思います。最初/最後のセルの状況を処理するのがずっと簡単になります。

于 2012-05-14T15:38:36.700 に答える
0

私の意見は次のとおりです。さまざまなレイヤープロパティを使用してCoreAnimationに影を描画させないでください。事前にレンダリングされた画像を両側に描画するだけです。これは実際には影です。ストレッチドローでセルの可変高さを因数分解すると、うまくいく場合があります。

編集：背景が無地の場合、視覚的な魅力に影響を与えていることを知らなくても、事前にレンダリングされた影を両側に適用できます。

それが当てはまらない場合は、テーブルビューを縮小して影のないサイズにする必要があります。次に、すべてのセルに対してシャドウを作成せずに、「上」にシャドウをブレンドできます。本当にスクロールしません。これは、シャドウに「テクスチャ」がない場合にのみ機能します。そうでない場合は、シャドウが上に適用されていることに気付くでしょう。

于 2012-05-14T18:52:43.190 に答える
0

これらの行に沿って何かを推測する必要があります
http://developer.apple.com/library/mac/#documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/dq_shadows/dq_shadows.html 

  CGContextRef context = UIGraphicsGetCurrentContext();

UIBezierPath* path = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:10.0f];

CGContextSaveGState(context);
CGRect leftRect = CGRectZero;
CGContextClipToRect(context, leftRect );
CGContextSetBlendMode(context, kCGBlendModeNormal);
// draw shadow

//    Call the function CGContextSetShadow, passing the appropriate values.
//    Perform all the drawing to which you want to apply shadows.
CGContextSetShadowWithColor(context, CGSizeMake(1.0f, 1.0f), 10.0f, [UIColor blackColor].CGColor);
CGContextAddPath(context, path.CGPath);
CGContextDrawPath(context, kCGPathStroke);


CGContextRestoreGState(context);

CGContextSaveGState(context);
CGRect middleSection = CGRectZero;
CGContextClipToRect(context, middleSection);
CGContextSetFillColorWithColor(context, self.backgroundColor.CGColor);
CGContextFillRect(context, self.bounds);
// draw opaque
CGContextSetBlendMode(context, kCGBlendModeCopy); 

CGContextRestoreGState(context);
于 2012-05-14T15:38:55.887 に答える