使用锚点和可伸缩图像为UIView设置动画

Question

我正在试图制作条形图，其中图像从底部升起。几个小时后，我发现这不容易实现。

我只想做一件事：

创建一个从底部中心锚点扩展的动画。

- (void)startCharts{

//set the stretchable images
UIImage* stretchGray = [UIImage imageNamed:@"rescueGrayChart"];
stretchGray = [stretchGray resizableImageWithCapInsets:UIEdgeInsetsMake(50, 0, 10, 0) resizingMode:UIImageResizingModeStretch];
self.grayChart.image = stretchGray;

//set the start frame and anchor point
CGRect gframe = self.grayChart.frame;
CGPoint bottomCenterGray = CGPointMake(CGRectGetMidX(gframe), CGRectGetMaxY(gframe));
self.grayChart.layer.anchorPoint = CGPointMake(0.5, 1);

[UIView animateWithDuration:5
    delay:0
    options:UIViewAnimationOptionCurveEaseOut
    animations:^{

                     //this creates the issue where the image scales outwards from center (see image)
                     CGRect frame = self.grayChart.frame;
                     frame.size.height = 300;
                     self.grayChart.frame = frame;

                    //this animates up from bottom, but stretches the image
        /*
                    [CATransaction begin];
                    self.grayChart.layer.transform = CATransform3DMakeScale(1, 2, 1);
                    [CATransaction commit];
         */

    }
    completion:nil];

//readjust the frame
self.grayChart.layer.position = bottomCenterGray;}

**这些图像是动画期间拍摄的屏幕截图

感谢您的时间。