如何使用Quartz Core绘制星星？ [英] How to draw stars using Quartz Core?
本文介绍了如何使用Quartz Core绘制星星？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我试图改编Apple提供的一个例子，以编程方式绘制星星，代码如下：
CGContextRef context = UIGraphicsGetCurrentContext（）;
CGContextSetLineWidth（context，aSize）;
（NSUInteger i = 0; i< stars; i ++）
{
CGContextSetFillColorWithColor（context，aColor）;
CGContextSetStrokeColorWithColor（context，aColor）;
float w = item.size.width;
double r = w / 2;
double theta = 2 * M_PI *（2.0 / 5.0）; // 144度
CGContextMoveToPoint（context，0，r）; （NSUInteger k = 1; k <5; k ++）
{
float x = r * sin（k * theta）;
。
float y = r * cos（k * theta）;
CGContextAddLineToPoint（context，x，y）;
}
CGContextClosePath（context）;
CGContextFillPath（context）;
}
上面的代码绘制了一个完美的星形，但是显示为倒转2 。是黑色的，没有边框。我想要达到的目的是在同一条线上和给定的风格上画出许多恒星。我知道我实际上在同一个位置上绘制了相同的路径5次，并且我以某种方式垂直翻转了上下文，但经过几次测试后，我放弃了！ （我缺乏必要的数学和几何技能：P）...你能帮我吗？
$ b
更新：
好的，感谢 CocoaFu ，这是我的重构和工作画图工具：
- （void）drawStars：（NSUInteger）count inContext：（CGContextRef）context;
{
//常量
const float w = self.itemSize.width;
const float r = w / 2;
const double theta = 2 * M_PI *（2.0 / 5.0）;
const float flip = -1.0f; //垂直翻转（默认星形表示）
//绘制中心为星形
float xCenter = r;
for（NSUInteger i = 0; i< count; i ++）
{
//根据索引获取星型
CGContextSetFillColorWithColor（context，[self fillColorForItemAtIndex ：一世]）;
CGContextSetStrokeColorWithColor（context，[self strokeColorForItemAtIndex：i]）;
//更新位置
CGContextMoveToPoint（上下文，xCenter，r * flip + r）;
//为（NSUInteger k = 1; k <5; k ++）绘制必要的星线
{
float x = r * sin（k * THETA）;
float y = r * cos（k * theta）;
CGContextAddLineToPoint（context，x + xCenter，y * flip + r）;
}
//更新下一颗星星的水平中心
xCenter + = w + self.itemMargin;
//绘制当前星形
CGContextClosePath（context）;
CGContextFillPath（context）;
CGContextStrokePath（context）;
$ div $解析方案是一个代码，它会在水平线上画出3颗星，它不是很漂亮，但它可能有帮助：
- （void）drawRect ：（CGRect）rect
{
int aSize = 100.0;
const CGFloat color [4] = {0.0，0.0，1.0，1.0}; // Blue
CGColorRef aColor = CGColorCreate（CGColorSpaceCreateDeviceRGB（），color）;
CGContextRef context = UIGraphicsGetCurrentContext（）;
CGContextSetLineWidth（context，aSize）;
CGFloat xCenter = 100.0;
CGFloat yCenter = 100.0;
float w = 100.0;
double r = w / 2.0;
float flip = -1.0;
（NSUInteger i = 0; i <3; i ++）
{
CGContextSetFillColorWithColor（context，aColor）;
CGContextSetStrokeColorWithColor（context，aColor）;
double theta = 2.0 * M_PI *（2.0 / 5.0）; // 144度
CGContextMoveToPoint（上下文，xCenter，r * flip + yCenter）; （NSUInteger k = 1; k <5; k ++）
{
float x = r * sin（k * theta）;
。
float y = r * cos（k * theta）;
CGContextAddLineToPoint（上下文，x + xCenter，y * flip + yCenter）;
}
xCenter + = 150.0;
}
CGContextClosePath（context）;
CGContextFillPath（context）;
}
I'm trying to adapt an example provided by Apple in order to programmatically draw stars in line, the code is the following:
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(context, aSize);
for (NSUInteger i=0; i<stars; i++)
{
CGContextSetFillColorWithColor(context, aColor);
CGContextSetStrokeColorWithColor(context, aColor);
float w = item.size.width;
double r = w / 2;
double theta = 2 * M_PI * (2.0 / 5.0); // 144 degrees
CGContextMoveToPoint(context, 0, r);
for (NSUInteger k=1; k<5; k++)
{
float x = r * sin(k * theta);
float y = r * cos(k * theta);
CGContextAddLineToPoint(context, x, y);
}
CGContextClosePath(context);
CGContextFillPath(context);
}
The code above draws a perfect star, but is 1. displayed upside down 2. is black and without border. What I want to achive is to draw many stars on the same line and with the given style. I understand that I'm actually drawing the same path 5 times in the same position and that I have somehow to flip the context vertically, but after several tests I gave up! (I lack the necessary math and geometry skills :P)... could you please help me?
UPDATE:
Ok, thanks to CocoaFu, this is my refactored and working draw utility:
- (void)drawStars:(NSUInteger)count inContext:(CGContextRef)context;
{
// constants
const float w = self.itemSize.width;
const float r = w/2;
const double theta = 2 * M_PI * (2.0 / 5.0);
const float flip = -1.0f; // flip vertically (default star representation)
// drawing center for the star
float xCenter = r;
for (NSUInteger i=0; i<count; i++)
{
// get star style based on the index
CGContextSetFillColorWithColor(context, [self fillColorForItemAtIndex:i]);
CGContextSetStrokeColorWithColor(context, [self strokeColorForItemAtIndex:i]);
// update position
CGContextMoveToPoint(context, xCenter, r * flip + r);
// draw the necessary star lines
for (NSUInteger k=1; k<5; k++)
{
float x = r * sin(k * theta);
float y = r * cos(k * theta);
CGContextAddLineToPoint(context, x + xCenter, y * flip + r);
}
// update horizontal center for the next star
xCenter += w + self.itemMargin;
// draw current star
CGContextClosePath(context);
CGContextFillPath(context);
CGContextStrokePath(context);
}
}
解决方案
Here is code that will draw 3 stars in a horizontal line, it's is not pretty but it may help:
-(void)drawRect:(CGRect)rect
{
int aSize = 100.0;
const CGFloat color[4] = { 0.0, 0.0, 1.0, 1.0 }; // Blue
CGColorRef aColor = CGColorCreate(CGColorSpaceCreateDeviceRGB(), color);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(context, aSize);
CGFloat xCenter = 100.0;
CGFloat yCenter = 100.0;
float w = 100.0;
double r = w / 2.0;
float flip = -1.0;
for (NSUInteger i=0; i<3; i++)
{
CGContextSetFillColorWithColor(context, aColor);
CGContextSetStrokeColorWithColor(context, aColor);
double theta = 2.0 * M_PI * (2.0 / 5.0); // 144 degrees
CGContextMoveToPoint(context, xCenter, r*flip+yCenter);
for (NSUInteger k=1; k<5; k++)
{
float x = r * sin(k * theta);
float y = r * cos(k * theta);
CGContextAddLineToPoint(context, x+xCenter, y*flip+yCenter);
}
xCenter += 150.0;
}
CGContextClosePath(context);
CGContextFillPath(context);
}
这篇关于如何使用Quartz Core绘制星星？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
