uiimagepickercontroller - Cropping an Image to the shape of an Overlay - iOS -


i'm adding overlay using pickercontroller's view , uinavigationcontrollerdelegate below.

-(void)navigationcontroller:(uinavigationcontroller *)navigationcontroller didshowviewcontroller:  (uiviewcontroller *)viewcontroller animated:(bool)animated{     if ([navigationcontroller.viewcontrollers count] == 3)      {        cgfloat screenheight = [[uiscreen mainscreen] bounds].size.height;         uiview *plcropoverlay = [[[viewcontroller.view.subviews objectatindex:1]subviews] objectatindex:0];         plcropoverlay.hidden = yes;         int position = 0;         if (screenheight == 568)        {            position = 124;        }        else        {           position = 80;       }        cashapelayer *circlelayer = [cashapelayer layer];        uibezierpath *path2 = [uibezierpath bezierpathwithovalinrect:                            cgrectmake(0.0f, position, 320.0f, 320.0f)];       [path2 setusesevenoddfillrule:yes];        [circlelayer setpath:[path2 cgpath]];        [circlelayer setfillcolor:[[uicolor clearcolor] cgcolor]];       uibezierpath *path = [uibezierpath bezierpathwithroundedrect:cgrectmake(0, 0, 320, screenheight-72) cornerradius:0];        [path appendpath:path2];       [path setusesevenoddfillrule:yes];        cashapelayer *filllayer = [cashapelayer layer];       filllayer.path = path.cgpath;       filllayer.fillrule = kcafillruleevenodd;       filllayer.fillcolor = [uicolor blackcolor].cgcolor;       filllayer.opacity = 0.8;       [viewcontroller.view.layer addsublayer:filllayer];    } } 

when overlay defined above added, tend view:

enter image description here

i can crop image square using defined cgrect.

   cgimageref imageref = cgimagecreatewithimageinrect([imagetocrop cgimage], rect);     uiimage *cropped = [uiimage imagewithcgimage:imageref];    cgimagerelease(imageref); 

how approaching problem there circular overlay , imagepickers editing property yes? can zoom in , zoom out of pic. how can make use of bezierpath here?

the short answer question addclip , mention you're beginner, here's steps z!!

firstly, try category, see if helps. (if you're not familiar w/ categories have google or ask here in comment.)

-(uiimage *)domask     {     uiimage *maskimage = [uiimage imagenamed:@"yourmask.png"];      cgimageref maskref = maskimage.cgimage;      cgimageref mask = cgimagemaskcreate(cgimagegetwidth(maskref),         cgimagegetheight(maskref),         cgimagegetbitspercomponent(maskref),         cgimagegetbitsperpixel(maskref),         cgimagegetbytesperrow(maskref),         cgimagegetdataprovider(maskref), null, false);      cgimageref maskedimageref = cgimagecreatewithmask([self cgimage], mask);     uiimage *maskedimage = [uiimage imagewithcgimage:maskedimageref];      cgimagerelease(mask);     cgimagerelease(maskedimageref);      return maskedimage;     } 

just create (i mean in photoshop) png mask, , familiar process.

i encourage master process first...

here critical categories help...

-(uiimage *)becomesquare     {     cgsize imagesize = self.size;     cgfloat width = imagesize.width;     cgfloat height = imagesize.height;      uiimage *result = self;      if (width != height)         {         cgfloat newdimension = min(width, height);         cgfloat widthoffset = (width - newdimension) / 2;         cgfloat heightoffset = (height - newdimension) / 2;          uigraphicsbeginimagecontextwithoptions(             cgsizemake(newdimension, newdimension), no, 0. );          [result drawatpoint:cgpointmake(-widthoffset, -heightoffset)             blendmode:kcgblendmodecopy alpha:1. ];         result = uigraphicsgetimagefromcurrentimagecontext();         uigraphicsendimagecontext();         }      return result;     } 

and couple more ...

-(uiimage *)doscale     {     uiimage *result = self;      cgsize size = cgsizemake(320,320);     uigraphicsbeginimagecontextwithoptions(size, no, 0.0f);     [result drawinrect:cgrectmake(0.0f, 0.0f, size.width, size.height)];     result = uigraphicsgetimagefromcurrentimagecontext();     uigraphicsendimagecontext();     return result;     }  -(uiimage *)scaled640anyshape     {     if ( self.size.height < 5.0 ) return nil;     if ( self.size.width < 5.0 ) return nil;      uiimage *result = self;      float widthshouldbe = 640.0;     float heightshouldbe = widthshouldbe * ( self.size.height / self.size.width );      cgsize size = cgsizemake( widthshouldbe ,heightshouldbe );      uigraphicsbeginimagecontextwithoptions(size, no, 0.0f);     [result drawinrect:cgrectmake(0.0f, 0.0f, size.width, size.height)];     result = uigraphicsgetimagefromcurrentimagecontext();     uigraphicsendimagecontext();     return result;     } 

(obviously change hard-coded output sizes wish.)

note final result, achieved, combination in appropriate order, such as:

yourimage = [yourimage dosquare]; yourimage = [yourimage domask]; 

once you've got working ...

then ....

for literally ask, there many example codes .. e.g., https://stackoverflow.com/a/13870097/294884

as can see, fundamentally...

uigraphicsbeginimagecontextwithoptions(...); uibezierpath * path = [uibezierpath     bezierpathwithroundedrect:imagerect cornerradius:10.f]; [path addclip]; [yourimage drawinrect:imagerect]; ... ... uigraphicsgetimagefromcurrentimagecontext(); .. see extensive code above how save , on. 

you have zoom right scaling examples above.

also note this, when changing "area cropped"... https://stackoverflow.com/a/17884863/294884

here's example of critical technique...

-(uiimage *)squareandsmall     {     // genius credits: https://stackoverflow.com/a/17884863/294884      cgsize finalsize = cgsizemake(640,640);      cgfloat scale = max(         finalsize.width/self.size.width,         finalsize.height/self.size.height);     cgfloat width = self.size.width * scale;     cgfloat height = self.size.height * scale;      // example, central area....     cgrect imagerect = cgrectmake(                   (finalsize.width - width)/2.0f,                   (finalsize.height - height)/2.0f,                   width, height);      // or, top area... cgrect imagerect = cgrectmake( 0, 0, width, height);      uigraphicsbeginimagecontextwithoptions(finalsize, no, 0);     [self drawinrect:imagerect];     uiimage *newimage = uigraphicsgetimagefromcurrentimagecontext();         uigraphicsendimagecontext();     return newimage;     } 

hope helps!


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

django - CSRF verification failed. Request aborted. CSRF cookie not set -

jsf - How to ajax update an item in the footer of a PrimeFaces dataTable? -