Я новичок в разработке iOS, и я пытаюсь создать игру, которая показывает выигрыши и проигрыши пользователя на горизонтальной панели, например:
Нужно ли мне для этого использовать два UIImageView? Кроме того, как настроить шкалу в зависимости от выигрышей и проигрышей? Буду признателен за любую помощь в том, как это сделать. Спасибо.
2 ответа
Этот автоматически сгенерированный код должен быть довольно близок к тому, что вам нужно. Делайте то, что говорит @rmaddy, и создайте подкласс UIView. Вам нужно будет открыть два свойства для выигрышей и проигрышей. Метод drawRect должен вызывать метод ниже, передавая границы представления в качестве значения myFrame. Вам придется поиграть с цветами и шрифтами, но в остальном он должен быть очень близок к тому, что вы хотите. И, как сказал @earlgray, он должен динамически рисоваться в зависимости от количества побед и поражений, без необходимости в изображениях.
- (void)drawPerformanceBarWithWins: (CGFloat)wins losses: (CGFloat)losses myFrame: (CGRect)myFrame
{
//// General Declarations
CGContextRef context = UIGraphicsGetCurrentContext();
//// Color Declarations
UIColor* winColor = [UIColor colorWithRed: 0.13 green: 0.78 blue: 0.13 alpha: 1];
UIColor* loseColor = [UIColor colorWithRed: 0.805 green: 0.055 blue: 0.055 alpha: 1];
//// Variable Declarations
NSString* winsText = [NSString stringWithFormat: @"%ld", (NSInteger)round(wins)];
NSString* lossesText = [NSString stringWithFormat: @"%ld", (NSInteger)round(losses)];
CGFloat endCapX = myFrame.size.width - 15;
CGFloat redBoxWidth = (myFrame.size.width - 30) * losses / (wins + losses);
CGRect redBox = CGRectMake(myFrame.size.width - redBoxWidth - 15, 0, redBoxWidth, myFrame.size.height);
CGFloat endCapHeightScale = myFrame.size.height / 60.0;
//// Background Rectangle Drawing
UIBezierPath* backgroundRectanglePath = [UIBezierPath bezierPathWithRoundedRect: myFrame cornerRadius: 10];
[winColor setFill];
[backgroundRectanglePath fill];
//// End Cap
{
CGContextSaveGState(context);
CGContextTranslateCTM(context, endCapX, 0);
CGContextScaleCTM(context, 1, endCapHeightScale);
//// End Cap Bezier Drawing
UIBezierPath* endCapBezierPath = UIBezierPath.bezierPath;
[endCapBezierPath moveToPoint: CGPointMake(0, 0)];
[endCapBezierPath addCurveToPoint: CGPointMake(8.59, 0.65) controlPoint1: CGPointMake(4.4, 0) controlPoint2: CGPointMake(6.6, -0)];
[endCapBezierPath addLineToPoint: CGPointMake(8.97, 0.75)];
[endCapBezierPath addCurveToPoint: CGPointMake(14.54, 6.31) controlPoint1: CGPointMake(11.56, 1.69) controlPoint2: CGPointMake(13.6, 3.73)];
[endCapBezierPath addCurveToPoint: CGPointMake(15.29, 15.29) controlPoint1: CGPointMake(15.29, 8.68) controlPoint2: CGPointMake(15.29, 10.88)];
[endCapBezierPath addLineToPoint: CGPointMake(15.29, 44.71)];
[endCapBezierPath addCurveToPoint: CGPointMake(14.63, 53.3) controlPoint1: CGPointMake(15.29, 49.12) controlPoint2: CGPointMake(15.29, 51.32)];
[endCapBezierPath addLineToPoint: CGPointMake(14.54, 53.69)];
[endCapBezierPath addCurveToPoint: CGPointMake(8.97, 59.25) controlPoint1: CGPointMake(13.6, 56.27) controlPoint2: CGPointMake(11.56, 58.31)];
[endCapBezierPath addCurveToPoint: CGPointMake(0, 60) controlPoint1: CGPointMake(6.6, 60) controlPoint2: CGPointMake(4.4, 60)];
[endCapBezierPath addLineToPoint: CGPointMake(0, 0)];
[endCapBezierPath closePath];
[loseColor setFill];
[endCapBezierPath fill];
CGContextRestoreGState(context);
}
//// Variable Sized Rectangle Drawing
UIBezierPath* variableSizedRectanglePath = [UIBezierPath bezierPathWithRect: redBox];
[loseColor setFill];
[variableSizedRectanglePath fill];
//// Winning Label Drawing
CGRect winningLabelRect = CGRectMake(myFrame.origin.x, myFrame.origin.y, myFrame.size.width, myFrame.size.height);
CGRect winningLabelInset = CGRectInset(winningLabelRect, 5, 0);
NSMutableParagraphStyle* winningLabelStyle = NSMutableParagraphStyle.defaultParagraphStyle.mutableCopy;
winningLabelStyle.alignment = NSTextAlignmentLeft;
NSDictionary* winningLabelFontAttributes = @{NSFontAttributeName: [UIFont boldSystemFontOfSize: 36], NSForegroundColorAttributeName: UIColor.whiteColor, NSParagraphStyleAttributeName: winningLabelStyle};
CGFloat winningLabelTextHeight = [winsText boundingRectWithSize: CGSizeMake(winningLabelInset.size.width, INFINITY) options: NSStringDrawingUsesLineFragmentOrigin attributes: winningLabelFontAttributes context: nil].size.height;
CGContextSaveGState(context);
CGContextClipToRect(context, winningLabelInset);
[winsText drawInRect: CGRectMake(CGRectGetMinX(winningLabelInset), CGRectGetMinY(winningLabelInset) + (CGRectGetHeight(winningLabelInset) - winningLabelTextHeight) / 2, CGRectGetWidth(winningLabelInset), winningLabelTextHeight) withAttributes: winningLabelFontAttributes];
CGContextRestoreGState(context);
//// Losing Label Drawing
CGRect losingLabelRect = CGRectMake(myFrame.origin.x, myFrame.origin.y, myFrame.size.width, myFrame.size.height);
CGRect losingLabelInset = CGRectInset(losingLabelRect, 5, 0);
NSMutableParagraphStyle* losingLabelStyle = NSMutableParagraphStyle.defaultParagraphStyle.mutableCopy;
losingLabelStyle.alignment = NSTextAlignmentRight;
NSDictionary* losingLabelFontAttributes = @{NSFontAttributeName: [UIFont boldSystemFontOfSize: 36], NSForegroundColorAttributeName: UIColor.whiteColor, NSParagraphStyleAttributeName: losingLabelStyle};
CGFloat losingLabelTextHeight = [lossesText boundingRectWithSize: CGSizeMake(losingLabelInset.size.width, INFINITY) options: NSStringDrawingUsesLineFragmentOrigin attributes: losingLabelFontAttributes context: nil].size.height;
CGContextSaveGState(context);
CGContextClipToRect(context, losingLabelInset);
[lossesText drawInRect: CGRectMake(CGRectGetMinX(losingLabelInset), CGRectGetMinY(losingLabelInset) + (CGRectGetHeight(losingLabelInset) - losingLabelTextHeight) / 2, CGRectGetWidth(losingLabelInset), losingLabelTextHeight) withAttributes: losingLabelFontAttributes];
CGContextRestoreGState(context);
}
Создайте собственный класс WinLoseView.
Он будет состоять из
1) настраиваемая иерархия представлений
2) код брендинга (цвета, округление)
3) очень простой публичный интерфейс с двумя свойствами
- выигрывает
- потери
Иерархия представлений будет иметь
- два UIViews
- два UIlabels
Основное представление нужно немного округлить, используйте для этого свойство слоя UIview.
Похожие вопросы
Новые вопросы
ios
iOS - мобильная операционная система, работающая на Apple iPhone, iPod touch и iPad. Используйте этот тег [ios] для вопросов, связанных с программированием на платформе iOS. Используйте связанные теги [target-c] и [swift] для проблем, характерных для этих языков программирования.