IOS interface-continuation of Drawer interaction on the left side of Netease News (adding news content pages and comments page gestures)

1. Introduction

Some bloggers read the previous blogIOS interface-drawer interaction on the left side of Netease newsIn Weibo, I asked how to drag and drop content and comments in NetEase news,

How to embed uinavigation above. Many people may have such a demand. Now it takes some time to make these two effects,

Share with you. The idea is similar to the previous article, but uinavigation is not used. In my opinion,

The comment button can be added through addsubview. The interaction between content pages and comments pages is as follows:

The arrow in the figure is the direction of the gesture drag.2. The buttons for adding Netease news are clickable. In this example, you can use gestures to add Netease news. When running the sample code, pay attention to the following content: I added some buttons in the code, and the area in the red box in the figure below can be clicked and redirected: the first news can be clicked on the list page, you can click back in the upper left corner of the content page, or click back in the upper left corner of the comment page. The rest are images. 3. Some codes follow the mview code to make the view detailview of news content. The Code is as follows:

--

# Import <uikit/uikit. h> @ Class commentview; @ interface detailview: uiview {commentview * commentview; bool ispancomment;}-(ID) initwithview :( uiview *) contentview parentview :( uiview *) parentview; @ property (nonatomic, strong) uiview * parentview; // parent view of the drawer view @ property (nonatomic, strong) uiview * contentview; // view of the drawer display content @ end

//// Detailview. M // neteasenews /// created by rongfzh on 13-3-5. // copyright (c) 2013 rongfzh. all rights reserved. // # import "detailview. H "# import" commentview. H "# import <quartzcore/quartzcore. h> @ implementation detailview-(ID) initwithframe :( cgrect) frame {self = [Super initwithframe: frame]; If (Self) {// initialization code} return self ;} -(ID) initwithview :( uiview *) contentview parentview :( uivi EW *) parentview {self = [Super initwithframe: cgrectmake (0, 0, contentview. frame. size. width, contentview. frame. size. height)]; If (Self) {[self addsubview: contentview]; then * pangesturerecognier = [[uipangesturerecognizer alloc] initwithtarget: Self action: @ selector (handlepan :)]; [self addgesturerecognizer: pangesturerecognier]; uibutton * backbtn = [uibutton buttonwithtype: uibuttontyp Ecustom]; backbtn. frame = cgrectmake (0, 0, 80, 50); [backbtn addtarget: Self action: @ selector (Back :) forcontrolevents: uicontroleventtouchupinside]; [self addsubview: backbtn]; uiimageview * imagecommentview = [[uiimageview alloc] initwithimage: [uiimage imagenamed: @ "comment.png"]; imagecommentview. frame = cgrectmake (0, 0, self. frame. size. width, self. frame. size. height); commentview = [[commentview allo C] initwithview: imagecommentview parentview: Self]; commentview. center = cgpointmake (480,230); [[commentview layer] setshadowoffset: cgsizemake (10, 10)]; [[commentview layer] setshadowradius: 20]; [[commentview layer] setshadowopacity: 1]; [[commentview layer] setshadowcolor: [uicolor blackcolor]. cgcolor]; [self addsubview: commentview]; ispancomment = no;} self. parentview = parentview; return self ;}- (Void) handlepan :( uipangesturerecognizer *) pangesturerecognizer {cgpoint translation = [pangesturerecognizer translationinview: Self. parentview]; float x = self. center. X + translation. x; If (x <160) {x = 160;} If (translation. x> 0) {If (! Ispancomment) {self. Center = cgpointmake (x, 230) ;}} if (translation. x <0 & self. Center. x> 160) {If (! Ispancomment) {self. center = cgpointmake (x, 230) ;}} else if (translation. x <0) {ispancomment = yes; commentview. center = cgpointmake (commentview. center. X + translation. x, 230);} If (commentview. center. x <480 & Translation. x> 0) {ispancomment = yes; commentview. center = cgpointmake (commentview. center. X + translation. x, 230);} If (pangesturerecognizer. state = uigesturerecognizerstateended) {If (commentview. center. x <400) {[uiview animatewithduration: 0.4 delay: 0.1 options: uiviewanimationcurveeaseinout animations: ^ (void) {commentview. center = cgpointmake (160,230);} completion: ^ (bool finish) {ispancomment = no;}];} else {[uiview animatewithduration: 0.4 delay: 0.1 options: uiviewanimationcurveeaseinout animations: ^ (void) {commentview. center = cgpointmake (480,230);} completion: ^ (bool finish) {ispancomment = no;}];} If (self. center. x> 190) {[uiview animatewithduration: 0.4 delay: 0.1 options: uiviewanimationcurveeaseinout animations: ^ (void) {self. center = cgpointmake (480,230);} completion: ^ (bool finish) {[self. parentview exchangesubviewatindex: 1 withsubviewatindex: 2];} else {[uiview animatewithduration: 0.4 delay: 0.1 options: uiviewanimationcurveeaseinout animations: ^ (void) {self. center = cgpointmake (160,230);} completion: ^ (bool finish) {}] ;}} [pangesturerecognizer settranslation: cgpointzero inview: Self. parentview];}-(void) Back :( ID) sender {[uiview animatewithduration: 0.4 delay: 0.1 options: uiviewanimationcurveeaseinout animations: ^ (void) {self. center = cgpointmake (480,230);} completion: ^ (bool finish) {[self. parentview exchangesubviewatindex: 1 withsubviewatindex: 2];}/* // only override drawrect: If you perform custom drawing. // an empty implementation adversely affects performance during animation. -(void) drawrect :( cgrect) rect {// drawing code} */@ end

3. The view on the comment page is similar to the Code on the Content Page.

The code is worth optimizing a lot. Now it only shows that the function is implemented, and some code for gesture judgment is messy. As long as you have mastered the original gesture, the code can be modified as needed.

Code:

GitHub: https://github.com/schelling/NeteaseNews

Http://download.csdn.net/detail/totogo2010/5110546 (csdn) Resources

Rong Fangzhi (http://blog.csdn.net/totogo2010)

This article follows the "signature-non-commercial use-consistency" creation public agreement