Beauty 美图秀秀 beautify picture "border" interface Design "significant update"

Before writing the border, we need to inform everyone, the entire landscaping picture of the interface development has been completely rewritten, please download the latest project "Click to download"

In the previous development method due to the absence of many factors, resulting in viewcontroller code confusion, so the re-development of the interface, all the individual functions of landscaping pictures have a separate viewcontroller, so it is not easy to confuse. In addition to learning, use

Imagenamed method, if the picture format is PNG can not add. png, but other images such as JPG must add. jpg suffix.

First, the link

    Else if ([Text isequaltostring:@ " border "])    {        *VC = [[Fwborderviewcontroller alloc] initWithImage:self.image];        [Self PRESENTVIEWCONTROLLER:VC animated:yes completion:^{        }];    }

Second, loading interface

1. Load the picture to be processed

// Show Pictures    Self.imageview = [[Uiimageview alloc] initWithImage:self.image];     = CGRectMake (00);     = Uiviewcontentmodescaleaspectfit;    [Self.view AddSubview:self.imageView];

2. Load Save, Cancel button

　　

    //Save and Cancel button AdditionsUIImage *i1 = [UIImage imagenamed:@"[email protected]"]; Self.btnclose=[UIButton Buttonwithtype:uibuttontypecustom];    [Self.btnclose setimage:i1 Forstate:uicontrolstatenormal]; Self.btnClose.frame= CGRectMake ( -, Height-kcancelheight-Ten, Kcancelheight, kcancelheight); [Self.btnclose addtarget:self Action: @selector (btncancelorsaveclicked:) forControlEvents:    UIControlEventTouchUpInside];        [Self.view AddSubview:self.btnClose]; UIImage*i2 = [UIImage imagenamed:@"[email protected]"]; Self.btnsave=[UIButton Buttonwithtype:uibuttontypecustom];    [Self.btnsave Setimage:i2 Forstate:uicontrolstatenormal]; Self.btnSave.frame= CGRectMake (Width-kcancelheight- -, Height-kcancelheight-Ten, Kcancelheight, kcancelheight);    [Self.view AddSubview:self.btnSave]; [Self.btnsave addtarget:self Action: @selector (btncancelorsaveclicked:) forControlEvents: UIControlEventTouchUpInside];

3. Load border Style "poster, simple, colorful" bar

Self.stylebar = [[Fweffectbar alloc] Initwithframe:cgrectmake ( -, HEIGHT- +, $, -)]; Nsmutablearray*items = [[Nsmutablearray alloc] Initwithcapacity:0]; Nsarray*titles = [Nsarray arraywithobjects:@"Poster Border",@"Simple Border",@"Colorful Border", nil];  for(inti =0; I < [titles Count]; i + +) {Fweffectbaritem*item =[[Fweffectbaritem alloc] Initwithframe:cgrectzero]; Item.title=[titles OBJECTATINDEX:I];    [Items Addobject:item]; } self.styleBar.items=items; Self.styleBar.effectBarDelegate=Self ; [Self.stylebar setselecteditem:[self.stylebar.items Objectatindex:0]]; [Self EffectBar:self.styleBar didselectitematindex:0]; [Self.view AddSubview:self.styleBar];

4. Load the "more footage" view

Fwmoreeffectview *seview = [[Fwmoreeffectview alloc] Initwithframe:cgrectmake (  kheight, Kwidth, Kheight)];    [Self.view Addsubview:seview];

Fwmoreeffectview is a custom view, relatively simple, here is not much to introduce.

5. Loading a specific border style

　　　　

    Self.borderstylebar = [[Fweffectbar alloc] Initwithframe:cgrectmake (kheight) ];     = self ;     15.0 ;     50.0 ;     10.0 ;
Border Style default view

[Self setupposterborder];

    [Self.view AddSubview:self.borderStyleBar];

- (void) Setupbordereffect: (Nsarray *) images{Fweffectbaritem*item =Nil; Nsmutablearray*items = [[Nsmutablearray alloc] Initwithcapacity:0];  for(inti =0; I < [images count]; i++) {Item= [[Fweffectbaritem alloc] Initwithframe:cgrectmake ((kwidth + kSpace) * i +Ten,0, Kwidth, Kheight)]; Item.backgroundcolor=[Uicolor Whitecolor]; UIImage*IMG1 = [UIImage scaleimage:[uiimage imagenamed:[images objectatindex:i]] Targetwidth: -];        [item SETFINISHEDSELECTEDIMAGE:IMG1 WITHFINISHEDUNSELECTEDIMAGE:IMG1];    [Items Addobject:item]; } self.borderStyleBar.items=items;}

Define a method to load a specific border style, pass an array of style images, and invoke the following 3 methods to implement the display

//Simple Border View- (void) setupsimpleborderview{[self setupbordereffect:[nsarray arraywithobjects:@"border_baikuang_a.jpg",@"border_baolilai_a.jpg",@"border_heikuang_a.jpg",@"border_luxiangji_a.jpg",@"border_onenight_a.jpg",@"border_simple_15.jpg",@"border_simple_16.jpg",@"border_simple_17.jpg",@"border_simple_18.jpg",@"border_simple_19.jpg", nil]];}//Poster Border View- (void) setupposterborder{[self setupbordereffect:[nsarray arraywithobjects:@"PB1",@"PB2",@"PB3",@"PB4",@"PB5",@"Pb6",@"Pb7",@"Pb8",@"pb9",@"PB10", nil]];}//Colorful Border View- (void) setupdazzleborder{[self setupbordereffect:[nsarray arraywithobjects:@"xborder_aixin_a.jpg",@"xborder_guangyun_a.jpg",@"xborder_qisehua_a.jpg",@"xborder_wujiaoxing_a.jpg",@"xborder_xueye_a.jpg",@"xborder_yinhe_a.jpg", nil]];}

We do this by giving Borderstylebar different items to display the different styles item.

6. Implementation of the bar's mandate

#pragmamark-fweffectbardelegate-(void) Effectbar: (Fweffectbar *) Bar Didselectitematindex: (nsinteger) index{if(Bar = =Self.stylebar) {Switch(index) { Case 0: [Self setupposterborder];  Break;  Case 1: [Self setupsimpleborderview];  Break;  Case 2: [Self setupdazzleborder];  Break; }    }    Else{Fweffectbaritem*item = (Fweffectbaritem *) [Bar.items Objectatindex:index]; Item. Showborder=YES; }    }

When we click Stylebar, toggle the border style type, when we click Borderstylebar, apply the specific border style, and the selected style appears border.

Hide the status bar

// Hide Status bar - (BOOL) prefersstatusbarhidden{    return  YES;}

Over. thanks!

Beauty 美图秀秀 beautify picture "border" interface Design "significant update"