美文网首页iOS
iOS大转盘效果

iOS大转盘效果

作者: 幻想无极 | 来源:发表于2017-08-08 16:13 被阅读50次
    EE67D80A-1667-499C-A097-4EA5AC2702E0.gif
    demo链接:https://github.com/tqhnet/WJCircleTableView
    部分代码:
    
    - (void)setupShapeFormationInVisibleCells
    {
        //获取所有可见的cell下标
        NSArray *indexpaths = [self indexPathsForVisibleRows];
        NSUInteger totalVisibleCells =[indexpaths count];
        
        CGFloat angle_gap = M_PI/(_totalCellsVisible+1); // find the angle difference after dividing the table into totalVisibleCells +1
        
        //减去2个行高得到中心区域的一半
        
        //(self.frame.size.height - self.rowHeight*2.0f)/2.0f
        CGFloat vRadius = (self.frame.size.height - self.rowHeight*2.0f)/2.0f;
        //宽度的一半
        CGFloat hRadius = (self.frame.size.width )/2.0f;
        //那个小就用哪个
        CGFloat radius = (vRadius <  hRadius) ? vRadius : hRadius;
        
        CGFloat xRadius = radius;
        
        //初始cell的偏移
        CGFloat firstCellAngle = [self getAngleForYOffset:self.contentOffset.y];
        
        for( NSUInteger index =0; index < totalVisibleCells; index++ )
        {
            //得到对应的cell
            WJCircleTabCell *cell = (WJCircleTabCell*)[self cellForRowAtIndexPath:[ indexpaths objectAtIndex:index]];
            //得到cell的frame
            CGRect frame = cell.frame;
    
            //We can find the x Point by finding the Angle from the Ellipse Equation of finding y
    //        i.e. Y= vertical_radius * sin(t )
    //         t= asin(Y / vertical_radius) or asin = sin inverse
    //        CGFloat angle = (index +1)*angle_gap -( ( percentage_visible) * angle_gap);
            
            //变更角度
            CGFloat angle = firstCellAngle;
            NSLog(@"angle = %f",angle);
            firstCellAngle+= angle_gap;
            if( _contentAlignment == WJCircleTableViewContentAlignmentLeft )
            {
                angle =  angle + M_PI_2;
            }
            else {
                angle -= M_PI_2;
            }
            
            //Apply Angle in X point of Ellipse equation
            //i.e. X = horizontal_radius * cos( t )
            //here horizontal_radius would be some percentage off the vertical radius. percentage is defined by HORIZONTAL_RADIUS_RATIO
            //HORIZONTAL_RADIUS_RATIO of 1 is equal to circle
            
            //
            CGFloat x = xRadius  * cosf(angle );
            
            //Assuming, you have laid your tableview so that the entire frame is visible
            //TO DISPLAY RIGHT: then to display the circle towards right move the cellX (var x here) by half the width towards the right
            //TO DISPLAY LEFT : move the cellX by quarter the radius
            //FEEL FREE to play with x to allign the circle as per your needs
            
            
            if( _contentAlignment == WJCircleTableViewContentAlignmentLeft )
            {
                x = x + self.frame.size.width/2;// we have to shift the center of the circle toward the right
            }
            
            //算出x坐标改变位置,主要就是酸楚x位置进行改变
            frame.origin.x = x - 60;
            cell.deviation = x - 60;
            NSLog(@"x = %f",x);
            
            if( !isnan(x))
            {
    //            frame.size.height = x/(self.frame.size.width/2) *60;
    //            frame.size.height = x/100 * 100;
                cell.frame = frame;
    //            cell.alpha = x/(self.frame.size.width/2);
            
            }
        }
    }
    

    总结:效果不是很理想,想发优化中...有想法的可联系

    相关文章

      网友评论

        本文标题:iOS大转盘效果

        本文链接:https://www.haomeiwen.com/subject/uumalxtx.html