如何畫一個圓圈目標的百分比ç

Question

我可以根據需要佈局像相同的圖像 ，但我不能得出這樣的所以這方面有任何想法，

Answer 1

如果你知道你的弦位置可以通過設置剪輯區域然後填充圓來填充和絃。

要計算出和絃的位置以給出x％的面積，您需要執行一些幾何/三角函數。不通過中心的每一個弦與中心形成等腰三角形，並且該三角形的兩邊是半徑限定圓的一部分。因此，不通過中心的弦的一側的區域是三角形和段的面積的差異，並且您可以計算出和絃如何劃分該區域或者和絃需要如何劃分面積以特定的比例。

如果這一切聽起來像gobbledegook嘗試查找和絃幾何，你無疑會找到有用的圖表和公式的書籍/網站。

HTH

Answer 2

最簡單的方法是有兩個子視圖，一個爲綠色「百分比填充」水平，一個用於標籤的文本視圖。然後，您可以更新frame以獲得「填充百分比」，顯然是基於您希望達到的百分比。然後將圓形面具應用於整個事情。

例如：

// CircleLevelView.h 
// 
// Created by Robert Ryan on 10/28/17. 

#import <UIKit/UIKit.h> 

IB_DESIGNABLE 
@interface CircleLevelView : UIView 

/// Percent filled 
/// 
/// Value between 0.0 and 1.0. 

@property (nonatomic)   IBInspectable CGFloat percent; 

/// Text to show up in center of view 
/// 
/// Value between 0.0 and 1.0. 

@property (nonatomic, strong) IBInspectable NSString *text; 

@end 

而且

// CircleLevelView.m 
// 
// Created by Robert Ryan on 10/28/17. 

#import "CircleLevelView.h" 

@interface CircleLevelView() 
@property (nonatomic, weak) CAShapeLayer *circleMask; 
@property (nonatomic, weak) UILabel *label; 
@property (nonatomic, weak) UIView *fillView; 

@end 

@implementation CircleLevelView 

@synthesize percent = _percent; 

- (instancetype)initWithCoder:(NSCoder *)aDecoder { 
    self = [super initWithCoder:aDecoder]; 

    [self configure]; 

    return self; 
} 

- (instancetype)initWithFrame:(CGRect)frame { 
    self = [super initWithFrame:frame]; 

    [self configure]; 

    return self; 
} 

- (instancetype)init { 
    return [self initWithFrame:CGRectZero]; 
} 

- (void)configure { 
    self.clipsToBounds = true; 

    UILabel *fillView = [[UILabel alloc] init]; 
    fillView.translatesAutoresizingMaskIntoConstraints = false; 
    fillView.backgroundColor = [UIColor colorWithRed:169.0/255.0 
               green:208.0/255.0 
               blue:66.0/255.0 
               alpha:1.0]; 
    [self addSubview:fillView]; 
    self.fillView = fillView; 

    UILabel *label = [[UILabel alloc] init]; 
    label.translatesAutoresizingMaskIntoConstraints = false; 
    label.backgroundColor = [UIColor clearColor]; 
    label.textColor = [UIColor blackColor]; 
    label.textAlignment = NSTextAlignmentCenter; 
    [self addSubview:label]; 
    self.label = label; 

    [NSLayoutConstraint activateConstraints:@[ 
     [label.topAnchor constraintEqualToAnchor:self.topAnchor], 
     [label.bottomAnchor constraintEqualToAnchor:self.bottomAnchor], 
     [label.leadingAnchor constraintEqualToAnchor:self.leadingAnchor], 
     [label.trailingAnchor constraintEqualToAnchor:self.trailingAnchor], 
     [fillView.topAnchor constraintEqualToAnchor:self.topAnchor], 
     [fillView.bottomAnchor constraintEqualToAnchor:self.bottomAnchor], 
     [fillView.leadingAnchor constraintEqualToAnchor:self.leadingAnchor], 
     [fillView.trailingAnchor constraintEqualToAnchor:self.trailingAnchor] 
    ]]; 

    CAShapeLayer *circleMask = [CAShapeLayer layer]; 
    circleMask.fillColor = [UIColor whiteColor].CGColor; 
    circleMask.strokeColor = [UIColor blackColor].CGColor; 
    circleMask.lineWidth = 0; 
    self.layer.mask = circleMask; 
    self.circleMask = circleMask; 
} 

- (void)layoutSubviews { 
    [super layoutSubviews]; 

    CGPoint center = CGPointMake(self.bounds.origin.x + self.bounds.size.width/2.0, self.bounds.origin.y + self.bounds.size.height/2.0); 
    CGFloat radius = MIN(self.bounds.size.width, self.bounds.size.height)/2.0; 
    self.circleMask.path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:0 endAngle:M_PI * 2.0 clockwise:true].CGPath; 

    [self updatePercentFill]; 
} 

- (void)updatePercentFill { 
    CGFloat circleHeight = MIN(self.bounds.size.width, self.bounds.size.height); 
    CGFloat percentHeight = circleHeight * self.percent; 
    self.fillView.frame = CGRectMake(0, 
            (self.bounds.size.height - circleHeight)/2 + (circleHeight - percentHeight), 
            self.bounds.size.width, 
            circleHeight); 
} 

// MARK: - Custom Accessor Methods 

- (CGFloat)percent { 
    return _percent; 
} 

- (void)setPercent:(CGFloat)percent { 
    _percent = percent; 

    [self updatePercentFill]; 
} 

- (NSString *)text { 
    return self.label.text; 
} 

- (void)setText:(NSString *)text { 
    self.label.text = text; 
} 

@end 

國債收益率：