1

このカルーセルを実現するために、iCarousel を微調整しようとしています。

ここに画像の説明を入力

iCarousel を使用しています: https://github.com/nicklockwood/iCarousel

これが私の現在の仕事です:

ここに画像の説明を入力

だから私が今する必要があるのは、カルーセルのパースペクティブを変更し、中央のアイテムを拡大することです. 私は少し迷っています。同じ問題に関連するこの投稿を見つけました:

iPhone - カルーセル

そこで、iCarousel クラスを次のように変更しました。

- (CATransform3D)transformForItemView:(UIView *)view withOffset:(CGFloat)offset
{   
    //set up base transform
    CATransform3D transform = CATransform3DIdentity;
    transform.m34 = _perspective;
    transform = CATransform3DTranslate(transform, -_viewpointOffset.width, -_viewpointOffset.height, 0.0f);

    //perform transform
    switch (_type)
    {
        case iCarouselTypeCustom:
        {
            if ([_delegate respondsToSelector:@selector(carousel:itemTransformForOffset:baseTransform:)])
            {
                return [_delegate carousel:self itemTransformForOffset:offset baseTransform:transform];
            }

            //else, fall through to linear transform
        }
        case iCarouselTypeLinear:
        {
            CGFloat spacing = [self valueForOption:iCarouselOptionSpacing withDefault:1.0f];
            if (_vertical)
            {
                return CATransform3DTranslate(transform, 0.0f, offset * _itemWidth * spacing, 0.0f);
            }
            else
            {
                return CATransform3DTranslate(transform, offset * _itemWidth * spacing, 0.0f, 0.0f);
            }
        }
        case iCarouselTypeRotary:
        {
            CGFloat count = [self circularCarouselItemCount];
            CGFloat spacing = [self valueForOption:iCarouselOptionSpacing withDefault:1.0f];
            CGFloat arc = [self valueForOption:iCarouselOptionArc withDefault:M_PI * 2.0f];
            CGFloat radius = [self valueForOption:iCarouselOptionRadius withDefault:fmaxf(_itemWidth * spacing / 2.0f, _itemWidth * spacing / 2.0f / tanf(arc/2.0f/count))];
            CGFloat angle = [self valueForOption:iCarouselOptionAngle withDefault:offset / count * arc];

            if (_type == iCarouselTypeInvertedRotary)
            {
                radius = -radius;
                angle = -angle;
            }

            if (_vertical)
            {
                return CATransform3DTranslate(transform, 0.0f, radius * sin(angle), radius * cos(angle) - radius);
            }
            else
            {
                float MAX_TILT_VALUE = 3.0f;
                float tilt = MAX_TILT_VALUE * cos(angle); // greater angle means greater vertical offset
                return CATransform3DTranslate(transform, radius * sin(angle), tilt, radius * cos(angle) - radius);
            }
        }

ちなみにiCarouselTypeRotaryを使っています。私はすべての値をうまく調整していませんでした。あなたの助けに感謝します。私はグラフィックプログラミングが好きです。それは私にとって新しいことです。

ありがとう。

4

1 に答える 1

2

達成しようとしているものに近い効果を得る方法は次のとおりです。

    case iCarouselTypeInvertedRotary:
    {
        ...
        //-- you might need to multiply radius by a certain factor to make the carousel appear denser:
        CGFloat radius = 0.35 * [self valueForOption:iCarouselOptionRadius withDefault:fmaxf(_itemWidth * spacing / 2.0f, _itemWidth * spacing / 2.0f / tanf(arc/2.0f/count))];

        ...

        else
        {

            //-- for the not inverted case, you need to add
            //-- an y-axis translation factor to add depth-tilting of the carousel plane
            //-- + a factor to increase depth-scaling effect:

            return CATransform3DTranslate(transform,
                            radius * sin(angle),
                            0.5 * radius * cos(angle),
                            2.0 * (radius * cos(angle) - radius));
        }
    }

正しい効果を得るために微調整が必​​要なサンプル値を使用しました。

ところで、これを行う正しい方法は を変更するtransformForItemViewことではなく、カルーセルを に変更してからiCarouselTypeCustom、デリゲートで変換を返す必要がありますcarousel:itemTransformForOffset:baseTransform:

于 2013-01-16T11:01:39.033 に答える