cocoa touch - How do you set a gradient fillcolor for cashapelayer without using a mask? -
how set gradient fillcolor cashapelayer? related question clearer explanation: using cocoa follow path gradient
i need gradient that's not mask, instead gradient based on drawing of cashapelayer's path.
i can't use gradient mask on top, because i'm making route on minimap in game. if player walks on own tracks, should in different color.
i want mapview's polyline:
source: http://cdn4.raywenderlich.com/wp-content/uploads/2014/06/23_multicolor_polyline.png
i made minimap route by: logging user's different directions, running them through loop bezier paths.
i appended bezier paths, , put on cashapelayer.
is there way have multicolored in cashapelayer?
is there keypath cabasicanimation can put gradient?
my code below, , images.
[mymapview.layer.sublayers makeobjectsperformselector:@selector(removefromsuperlayer)]; [[mymapview subviews] makeobjectsperformselector:@selector(removefromsuperview)]; int = 0; int x = 17; int y = 272; int m = 16; uibezierpath *kpath = [uibezierpath bezierpath]; while (i < histdirections.count) { if (i > 0) { uibezierpath *path = [uibezierpath bezierpath]; [path movetopoint:cgpointmake(x, y)]; if ([[histdirections objectatindex:i] intvalue] ==1) { [path addlinetopoint:cgpointmake(x, y-m)]; y = y - m; } else if ([[histdirections objectatindex:i] intvalue] ==2) { [path addlinetopoint:cgpointmake(x-m, y)]; x = x -m; } else if ([[histdirections objectatindex:i] intvalue] ==3) { [path addlinetopoint:cgpointmake(x+m, y)]; x = x+m; } else { [path addlinetopoint:cgpointmake(x, y+m)]; y = y - m; } [kpath appendpath:path]; } i++; } [catransaction begin]; [catransaction setanimationtimingfunction:[camediatimingfunction functionwithname:kcamediatimingfunctioneaseineaseout]]; [catransaction setcompletionblock:^{ uiimageview *viewpulse = [[uiimageview alloc] initwithframe:cgrectmake(x -5, y-5, 10.0, 10.0)]; viewpulse.image = [uiimage imagenamed:@"arro.png"]; viewpulse.backgroundcolor = [uicolor clearcolor]; if(direction == 1) { viewpulse.transform = cgaffinetransformmakerotation(-m_pi/2); } else if (direction == 2) { viewpulse.transform = cgaffinetransformmakerotation(m_pi); } else if (direction == 4) { viewpulse.transform = cgaffinetransformmakerotation(m_pi/2); } [mymapview addsubview:viewpulse]; cabasicanimation *scaleanimation = [cabasicanimation animationwithkeypath:@"transform.scale"]; scaleanimation.duration = 0.8; scaleanimation.repeatcount = huge_val; scaleanimation.autoreverses = yes; scaleanimation.fromvalue = [nsnumber numberwithfloat:1.6]; scaleanimation.tovalue = [nsnumber numberwithfloat:0.8]; [viewpulse.layer addanimation:scaleanimation forkey:@"scale"]; }]; cashapelayer *shapelayer = [cashapelayer layer]; kpath.linecapstyle = kcglinecapround; kpath.linecapstyle = kcglinejoinround; shapelayer.path = [kpath cgpath]; shapelayer.strokecolor = [[uicolor colorwithred:51/255.0f green:(51)/255.0f blue:170/255.0f alpha:1.0f] cgcolor]; shapelayer.linewidth = 4.0; shapelayer.linecap = kcalinecapround; shapelayer.fillcolor = [[uicolor clearcolor] cgcolor]; [mymapview.layer addsublayer:shapelayer]; cabasicanimation *hanimation = [cabasicanimation animationwithkeypath:@"strokeend"]; float dur = (histdirections.count * 0.27); if (dur > 2) { dur = 2; } hanimation.duration = dur; hanimation.repeatcount = 1.0; hanimation.fromvalue = [nsnumber numberwithfloat:0.0f]; hanimation.tovalue = [nsnumber numberwithfloat:1.0f]; /* cagradientlayer *gradientlayer = [cagradientlayer layer]; gradientlayer.frame = mymapview.frame; gradientlayer.colors = @[(__bridge id)[uicolor bluecolor].cgcolor,(__bridge id)[uicolor greencolor].cgcolor,(__bridge id)[uicolor yellowcolor].cgcolor,(__bridge id)[uicolor orangecolor].cgcolor, (__bridge id)[uicolor redcolor].cgcolor]; gradientlayer.startpoint = cgpointmake(0,0.5); gradientlayer.endpoint = cgpointmake(1,0.5); [mymapview.layer addsublayer:gradientlayer]; gradientlayer.mask = shapelayer;*/ [catransaction commit];
gradient mask:
monocolor line:
nevermind! figured out can do. since create layer multiple paths, put cgpaths array, , looped each path unique cashapelayer it's own color
Comments
Post a Comment